@unifiedsoftware/styles 2.0.0-alpha.10 → 2.0.0-alpha.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/fci.css +210 -89
- package/css/fci.min.css +1 -1
- package/css/styles.css +1 -1
- package/css/styles.min.css +1 -1
- package/package.json +1 -1
- package/scss/components/_accordion.scss +1 -1
- package/scss/themes/fci/components/_accordion.scss +7 -16
- package/scss/themes/fci/components/_button.scss +16 -3
- package/scss/themes/fci/components/_checkbox.scss +49 -8
- package/scss/themes/fci/components/_input.scss +30 -7
- package/scss/themes/fci/components/_radio.scss +47 -5
- package/scss/themes/fci/components/_switch.scss +40 -8
package/css/fci.css
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
.us-theme-fci .us-accordion {
|
|
2
|
+
--us-accordion-border-color: var(--us-border-color);
|
|
3
|
+
--us-accordion-item-border: 1px solid var(--us-accordion-border-color);
|
|
2
4
|
--us-accordion-header-border-color: var(--us-accordion-border-color);
|
|
3
5
|
--us-accordion-header-title-font-weight: 500;
|
|
4
6
|
--us-accordion-header-subtitle-font-weight: 400;
|
|
@@ -7,6 +9,7 @@
|
|
|
7
9
|
.us-theme-fci .us-accordion > .us-outline {
|
|
8
10
|
--us-outline-border-width: 0px;
|
|
9
11
|
--us-outline-z-index: 1;
|
|
12
|
+
--us-outline-border-color: var(--us-accordion-border-color);
|
|
10
13
|
}
|
|
11
14
|
.us-theme-fci .us-accordion--bordered:not(.us-accordion--splitted) {
|
|
12
15
|
--us-accordion-border-radius: 10px;
|
|
@@ -16,6 +19,7 @@
|
|
|
16
19
|
}
|
|
17
20
|
.us-theme-fci .us-accordion--bordered.us-accordion--splitted .us-accordion-item {
|
|
18
21
|
--us-accordion-border-radius: 10px;
|
|
22
|
+
--us-accordion-item-border: none;
|
|
19
23
|
}
|
|
20
24
|
.us-theme-fci .us-accordion--bordered.us-accordion--splitted .us-accordion-item > .us-outline {
|
|
21
25
|
--us-outline-border-width: 1px;
|
|
@@ -111,6 +115,7 @@
|
|
|
111
115
|
.us-theme-fci .us-accordion-item > .us-outline {
|
|
112
116
|
--us-outline-border-width: 0px;
|
|
113
117
|
--us-outline-z-index: 1;
|
|
118
|
+
--us-outline-border-color: var(--us-accordion-border-color);
|
|
114
119
|
}
|
|
115
120
|
.us-theme-fci .us-accordion-item--selected {
|
|
116
121
|
--us-accordion-header-title-font-weight: 700;
|
|
@@ -118,54 +123,6 @@
|
|
|
118
123
|
.us-theme-fci .us-accordion-body > .us-surface {
|
|
119
124
|
--us-surface-color: var(--us-white-color);
|
|
120
125
|
}
|
|
121
|
-
.us-theme-fci .us-accordion--primary > .us-outline {
|
|
122
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
123
|
-
--us-outline-opacity: 0.2;
|
|
124
|
-
}
|
|
125
|
-
.us-theme-fci .us-accordion-item--primary > .us-outline {
|
|
126
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
127
|
-
--us-outline-opacity: 0.2;
|
|
128
|
-
}
|
|
129
|
-
.us-theme-fci .us-accordion--secondary > .us-outline {
|
|
130
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
131
|
-
--us-outline-opacity: 0.2;
|
|
132
|
-
}
|
|
133
|
-
.us-theme-fci .us-accordion-item--secondary > .us-outline {
|
|
134
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
135
|
-
--us-outline-opacity: 0.2;
|
|
136
|
-
}
|
|
137
|
-
.us-theme-fci .us-accordion--success > .us-outline {
|
|
138
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
139
|
-
--us-outline-opacity: 0.2;
|
|
140
|
-
}
|
|
141
|
-
.us-theme-fci .us-accordion-item--success > .us-outline {
|
|
142
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
143
|
-
--us-outline-opacity: 0.2;
|
|
144
|
-
}
|
|
145
|
-
.us-theme-fci .us-accordion--info > .us-outline {
|
|
146
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
147
|
-
--us-outline-opacity: 0.2;
|
|
148
|
-
}
|
|
149
|
-
.us-theme-fci .us-accordion-item--info > .us-outline {
|
|
150
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
151
|
-
--us-outline-opacity: 0.2;
|
|
152
|
-
}
|
|
153
|
-
.us-theme-fci .us-accordion--warning > .us-outline {
|
|
154
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
155
|
-
--us-outline-opacity: 0.2;
|
|
156
|
-
}
|
|
157
|
-
.us-theme-fci .us-accordion-item--warning > .us-outline {
|
|
158
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
159
|
-
--us-outline-opacity: 0.2;
|
|
160
|
-
}
|
|
161
|
-
.us-theme-fci .us-accordion--danger > .us-outline {
|
|
162
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
163
|
-
--us-outline-opacity: 0.2;
|
|
164
|
-
}
|
|
165
|
-
.us-theme-fci .us-accordion-item--danger > .us-outline {
|
|
166
|
-
--us-outline-border-color: var(--us-accordion-border-color);
|
|
167
|
-
--us-outline-opacity: 0.2;
|
|
168
|
-
}
|
|
169
126
|
.us-theme-fci .us-accordion-item--plain.us-accordion-item--primary {
|
|
170
127
|
--us-accordion-header-color: var(--us-primary-color);
|
|
171
128
|
}
|
|
@@ -694,7 +651,7 @@ html {
|
|
|
694
651
|
--us-icon-font-size: 1.125rem;
|
|
695
652
|
}
|
|
696
653
|
.us-theme-fci .us-button--xl {
|
|
697
|
-
--us-button-height:
|
|
654
|
+
--us-button-height: 40px;
|
|
698
655
|
--us-button-padding-y: 0;
|
|
699
656
|
--us-button-padding-x: 1.25rem;
|
|
700
657
|
--us-button-font-size: 1rem;
|
|
@@ -705,9 +662,9 @@ html {
|
|
|
705
662
|
--us-icon-font-size: 1.25rem;
|
|
706
663
|
}
|
|
707
664
|
.us-theme-fci .us-button--2xl {
|
|
708
|
-
--us-button-height:
|
|
665
|
+
--us-button-height: 44px;
|
|
709
666
|
--us-button-padding-y: 0;
|
|
710
|
-
--us-button-padding-x: 1.
|
|
667
|
+
--us-button-padding-x: 1.5rem;
|
|
711
668
|
--us-button-font-size: 1.125rem;
|
|
712
669
|
--us-button-border-radius: 10px;
|
|
713
670
|
--us-button-gap: 0.75rem;
|
|
@@ -825,6 +782,15 @@ html {
|
|
|
825
782
|
--us-_focus-hover-overlay-opacity: 0.24;
|
|
826
783
|
--us-_focus-active-overlay-opacity: 0.32;
|
|
827
784
|
}
|
|
785
|
+
.us-theme-fci .us-button--outlined.us-button--secondary > .us-overlay {
|
|
786
|
+
--us-_hover-overlay-opacity: 0.08;
|
|
787
|
+
--us-_active-overlay-opacity: 0.12;
|
|
788
|
+
--us-_focus-hover-overlay-opacity: 0.08;
|
|
789
|
+
--us-_focus-active-overlay-opacity: 0.12;
|
|
790
|
+
}
|
|
791
|
+
.us-theme-fci .us-button--outlined.us-button--secondary > .us-outline {
|
|
792
|
+
--us-outline-opacity: 0.16;
|
|
793
|
+
}
|
|
828
794
|
.us-theme-fci .us-button--filled.us-button--success {
|
|
829
795
|
--us-button-background: var(--us-success-color);
|
|
830
796
|
}
|
|
@@ -1081,18 +1047,35 @@ html {
|
|
|
1081
1047
|
.us-theme-fci .us-input--text > .us-outline {
|
|
1082
1048
|
--us-outline-border-width: 1px;
|
|
1083
1049
|
}
|
|
1084
|
-
.us-theme-fci .us-input--filled
|
|
1050
|
+
.us-theme-fci .us-input--filled {
|
|
1085
1051
|
--us-input-placeholder-color: rgba(0, 0, 0, 0.6);
|
|
1086
1052
|
}
|
|
1087
|
-
.us-theme-fci .us-input--filled
|
|
1053
|
+
.us-theme-fci .us-input--filled > .us-overlay {
|
|
1088
1054
|
--us-overlay-color: #fff;
|
|
1089
1055
|
--us-overlay-opacity: 1;
|
|
1090
1056
|
}
|
|
1091
|
-
.us-theme-fci .us-input--filled
|
|
1057
|
+
.us-theme-fci .us-input--filled > .us-outline {
|
|
1092
1058
|
--us-outline-border-color: transparent;
|
|
1093
|
-
--us-outline-focus-border-color: var(--us-primary-color);
|
|
1094
1059
|
--us-outline-focus-opacity: 1;
|
|
1095
1060
|
}
|
|
1061
|
+
.us-theme-fci .us-input--filled.us-input--primary > .us-outline {
|
|
1062
|
+
--us-outline-focus-border-color: var(--us-primary-color);
|
|
1063
|
+
}
|
|
1064
|
+
.us-theme-fci .us-input--filled.us-input--secondary > .us-outline {
|
|
1065
|
+
--us-outline-focus-border-color: var(--us-secondary-color);
|
|
1066
|
+
}
|
|
1067
|
+
.us-theme-fci .us-input--filled.us-input--success > .us-outline {
|
|
1068
|
+
--us-outline-focus-border-color: var(--us-success-color);
|
|
1069
|
+
}
|
|
1070
|
+
.us-theme-fci .us-input--filled.us-input--info > .us-outline {
|
|
1071
|
+
--us-outline-focus-border-color: var(--us-info-color);
|
|
1072
|
+
}
|
|
1073
|
+
.us-theme-fci .us-input--filled.us-input--warning > .us-outline {
|
|
1074
|
+
--us-outline-focus-border-color: var(--us-warning-color);
|
|
1075
|
+
}
|
|
1076
|
+
.us-theme-fci .us-input--filled.us-input--danger > .us-outline {
|
|
1077
|
+
--us-outline-focus-border-color: var(--us-danger-color);
|
|
1078
|
+
}
|
|
1096
1079
|
.us-theme-fci .us-input--filled.us-input--light > .us-overlay {
|
|
1097
1080
|
--us-overlay-color: #fff;
|
|
1098
1081
|
--us-overlay-opacity: 0.8;
|
|
@@ -1104,20 +1087,37 @@ html {
|
|
|
1104
1087
|
--us-outline-focus-border-color: #fff;
|
|
1105
1088
|
--us-outline-focus-opacity: 1;
|
|
1106
1089
|
}
|
|
1107
|
-
.us-theme-fci .us-input--outlined
|
|
1090
|
+
.us-theme-fci .us-input--outlined {
|
|
1108
1091
|
--us-input-placeholder-color: rgba(0, 0, 0, 0.6);
|
|
1109
1092
|
}
|
|
1110
|
-
.us-theme-fci .us-input--outlined
|
|
1093
|
+
.us-theme-fci .us-input--outlined > .us-overlay {
|
|
1111
1094
|
--us-overlay-color: inherit;
|
|
1112
1095
|
--us-overlay-opacity: 0;
|
|
1113
1096
|
}
|
|
1114
|
-
.us-theme-fci .us-input--outlined
|
|
1097
|
+
.us-theme-fci .us-input--outlined > .us-outline {
|
|
1115
1098
|
--us-outline-border-color: currentColor;
|
|
1116
1099
|
--us-outline-opacity: 0.12;
|
|
1117
1100
|
--us-outline-hover-opacity: 0.24;
|
|
1118
|
-
--us-outline-focus-border-color: var(--us-primary-color);
|
|
1119
1101
|
--us-outline-focus-opacity: 1;
|
|
1120
1102
|
}
|
|
1103
|
+
.us-theme-fci .us-input--outlined.us-input--primary > .us-outline {
|
|
1104
|
+
--us-outline-focus-border-color: var(--us-primary-color);
|
|
1105
|
+
}
|
|
1106
|
+
.us-theme-fci .us-input--outlined.us-input--secondary > .us-outline {
|
|
1107
|
+
--us-outline-focus-border-color: var(--us-secondary-color);
|
|
1108
|
+
}
|
|
1109
|
+
.us-theme-fci .us-input--outlined.us-input--success > .us-outline {
|
|
1110
|
+
--us-outline-focus-border-color: var(--us-success-color);
|
|
1111
|
+
}
|
|
1112
|
+
.us-theme-fci .us-input--outlined.us-input--info > .us-outline {
|
|
1113
|
+
--us-outline-focus-border-color: var(--us-info-color);
|
|
1114
|
+
}
|
|
1115
|
+
.us-theme-fci .us-input--outlined.us-input--warning > .us-outline {
|
|
1116
|
+
--us-outline-focus-border-color: var(--us-warning-color);
|
|
1117
|
+
}
|
|
1118
|
+
.us-theme-fci .us-input--outlined.us-input--danger > .us-outline {
|
|
1119
|
+
--us-outline-focus-border-color: var(--us-danger-color);
|
|
1120
|
+
}
|
|
1121
1121
|
.us-theme-fci .us-input--outlined.us-input--light {
|
|
1122
1122
|
--us-input-color: #fff;
|
|
1123
1123
|
--us-input-placeholder-color: rgba(255, 255, 255, 0.6);
|
|
@@ -1133,19 +1133,36 @@ html {
|
|
|
1133
1133
|
--us-outline-focus-border-color: #fff;
|
|
1134
1134
|
--us-outline-focus-opacity: 1;
|
|
1135
1135
|
}
|
|
1136
|
-
.us-theme-fci .us-input--flat
|
|
1136
|
+
.us-theme-fci .us-input--flat {
|
|
1137
1137
|
--us-input-placeholder-color: rgba(0, 0, 0, 0.6);
|
|
1138
1138
|
}
|
|
1139
|
-
.us-theme-fci .us-input--flat
|
|
1139
|
+
.us-theme-fci .us-input--flat > .us-overlay {
|
|
1140
1140
|
--us-overlay-color: inherit;
|
|
1141
1141
|
--us-overlay-opacity: 0.08;
|
|
1142
1142
|
--us-_hover-overlay-opacity: 0.12;
|
|
1143
1143
|
}
|
|
1144
|
-
.us-theme-fci .us-input--flat
|
|
1144
|
+
.us-theme-fci .us-input--flat > .us-outline {
|
|
1145
1145
|
--us-outline-border-color: transparent;
|
|
1146
|
-
--us-outline-focus-border-color: var(--us-primary-color);
|
|
1147
1146
|
--us-outline-focus-opacity: 1;
|
|
1148
1147
|
}
|
|
1148
|
+
.us-theme-fci .us-input--flat.us-input--primary > .us-outline {
|
|
1149
|
+
--us-outline-focus-border-color: var(--us-primary-color);
|
|
1150
|
+
}
|
|
1151
|
+
.us-theme-fci .us-input--flat.us-input--secondary > .us-outline {
|
|
1152
|
+
--us-outline-focus-border-color: var(--us-secondary-color);
|
|
1153
|
+
}
|
|
1154
|
+
.us-theme-fci .us-input--flat.us-input--success > .us-outline {
|
|
1155
|
+
--us-outline-focus-border-color: var(--us-success-color);
|
|
1156
|
+
}
|
|
1157
|
+
.us-theme-fci .us-input--flat.us-input--info > .us-outline {
|
|
1158
|
+
--us-outline-focus-border-color: var(--us-info-color);
|
|
1159
|
+
}
|
|
1160
|
+
.us-theme-fci .us-input--flat.us-input--warning > .us-outline {
|
|
1161
|
+
--us-outline-focus-border-color: var(--us-warning-color);
|
|
1162
|
+
}
|
|
1163
|
+
.us-theme-fci .us-input--flat.us-input--danger > .us-outline {
|
|
1164
|
+
--us-outline-focus-border-color: var(--us-danger-color);
|
|
1165
|
+
}
|
|
1149
1166
|
.us-theme-fci .us-input--flat.us-input--light {
|
|
1150
1167
|
--us-input-color: #fff;
|
|
1151
1168
|
--us-input-placeholder-color: rgba(255, 255, 255, 0.6);
|
|
@@ -1160,14 +1177,14 @@ html {
|
|
|
1160
1177
|
--us-outline-focus-border-color: #fff;
|
|
1161
1178
|
--us-outline-focus-opacity: 1;
|
|
1162
1179
|
}
|
|
1163
|
-
.us-theme-fci .us-input--text
|
|
1180
|
+
.us-theme-fci .us-input--text {
|
|
1164
1181
|
--us-input-placeholder-color: rgba(0, 0, 0, 0.6);
|
|
1165
1182
|
}
|
|
1166
|
-
.us-theme-fci .us-input--text
|
|
1183
|
+
.us-theme-fci .us-input--text > .us-overlay {
|
|
1167
1184
|
--us-overlay-color: inherit;
|
|
1168
1185
|
--us-overlay-opacity: 0;
|
|
1169
1186
|
}
|
|
1170
|
-
.us-theme-fci .us-input--text
|
|
1187
|
+
.us-theme-fci .us-input--text > .us-outline {
|
|
1171
1188
|
--us-outline-border-color: transparent;
|
|
1172
1189
|
}
|
|
1173
1190
|
.us-theme-fci .us-input--text.us-input--light {
|
|
@@ -1182,6 +1199,9 @@ html {
|
|
|
1182
1199
|
--us-outline-border-color: transparent;
|
|
1183
1200
|
}
|
|
1184
1201
|
|
|
1202
|
+
.us-theme-fci .us-checkbox-group--xs {
|
|
1203
|
+
--us-checkbox-group-gap: 0.2rem;
|
|
1204
|
+
}
|
|
1185
1205
|
.us-theme-fci .us-checkbox-group--sm {
|
|
1186
1206
|
--us-checkbox-group-gap: 0.375rem;
|
|
1187
1207
|
}
|
|
@@ -1191,42 +1211,67 @@ html {
|
|
|
1191
1211
|
.us-theme-fci .us-checkbox-group--lg {
|
|
1192
1212
|
--us-checkbox-group-gap: 0.75rem;
|
|
1193
1213
|
}
|
|
1214
|
+
.us-theme-fci .us-checkbox-group--xl {
|
|
1215
|
+
--us-checkbox-group-gap: 0.875rem;
|
|
1216
|
+
}
|
|
1194
1217
|
.us-theme-fci .us-checkbox {
|
|
1195
1218
|
--us-checkbox-control-border-width: 1px;
|
|
1196
1219
|
--us-checkbox-control-border-style: solid;
|
|
1197
1220
|
--us-checkbox-control-border-color: rgba(0, 0, 0, 0.2);
|
|
1198
|
-
--us-checkbox-control-border-radius: 6px;
|
|
1199
1221
|
--us-checkbox-control-color: var(--us-white-color);
|
|
1200
1222
|
--us-_checked-checkbox-control-border-color: var(--us-primary-color);
|
|
1201
1223
|
--us-_focus-checkbox-control-box-shadow: 0px 4px 8px rgba(var(--us-primary-rgb) / 40%);
|
|
1202
1224
|
--us-checkbox-tap-background: var(--us-primary-color);
|
|
1203
1225
|
}
|
|
1226
|
+
.us-theme-fci .us-checkbox--xs {
|
|
1227
|
+
--us-checkbox-gap: 0.375rem;
|
|
1228
|
+
--us-checkbox-control-border-radius: 4px;
|
|
1229
|
+
--us-checkbox-control-width: 14px;
|
|
1230
|
+
--us-checkbox-control-height: 14px;
|
|
1231
|
+
--us-checkbox-label-font-size: 0.75rem;
|
|
1232
|
+
}
|
|
1233
|
+
.us-theme-fci .us-checkbox--xs .us-icon {
|
|
1234
|
+
--us-icon-font-size: 0.5rem;
|
|
1235
|
+
}
|
|
1204
1236
|
.us-theme-fci .us-checkbox--sm {
|
|
1205
1237
|
--us-checkbox-gap: 0.375rem;
|
|
1238
|
+
--us-checkbox-control-border-radius: 4px;
|
|
1206
1239
|
--us-checkbox-control-width: 16px;
|
|
1207
1240
|
--us-checkbox-control-height: 16px;
|
|
1208
1241
|
--us-checkbox-label-font-size: 0.75rem;
|
|
1209
1242
|
}
|
|
1210
1243
|
.us-theme-fci .us-checkbox--sm .us-icon {
|
|
1211
|
-
--us-icon-font-size: 0.
|
|
1244
|
+
--us-icon-font-size: 0.5rem;
|
|
1212
1245
|
}
|
|
1213
1246
|
.us-theme-fci .us-checkbox--md {
|
|
1214
1247
|
--us-checkbox-gap: 0.5rem;
|
|
1215
|
-
--us-checkbox-control-
|
|
1216
|
-
--us-checkbox-control-
|
|
1248
|
+
--us-checkbox-control-border-radius: 4px;
|
|
1249
|
+
--us-checkbox-control-width: 18px;
|
|
1250
|
+
--us-checkbox-control-height: 18px;
|
|
1217
1251
|
--us-checkbox-label-font-size: 0.875rem;
|
|
1218
1252
|
}
|
|
1219
1253
|
.us-theme-fci .us-checkbox--md .us-icon {
|
|
1220
|
-
--us-icon-font-size:
|
|
1254
|
+
--us-icon-font-size: 0.625rem;
|
|
1221
1255
|
}
|
|
1222
1256
|
.us-theme-fci .us-checkbox--lg {
|
|
1223
1257
|
--us-checkbox-gap: 0.5rem;
|
|
1224
|
-
--us-checkbox-control-
|
|
1225
|
-
--us-checkbox-control-
|
|
1226
|
-
--us-checkbox-
|
|
1258
|
+
--us-checkbox-control-border-radius: 6px;
|
|
1259
|
+
--us-checkbox-control-width: 20px;
|
|
1260
|
+
--us-checkbox-control-height: 20px;
|
|
1261
|
+
--us-checkbox-label-font-size: 0.875rem;
|
|
1227
1262
|
}
|
|
1228
1263
|
.us-theme-fci .us-checkbox--lg .us-icon {
|
|
1229
|
-
--us-icon-font-size:
|
|
1264
|
+
--us-icon-font-size: 0.75rem;
|
|
1265
|
+
}
|
|
1266
|
+
.us-theme-fci .us-checkbox--xl {
|
|
1267
|
+
--us-checkbox-gap: 0.5rem;
|
|
1268
|
+
--us-checkbox-control-border-radius: 6px;
|
|
1269
|
+
--us-checkbox-control-width: 22px;
|
|
1270
|
+
--us-checkbox-control-height: 22px;
|
|
1271
|
+
--us-checkbox-label-font-size: 1rem;
|
|
1272
|
+
}
|
|
1273
|
+
.us-theme-fci .us-checkbox--xl .us-icon {
|
|
1274
|
+
--us-icon-font-size: 0.875rem;
|
|
1230
1275
|
}
|
|
1231
1276
|
.us-theme-fci .us-checkbox--light {
|
|
1232
1277
|
--us-checkbox-control-border-color: rgba(0, 0, 0, 0.2);
|
|
@@ -1245,6 +1290,9 @@ html {
|
|
|
1245
1290
|
--us-checkbox-label-color: var(--us-white-color);
|
|
1246
1291
|
}
|
|
1247
1292
|
|
|
1293
|
+
.us-theme-fci .us-radio-group--xs {
|
|
1294
|
+
--us-radio-group-gap: 0.2rem;
|
|
1295
|
+
}
|
|
1248
1296
|
.us-theme-fci .us-radio-group--sm {
|
|
1249
1297
|
--us-radio-group-gap: 0.375rem;
|
|
1250
1298
|
}
|
|
@@ -1254,6 +1302,9 @@ html {
|
|
|
1254
1302
|
.us-theme-fci .us-radio-group--lg {
|
|
1255
1303
|
--us-radio-group-gap: 0.75rem;
|
|
1256
1304
|
}
|
|
1305
|
+
.us-theme-fci .us-radio-group--xl {
|
|
1306
|
+
--us-radio-group-gap: 0.875rem;
|
|
1307
|
+
}
|
|
1257
1308
|
.us-theme-fci .us-radio {
|
|
1258
1309
|
--us-radio-control-border-width: 1px;
|
|
1259
1310
|
--us-radio-control-border-style: solid;
|
|
@@ -1264,6 +1315,15 @@ html {
|
|
|
1264
1315
|
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-primary-rgb) / 40%);
|
|
1265
1316
|
--us-radio-tap-background: var(--us-primary-color);
|
|
1266
1317
|
}
|
|
1318
|
+
.us-theme-fci .us-radio--xs {
|
|
1319
|
+
--us-radio-gap: 0.375rem;
|
|
1320
|
+
--us-radio-control-width: 14px;
|
|
1321
|
+
--us-radio-control-height: 14px;
|
|
1322
|
+
--us-radio-label-font-size: 0.75rem;
|
|
1323
|
+
}
|
|
1324
|
+
.us-theme-fci .us-radio--xs .us-icon {
|
|
1325
|
+
--us-icon-font-size: 0.5rem;
|
|
1326
|
+
}
|
|
1267
1327
|
.us-theme-fci .us-radio--sm {
|
|
1268
1328
|
--us-radio-gap: 0.375rem;
|
|
1269
1329
|
--us-radio-control-width: 16px;
|
|
@@ -1274,21 +1334,30 @@ html {
|
|
|
1274
1334
|
--us-icon-font-size: 0.5rem;
|
|
1275
1335
|
}
|
|
1276
1336
|
.us-theme-fci .us-radio--md {
|
|
1337
|
+
--us-radio-gap: 0.5rem;
|
|
1338
|
+
--us-radio-control-width: 18px;
|
|
1339
|
+
--us-radio-control-height: 18px;
|
|
1340
|
+
--us-radio-label-font-size: 0.875rem;
|
|
1341
|
+
}
|
|
1342
|
+
.us-theme-fci .us-radio--md .us-icon {
|
|
1343
|
+
--us-icon-font-size: 0.625rem;
|
|
1344
|
+
}
|
|
1345
|
+
.us-theme-fci .us-radio--lg {
|
|
1277
1346
|
--us-radio-gap: 0.5rem;
|
|
1278
1347
|
--us-radio-control-width: 20px;
|
|
1279
1348
|
--us-radio-control-height: 20px;
|
|
1280
1349
|
--us-radio-label-font-size: 0.875rem;
|
|
1281
1350
|
}
|
|
1282
|
-
.us-theme-fci .us-radio--
|
|
1351
|
+
.us-theme-fci .us-radio--lg .us-icon {
|
|
1283
1352
|
--us-icon-font-size: 0.75rem;
|
|
1284
1353
|
}
|
|
1285
|
-
.us-theme-fci .us-radio--
|
|
1354
|
+
.us-theme-fci .us-radio--xl {
|
|
1286
1355
|
--us-radio-gap: 0.5rem;
|
|
1287
|
-
--us-radio-control-width:
|
|
1288
|
-
--us-radio-control-height:
|
|
1356
|
+
--us-radio-control-width: 22px;
|
|
1357
|
+
--us-radio-control-height: 22px;
|
|
1289
1358
|
--us-radio-label-font-size: 1rem;
|
|
1290
1359
|
}
|
|
1291
|
-
.us-theme-fci .us-radio--
|
|
1360
|
+
.us-theme-fci .us-radio--xl .us-icon {
|
|
1292
1361
|
--us-icon-font-size: 0.875rem;
|
|
1293
1362
|
}
|
|
1294
1363
|
.us-theme-fci .us-radio--light {
|
|
@@ -1307,6 +1376,36 @@ html {
|
|
|
1307
1376
|
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(255 255 255 / 40%);
|
|
1308
1377
|
--us-radio-label-color: var(--us-white-color);
|
|
1309
1378
|
}
|
|
1379
|
+
.us-theme-fci .us-radio--primary {
|
|
1380
|
+
--us-_checked-radio-control-border-color: var(--us-primary-color);
|
|
1381
|
+
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-primary-rgb) / 40%);
|
|
1382
|
+
--us-radio-tap-background: var(--us-primary-color);
|
|
1383
|
+
}
|
|
1384
|
+
.us-theme-fci .us-radio--secondary {
|
|
1385
|
+
--us-_checked-radio-control-border-color: var(--us-secondary-color);
|
|
1386
|
+
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-secondary-rgb) / 40%);
|
|
1387
|
+
--us-radio-tap-background: var(--us-secondary-color);
|
|
1388
|
+
}
|
|
1389
|
+
.us-theme-fci .us-radio--success {
|
|
1390
|
+
--us-_checked-radio-control-border-color: var(--us-success-color);
|
|
1391
|
+
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-success-rgb) / 40%);
|
|
1392
|
+
--us-radio-tap-background: var(--us-success-color);
|
|
1393
|
+
}
|
|
1394
|
+
.us-theme-fci .us-radio--info {
|
|
1395
|
+
--us-_checked-radio-control-border-color: var(--us-info-color);
|
|
1396
|
+
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-info-rgb) / 40%);
|
|
1397
|
+
--us-radio-tap-background: var(--us-info-color);
|
|
1398
|
+
}
|
|
1399
|
+
.us-theme-fci .us-radio--warning {
|
|
1400
|
+
--us-_checked-radio-control-border-color: var(--us-warning-color);
|
|
1401
|
+
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-warning-rgb) / 40%);
|
|
1402
|
+
--us-radio-tap-background: var(--us-warning-color);
|
|
1403
|
+
}
|
|
1404
|
+
.us-theme-fci .us-radio--danger {
|
|
1405
|
+
--us-_checked-radio-control-border-color: var(--us-danger-color);
|
|
1406
|
+
--us-_focus-radio-control-box-shadow: 0px 4px 8px rgba(var(--us-danger-rgb) / 40%);
|
|
1407
|
+
--us-radio-tap-background: var(--us-danger-color);
|
|
1408
|
+
}
|
|
1310
1409
|
|
|
1311
1410
|
.us-theme-fci .us-switch {
|
|
1312
1411
|
--us-switch-control-color: rgba(0, 0, 0, 0.2);
|
|
@@ -1318,9 +1417,20 @@ html {
|
|
|
1318
1417
|
--us-switch-thumb-color: var(--us-white-color);
|
|
1319
1418
|
--us-switch-control-border-radius: 9999px;
|
|
1320
1419
|
}
|
|
1420
|
+
.us-theme-fci .us-switch--xs {
|
|
1421
|
+
--us-switch-gap: 0.375rem;
|
|
1422
|
+
--us-switch-control-width: 20px;
|
|
1423
|
+
--us-switch-control-height: 14px;
|
|
1424
|
+
--us-switch-thumb-width: 8px;
|
|
1425
|
+
--us-switch-thumb-height: 8px;
|
|
1426
|
+
--us-switch-label-font-size: 0.75rem;
|
|
1427
|
+
}
|
|
1428
|
+
.us-theme-fci .us-switch--xs .us-icon {
|
|
1429
|
+
--us-icon-font-size: 0.75rem;
|
|
1430
|
+
}
|
|
1321
1431
|
.us-theme-fci .us-switch--sm {
|
|
1322
1432
|
--us-switch-gap: 0.375rem;
|
|
1323
|
-
--us-switch-control-width:
|
|
1433
|
+
--us-switch-control-width: 24px;
|
|
1324
1434
|
--us-switch-control-height: 16px;
|
|
1325
1435
|
--us-switch-thumb-width: 10px;
|
|
1326
1436
|
--us-switch-thumb-height: 10px;
|
|
@@ -1330,6 +1440,17 @@ html {
|
|
|
1330
1440
|
--us-icon-font-size: 0.75rem;
|
|
1331
1441
|
}
|
|
1332
1442
|
.us-theme-fci .us-switch--md {
|
|
1443
|
+
--us-switch-gap: 0.5rem;
|
|
1444
|
+
--us-switch-control-width: 28px;
|
|
1445
|
+
--us-switch-control-height: 18px;
|
|
1446
|
+
--us-switch-thumb-width: 12px;
|
|
1447
|
+
--us-switch-thumb-height: 12px;
|
|
1448
|
+
--us-switch-label-font-size: 0.875rem;
|
|
1449
|
+
}
|
|
1450
|
+
.us-theme-fci .us-switch--md .us-icon {
|
|
1451
|
+
--us-icon-font-size: 1rem;
|
|
1452
|
+
}
|
|
1453
|
+
.us-theme-fci .us-switch--lg {
|
|
1333
1454
|
--us-switch-gap: 0.5rem;
|
|
1334
1455
|
--us-switch-control-width: 32px;
|
|
1335
1456
|
--us-switch-control-height: 20px;
|
|
@@ -1337,18 +1458,18 @@ html {
|
|
|
1337
1458
|
--us-switch-thumb-height: 14px;
|
|
1338
1459
|
--us-switch-label-font-size: 0.875rem;
|
|
1339
1460
|
}
|
|
1340
|
-
.us-theme-fci .us-switch--
|
|
1341
|
-
--us-icon-font-size:
|
|
1461
|
+
.us-theme-fci .us-switch--lg .us-icon {
|
|
1462
|
+
--us-icon-font-size: 1.125rem;
|
|
1342
1463
|
}
|
|
1343
|
-
.us-theme-fci .us-switch--
|
|
1464
|
+
.us-theme-fci .us-switch--xl {
|
|
1344
1465
|
--us-switch-gap: 0.5rem;
|
|
1345
|
-
--us-switch-control-width:
|
|
1346
|
-
--us-switch-control-height:
|
|
1347
|
-
--us-switch-thumb-width:
|
|
1348
|
-
--us-switch-thumb-height:
|
|
1466
|
+
--us-switch-control-width: 36px;
|
|
1467
|
+
--us-switch-control-height: 22px;
|
|
1468
|
+
--us-switch-thumb-width: 14px;
|
|
1469
|
+
--us-switch-thumb-height: 14px;
|
|
1349
1470
|
--us-switch-label-font-size: 1rem;
|
|
1350
1471
|
}
|
|
1351
|
-
.us-theme-fci .us-switch--
|
|
1472
|
+
.us-theme-fci .us-switch--xl .us-icon {
|
|
1352
1473
|
--us-icon-font-size: 1.125rem;
|
|
1353
1474
|
}
|
|
1354
1475
|
.us-theme-fci .us-switch--light {
|