@bi-digital/css 0.4.1 → 0.5.0
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/dist/baseline.css +2 -7
- package/dist/components/alert.css +24 -0
- package/dist/components/button.css +5 -13
- package/dist/components/card.css +62 -27
- package/dist/components/checkbox-subsection.css +1 -1
- package/dist/components/details.css +1 -1
- package/dist/components/dialog.css +3 -3
- package/dist/components/dropdown.css +3 -3
- package/dist/components/field.css +7 -37
- package/dist/components/filter-group.css +3 -3
- package/dist/components/input.css +11 -39
- package/dist/components/label.css +1 -5
- package/dist/components/navbar.css +7 -1
- package/dist/components/popover.css +3 -3
- package/dist/components/spinner.css +3 -3
- package/dist/components/validation-message.css +1 -5
- package/dist/components.css +135 -144
- package/dist/index.css +61 -224
- package/dist/reset.css +2 -14
- package/dist/salesforce.css +192 -403
- package/dist/tokens.css +57 -203
- package/package.json +3 -3
package/dist/salesforce.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
:root {
|
|
1
|
+
:root, :host {
|
|
2
2
|
--bi-basic-key: #000;
|
|
3
3
|
--bi-basic-white: #fff;
|
|
4
4
|
--bi-neutral-0: #fafbfc;
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
--bi-primary-95: #002341;
|
|
37
37
|
--bi-primary-100: #001932;
|
|
38
38
|
--bi-secondary-0: #fffbeb;
|
|
39
|
-
--bi-secondary-5: #
|
|
39
|
+
--bi-secondary-5: #fff7d5;
|
|
40
40
|
--bi-secondary-10: #fff2bf;
|
|
41
41
|
--bi-secondary-15: #ffea95;
|
|
42
42
|
--bi-secondary-20: #ffe680;
|
|
@@ -138,6 +138,7 @@
|
|
|
138
138
|
--bi-scale-12x: 3rem;
|
|
139
139
|
--bi-scale-14x: 3.5rem;
|
|
140
140
|
--bi-scale-16x: 4rem;
|
|
141
|
+
--bi-scale-18x: 4.5rem;
|
|
141
142
|
--bi-scale-20x: 5rem;
|
|
142
143
|
--bi-scale-24x: 6rem;
|
|
143
144
|
--bi-scale-32x: 8rem;
|
|
@@ -148,23 +149,26 @@
|
|
|
148
149
|
--bi-scale-64x: 16rem;
|
|
149
150
|
--bi-scale-80x: 20rem;
|
|
150
151
|
--bi-scale-max: 624.938rem;
|
|
151
|
-
--bi-opacity-dark-80:
|
|
152
|
-
--bi-opacity-dark-50:
|
|
153
|
-
--bi-opacity-light-100:
|
|
154
|
-
--bi-opacity-light-80:
|
|
155
|
-
--bi-opacity-light-50:
|
|
156
|
-
--bi-stroke-
|
|
157
|
-
--bi-elevation-25:
|
|
158
|
-
--bi-
|
|
159
|
-
--bi-
|
|
160
|
-
--bi-
|
|
161
|
-
--bi-
|
|
152
|
+
--bi-opacity-dark-80: #26333f33;
|
|
153
|
+
--bi-opacity-dark-50: #26333f80;
|
|
154
|
+
--bi-opacity-light-100: #fff0;
|
|
155
|
+
--bi-opacity-light-80: #fff3;
|
|
156
|
+
--bi-opacity-light-50: #ffffff80;
|
|
157
|
+
--bi-stroke-medium: .09375rem;
|
|
158
|
+
--bi-elevation-25: #26333f26;
|
|
159
|
+
--bi-font-family-plain: "museo-sans", Arial, sans-serif;
|
|
160
|
+
--bi-font-family-brand: "museo-slab", serif;
|
|
161
|
+
--bi-font-weight-bold: 700;
|
|
162
|
+
--bi-font-weight-regular: 500;
|
|
163
|
+
--bi-font-color-secondary-dark-background-2: #ffffffb3;
|
|
164
|
+
--bi-font-color-disabled-dark-background: #ffffffb3;
|
|
165
|
+
--bi-states-hover-dark: #26333f1a;
|
|
166
|
+
--bi-states-hover-light: #ffffff1a;
|
|
167
|
+
--bi-states-press-dark: #26333f26;
|
|
168
|
+
--bi-states-press-light: #ffffff26;
|
|
162
169
|
--bi-stroke-none: var(--bi-scale-0);
|
|
163
170
|
--bi-stroke-thin: var(--bi-scale-0-25x);
|
|
164
171
|
--bi-stroke-thick: var(--bi-scale-0-50x);
|
|
165
|
-
--bi-stroke-color-1: var(--bi-neutral-15);
|
|
166
|
-
--bi-stroke-color-2: var(--bi-neutral-25);
|
|
167
|
-
--bi-stroke-color-3: var(--bi-neutral-50);
|
|
168
172
|
--bi-radius-none: var(--bi-scale-0);
|
|
169
173
|
--bi-radius-small: var(--bi-scale-0-50x);
|
|
170
174
|
--bi-radius-medium: var(--bi-scale-1x);
|
|
@@ -177,253 +181,47 @@
|
|
|
177
181
|
--bi-icon-large: var(--bi-scale-8x);
|
|
178
182
|
--bi-icon-xl: var(--bi-scale-10x);
|
|
179
183
|
--bi-icon-2xl: var(--bi-scale-11x);
|
|
180
|
-
--bi-icon-primary: var(--bi-neutral-
|
|
184
|
+
--bi-icon-primary: var(--bi-neutral-95);
|
|
181
185
|
--bi-icon-secondary: var(--bi-neutral-60);
|
|
182
186
|
--bi-icon-disabled: var(--bi-neutral-50);
|
|
183
187
|
--bi-icon-link: var(--bi-primary-50);
|
|
188
|
+
--bi-font-color-primary: var(--bi-neutral-95);
|
|
189
|
+
--bi-font-color-secondary: var(--bi-neutral-60);
|
|
190
|
+
--bi-font-color-disabled: var(--bi-neutral-50);
|
|
191
|
+
--bi-font-color-accent: var(--bi-primary-60);
|
|
192
|
+
--bi-font-color-link: var(--bi-primary-50);
|
|
193
|
+
--bi-font-color-primary-dark-background: var(--bi-basic-white);
|
|
194
|
+
--bi-font-color-accent-dark-background: var(--bi-primary-20);
|
|
184
195
|
--bi-layout-navbar-height: var(--bi-scale-16x);
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
:
|
|
188
|
-
--bi-
|
|
189
|
-
--bi-
|
|
190
|
-
--bi-
|
|
191
|
-
--bi-
|
|
192
|
-
--bi-
|
|
193
|
-
--bi-
|
|
194
|
-
--bi-
|
|
195
|
-
--bi-
|
|
196
|
-
--bi-
|
|
197
|
-
--bi-
|
|
198
|
-
--bi-
|
|
199
|
-
--bi-
|
|
200
|
-
--bi-
|
|
201
|
-
--bi-
|
|
202
|
-
--bi-
|
|
203
|
-
--bi-
|
|
204
|
-
--bi-
|
|
205
|
-
--bi-
|
|
206
|
-
--bi-
|
|
207
|
-
--bi-
|
|
208
|
-
--bi-
|
|
209
|
-
--bi-
|
|
210
|
-
--bi-
|
|
211
|
-
--bi-
|
|
212
|
-
--bi-
|
|
213
|
-
--bi-
|
|
214
|
-
--bi-primary-40: #6196f4;
|
|
215
|
-
--bi-primary-50: #0a64ff;
|
|
216
|
-
--bi-primary-60: #0b4db4;
|
|
217
|
-
--bi-primary-70: #0b49a1;
|
|
218
|
-
--bi-primary-75: #0c468f;
|
|
219
|
-
--bi-primary-80: #093f82;
|
|
220
|
-
--bi-primary-85: #083a76;
|
|
221
|
-
--bi-primary-90: #042f5b;
|
|
222
|
-
--bi-primary-95: #002341;
|
|
223
|
-
--bi-primary-100: #001932;
|
|
224
|
-
--bi-secondary-0: #fffbeb;
|
|
225
|
-
--bi-secondary-5: #fcf6df;
|
|
226
|
-
--bi-secondary-10: #fff2bf;
|
|
227
|
-
--bi-secondary-15: #ffea95;
|
|
228
|
-
--bi-secondary-20: #ffe680;
|
|
229
|
-
--bi-secondary-25: #ffe26a;
|
|
230
|
-
--bi-secondary-30: #ffde55;
|
|
231
|
-
--bi-secondary-40: #ffd52b;
|
|
232
|
-
--bi-secondary-50: #ffcd00;
|
|
233
|
-
--bi-secondary-60: #deb300;
|
|
234
|
-
--bi-secondary-70: #bd9800;
|
|
235
|
-
--bi-secondary-75: #9d7e00;
|
|
236
|
-
--bi-secondary-80: #7c6400;
|
|
237
|
-
--bi-secondary-85: #5b4900;
|
|
238
|
-
--bi-secondary-90: #4a3c01;
|
|
239
|
-
--bi-secondary-95: #3a2f00;
|
|
240
|
-
--bi-secondary-100: #262000;
|
|
241
|
-
--bi-info-0: #f3ebff;
|
|
242
|
-
--bi-info-5: #e6d5ff;
|
|
243
|
-
--bi-info-10: #d9bfff;
|
|
244
|
-
--bi-info-15: #cdaaff;
|
|
245
|
-
--bi-info-20: #c094ff;
|
|
246
|
-
--bi-info-25: #b480ff;
|
|
247
|
-
--bi-info-30: #a76aff;
|
|
248
|
-
--bi-info-40: #822bff;
|
|
249
|
-
--bi-info-50: #6900ff;
|
|
250
|
-
--bi-info-60: #5c03dc;
|
|
251
|
-
--bi-info-70: #4f05b9;
|
|
252
|
-
--bi-info-75: #420896;
|
|
253
|
-
--bi-info-80: #3b0984;
|
|
254
|
-
--bi-info-85: #350a73;
|
|
255
|
-
--bi-info-90: #2e0b61;
|
|
256
|
-
--bi-info-95: #280d50;
|
|
257
|
-
--bi-info-100: #1a0833;
|
|
258
|
-
--bi-warning-0: #fffbeb;
|
|
259
|
-
--bi-warning-5: #fff7d5;
|
|
260
|
-
--bi-warning-10: #fff2bf;
|
|
261
|
-
--bi-warning-15: #ffea95;
|
|
262
|
-
--bi-warning-20: #ffe680;
|
|
263
|
-
--bi-warning-25: #ffe26a;
|
|
264
|
-
--bi-warning-30: #ffde55;
|
|
265
|
-
--bi-warning-40: #ffd52b;
|
|
266
|
-
--bi-warning-50: #ffcd00;
|
|
267
|
-
--bi-warning-60: #deb300;
|
|
268
|
-
--bi-warning-70: #bd9800;
|
|
269
|
-
--bi-warning-75: #9d7e00;
|
|
270
|
-
--bi-warning-80: #7c6400;
|
|
271
|
-
--bi-warning-85: #5b4900;
|
|
272
|
-
--bi-warning-90: #4a3c01;
|
|
273
|
-
--bi-warning-95: #3a2f00;
|
|
274
|
-
--bi-warning-100: #262000;
|
|
275
|
-
--bi-success-0: #ebffeb;
|
|
276
|
-
--bi-success-5: #d5f4d6;
|
|
277
|
-
--bi-success-10: #bfeec2;
|
|
278
|
-
--bi-success-15: #aae8ae;
|
|
279
|
-
--bi-success-20: #95e299;
|
|
280
|
-
--bi-success-25: #80dd85;
|
|
281
|
-
--bi-success-30: #55d15c;
|
|
282
|
-
--bi-success-40: #2bc634;
|
|
283
|
-
--bi-success-50: #00ab0b;
|
|
284
|
-
--bi-success-60: #04a30d;
|
|
285
|
-
--bi-success-70: #078b0f;
|
|
286
|
-
--bi-success-75: #0b7411;
|
|
287
|
-
--bi-success-80: #0f5d13;
|
|
288
|
-
--bi-success-85: #124515;
|
|
289
|
-
--bi-success-90: #143a16;
|
|
290
|
-
--bi-success-95: #162e17;
|
|
291
|
-
--bi-success-100: #0f1f0f;
|
|
292
|
-
--bi-alert-0: #fff1f0;
|
|
293
|
-
--bi-alert-5: #ffe1df;
|
|
294
|
-
--bi-alert-10: #ffd7d5;
|
|
295
|
-
--bi-alert-15: #ffc3bf;
|
|
296
|
-
--bi-alert-20: #ffafaa;
|
|
297
|
-
--bi-alert-25: #ff8780;
|
|
298
|
-
--bi-alert-30: #ff5f55;
|
|
299
|
-
--bi-alert-40: #ff372b;
|
|
300
|
-
--bi-alert-50: #ff0f00;
|
|
301
|
-
--bi-alert-60: #e41100;
|
|
302
|
-
--bi-alert-70: #c91300;
|
|
303
|
-
--bi-alert-75: #ae1601;
|
|
304
|
-
--bi-alert-80: #931801;
|
|
305
|
-
--bi-alert-85: #731a15;
|
|
306
|
-
--bi-alert-90: #6a1b16;
|
|
307
|
-
--bi-alert-95: #5d1c18;
|
|
308
|
-
--bi-alert-100: #280c0a;
|
|
309
|
-
--bi-scale-0: 0;
|
|
310
|
-
--bi-scale-0-25x: .0625rem;
|
|
311
|
-
--bi-scale-0-50x: .125rem;
|
|
312
|
-
--bi-scale-0-75x: .1875rem;
|
|
313
|
-
--bi-scale-1x: .25rem;
|
|
314
|
-
--bi-scale-1-5x: .375rem;
|
|
315
|
-
--bi-scale-2x: .5rem;
|
|
316
|
-
--bi-scale-3x: .75rem;
|
|
317
|
-
--bi-scale-4x: 1rem;
|
|
318
|
-
--bi-scale-5x: 1.25rem;
|
|
319
|
-
--bi-scale-6x: 1.5rem;
|
|
320
|
-
--bi-scale-8x: 2rem;
|
|
321
|
-
--bi-scale-9x: 2.25rem;
|
|
322
|
-
--bi-scale-10x: 2.5rem;
|
|
323
|
-
--bi-scale-11x: 2.75rem;
|
|
324
|
-
--bi-scale-12x: 3rem;
|
|
325
|
-
--bi-scale-14x: 3.5rem;
|
|
326
|
-
--bi-scale-16x: 4rem;
|
|
327
|
-
--bi-scale-20x: 5rem;
|
|
328
|
-
--bi-scale-24x: 6rem;
|
|
329
|
-
--bi-scale-32x: 8rem;
|
|
330
|
-
--bi-scale-36x: 9rem;
|
|
331
|
-
--bi-scale-40x: 10rem;
|
|
332
|
-
--bi-scale-48x: 12rem;
|
|
333
|
-
--bi-scale-56x: 14rem;
|
|
334
|
-
--bi-scale-64x: 16rem;
|
|
335
|
-
--bi-scale-80x: 20rem;
|
|
336
|
-
--bi-scale-max: 624.938rem;
|
|
337
|
-
--bi-opacity-dark-80: rgba(38, 51, 63, .2);
|
|
338
|
-
--bi-opacity-dark-50: rgba(38, 51, 63, .5);
|
|
339
|
-
--bi-opacity-light-100: rgba(255, 255, 255, 0);
|
|
340
|
-
--bi-opacity-light-80: rgba(255, 255, 255, .2);
|
|
341
|
-
--bi-opacity-light-50: rgba(255, 255, 255, .5);
|
|
342
|
-
--bi-stroke-default: .09375rem;
|
|
343
|
-
--bi-elevation-25: rgba(38, 51, 63, .15);
|
|
344
|
-
--bi-states-hover-dark: rgba(38, 51, 63, .1);
|
|
345
|
-
--bi-states-hover-light: rgba(255, 255, 255, .1);
|
|
346
|
-
--bi-states-press-dark: rgba(38, 51, 63, .15);
|
|
347
|
-
--bi-states-press-light: rgba(255, 255, 255, .15);
|
|
348
|
-
--bi-stroke-none: var(--bi-scale-0);
|
|
349
|
-
--bi-stroke-thin: var(--bi-scale-0-25x);
|
|
350
|
-
--bi-stroke-thick: var(--bi-scale-0-50x);
|
|
351
|
-
--bi-stroke-color-1: var(--bi-neutral-15);
|
|
352
|
-
--bi-stroke-color-2: var(--bi-neutral-25);
|
|
353
|
-
--bi-stroke-color-3: var(--bi-neutral-50);
|
|
354
|
-
--bi-radius-none: var(--bi-scale-0);
|
|
355
|
-
--bi-radius-small: var(--bi-scale-0-50x);
|
|
356
|
-
--bi-radius-medium: var(--bi-scale-1x);
|
|
357
|
-
--bi-radius-large: var(--bi-scale-2x);
|
|
358
|
-
--bi-radius-xl: var(--bi-scale-3x);
|
|
359
|
-
--bi-radius-brand: var(--bi-scale-12x);
|
|
360
|
-
--bi-radius-full: var(--bi-scale-max);
|
|
361
|
-
--bi-icon-small: var(--bi-scale-5x);
|
|
362
|
-
--bi-icon-medium: var(--bi-scale-6x);
|
|
363
|
-
--bi-icon-large: var(--bi-scale-8x);
|
|
364
|
-
--bi-icon-xl: var(--bi-scale-10x);
|
|
365
|
-
--bi-icon-2xl: var(--bi-scale-11x);
|
|
366
|
-
--bi-icon-primary: var(--bi-neutral-90);
|
|
367
|
-
--bi-icon-secondary: var(--bi-neutral-60);
|
|
368
|
-
--bi-icon-disabled: var(--bi-neutral-50);
|
|
369
|
-
--bi-icon-link: var(--bi-primary-50);
|
|
370
|
-
--bi-layout-navbar-height: var(--bi-scale-16x);
|
|
371
|
-
}
|
|
372
|
-
|
|
373
|
-
@font-face {
|
|
374
|
-
font-family: museo-sans;
|
|
375
|
-
font-weight: 300;
|
|
376
|
-
font-display: swap;
|
|
377
|
-
src: url("./fonts/MuseoSans300.woff2") format("woff2");
|
|
378
|
-
}
|
|
379
|
-
|
|
380
|
-
@font-face {
|
|
381
|
-
font-family: museo-sans;
|
|
382
|
-
font-weight: 500;
|
|
383
|
-
font-display: swap;
|
|
384
|
-
src: url("./fonts/MuseoSans500.woff2") format("woff2");
|
|
385
|
-
}
|
|
386
|
-
|
|
387
|
-
@font-face {
|
|
388
|
-
font-family: museo-sans;
|
|
389
|
-
font-weight: 700;
|
|
390
|
-
font-display: swap;
|
|
391
|
-
src: url("./fonts/MuseoSans700.woff2") format("woff2");
|
|
392
|
-
}
|
|
393
|
-
|
|
394
|
-
@font-face {
|
|
395
|
-
font-family: museo-sans;
|
|
396
|
-
font-weight: 900;
|
|
397
|
-
font-display: swap;
|
|
398
|
-
src: url("./fonts/MuseoSans900.woff2") format("woff2");
|
|
399
|
-
}
|
|
400
|
-
|
|
401
|
-
@font-face {
|
|
402
|
-
font-family: museo-slab;
|
|
403
|
-
font-weight: 300;
|
|
404
|
-
font-display: swap;
|
|
405
|
-
src: url("./fonts/MuseoSlab300.woff2") format("woff2");
|
|
406
|
-
}
|
|
407
|
-
|
|
408
|
-
@font-face {
|
|
409
|
-
font-family: museo-slab;
|
|
410
|
-
font-weight: 500;
|
|
411
|
-
font-display: swap;
|
|
412
|
-
src: url("./fonts/MuseoSlab500.woff2") format("woff2");
|
|
413
|
-
}
|
|
414
|
-
|
|
415
|
-
@font-face {
|
|
416
|
-
font-family: museo-slab;
|
|
417
|
-
font-weight: 700;
|
|
418
|
-
font-display: swap;
|
|
419
|
-
src: url("./fonts/MuseoSlab700.woff2") format("woff2");
|
|
420
|
-
}
|
|
421
|
-
|
|
422
|
-
@font-face {
|
|
423
|
-
font-family: museo-slab;
|
|
424
|
-
font-weight: 900;
|
|
425
|
-
font-display: swap;
|
|
426
|
-
src: url("./fonts/MuseoSlab900.woff2") format("woff2");
|
|
196
|
+
--bi-font-display-large: var(--bi-font-weight-regular) 4rem / 4.5rem var(--bi-font-family-brand);
|
|
197
|
+
--bi-font-display-medium: var(--bi-font-weight-regular) 3rem / 3.5rem var(--bi-font-family-brand);
|
|
198
|
+
--bi-font-headline-large: var(--bi-font-weight-regular) 2.5rem / 2.875rem var(--bi-font-family-brand);
|
|
199
|
+
--bi-font-headline-medium: var(--bi-font-weight-regular) 2.25rem / 2.5rem var(--bi-font-family-plain);
|
|
200
|
+
--bi-font-headline-small: var(--bi-font-weight-regular) 1.75rem / 2rem var(--bi-font-family-brand);
|
|
201
|
+
--bi-font-title-bold-xxl: var(--bi-font-weight-bold) 2rem / 2.25rem var(--bi-font-family-plain);
|
|
202
|
+
--bi-font-title-bold-xl: var(--bi-font-weight-bold) 1.75rem / 2rem var(--bi-font-family-plain);
|
|
203
|
+
--bi-font-title-bold-large: var(--bi-font-weight-bold) 1.5rem / 1.6875rem var(--bi-font-family-plain);
|
|
204
|
+
--bi-font-title-bold-medium: var(--bi-font-weight-bold) 1.25rem / 1.4375rem var(--bi-font-family-plain);
|
|
205
|
+
--bi-font-title-bold-small: var(--bi-font-weight-bold) 1.125rem / 1.25rem var(--bi-font-family-plain);
|
|
206
|
+
--bi-font-title-bold-xs: var(--bi-font-weight-bold) 1rem / 1.125rem var(--bi-font-family-plain);
|
|
207
|
+
--bi-font-title-bold-xxs: var(--bi-font-weight-bold) .875rem / 1rem var(--bi-font-family-plain);
|
|
208
|
+
--bi-font-title-regular-xxl: var(--bi-font-weight-regular) 2rem / 2.25rem var(--bi-font-family-plain);
|
|
209
|
+
--bi-font-title-regular-xl: var(--bi-font-weight-regular) 1.75rem / 2rem var(--bi-font-family-plain);
|
|
210
|
+
--bi-font-title-regular-large: var(--bi-font-weight-regular) 1.5rem / 1.6875rem var(--bi-font-family-plain);
|
|
211
|
+
--bi-font-title-regular-medium: var(--bi-font-weight-regular) 1.25rem / 1.4375rem var(--bi-font-family-plain);
|
|
212
|
+
--bi-font-title-regular-small: var(--bi-font-weight-regular) 1.125rem / 1.25rem var(--bi-font-family-plain);
|
|
213
|
+
--bi-font-title-regular-xs: var(--bi-font-weight-regular) 1rem / 1.125rem var(--bi-font-family-plain);
|
|
214
|
+
--bi-font-title-regular-xxs: var(--bi-font-weight-regular) .875rem / 1rem var(--bi-font-family-plain);
|
|
215
|
+
--bi-font-body-xl: var(--bi-font-weight-regular) 1.125rem / 1.6875rem var(--bi-font-family-plain);
|
|
216
|
+
--bi-font-body-large: var(--bi-font-weight-regular) 1rem / 1.5rem var(--bi-font-family-plain);
|
|
217
|
+
--bi-font-body-medium: var(--bi-font-weight-regular) .875rem / 1.3125rem var(--bi-font-family-plain);
|
|
218
|
+
--bi-font-body-small: var(--bi-font-weight-regular) .8125rem / 1.25rem var(--bi-font-family-plain);
|
|
219
|
+
--bi-font-body-xs: var(--bi-font-weight-regular) .75rem / 1.125rem var(--bi-font-family-plain);
|
|
220
|
+
--bi-font-label-xl: var(--bi-font-weight-bold) 1.125rem / 1.6875rem var(--bi-font-family-plain);
|
|
221
|
+
--bi-font-label-large: var(--bi-font-weight-bold) 1rem / 1.5rem var(--bi-font-family-plain);
|
|
222
|
+
--bi-font-label-medium: var(--bi-font-weight-bold) .875rem / 1.25rem var(--bi-font-family-plain);
|
|
223
|
+
--bi-font-label-small: var(--bi-font-weight-bold) .8125rem / 1.25rem var(--bi-font-family-plain);
|
|
224
|
+
--bi-font-label-xs: var(--bi-font-weight-bold) .75rem / 1.125rem var(--bi-font-family-plain);
|
|
427
225
|
}
|
|
428
226
|
|
|
429
227
|
.bi-alert {
|
|
@@ -518,6 +316,30 @@
|
|
|
518
316
|
--bic-alert-color: var(--bi-warning-5);
|
|
519
317
|
}
|
|
520
318
|
|
|
319
|
+
.bi-alert[data-variant="info"] {
|
|
320
|
+
--bic-alert-background: var(--bi-info-5);
|
|
321
|
+
--bic-alert-border-color: var(--bi-info-10);
|
|
322
|
+
--bic-alert-color: var(--bi-info-90);
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
.bi-alert[data-variant="info"][data-dark="true"] {
|
|
326
|
+
--bic-alert-background: var(--bi-info-90);
|
|
327
|
+
--bic-alert-border-color: var(--bi-info-80);
|
|
328
|
+
--bic-alert-color: var(--bi-info-10);
|
|
329
|
+
}
|
|
330
|
+
|
|
331
|
+
.bi-alert[data-variant="neutral"] {
|
|
332
|
+
--bic-alert-background: var(--bi-neutral-10);
|
|
333
|
+
--bic-alert-border-color: var(--bi-neutral-15);
|
|
334
|
+
--bic-alert-color: var(--bi-neutral-95);
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
.bi-alert[data-variant="neutral"][data-dark="true"] {
|
|
338
|
+
--bic-alert-background: var(--bi-neutral-90);
|
|
339
|
+
--bic-alert-border-color: var(--bi-neutral-90);
|
|
340
|
+
--bic-alert-color: var(--bi-neutral-30);
|
|
341
|
+
}
|
|
342
|
+
|
|
521
343
|
.bi-alert:has( > .bi-alert--footer) {
|
|
522
344
|
width: 100%;
|
|
523
345
|
}
|
|
@@ -793,7 +615,7 @@
|
|
|
793
615
|
--bic-button-background: var(--bi-primary-50);
|
|
794
616
|
--bic-button-background-hover: linear-gradient(0deg, var(--bi-states-hover-dark) 0%, var(--bi-states-hover-dark) 100%), var(--bic-button-background);
|
|
795
617
|
--bic-button-background-press: linear-gradient(0deg, var(--bi-states-press-dark) 0%, var(--bi-states-press-dark) 100%), var(--bic-button-background);
|
|
796
|
-
--bic-button-box-shadow: 0px 0px 0px 2px
|
|
618
|
+
--bic-button-box-shadow: 0px 0px 0px 2px #ffffff1f inset, 0px 0px 0px 1px #0a0d122e inset, 0px -2px 0px 0px #0a0d120d inset, 0px 1px 2px 0px #0a0d120d;
|
|
797
619
|
}
|
|
798
620
|
|
|
799
621
|
.bi-button[data-variant="filled"] {
|
|
@@ -801,7 +623,7 @@
|
|
|
801
623
|
--bic-button-background: var(--bi-primary-50);
|
|
802
624
|
--bic-button-background-hover: linear-gradient(0deg, var(--bi-states-hover-dark) 0%, var(--bi-states-hover-dark) 100%), var(--bic-button-background);
|
|
803
625
|
--bic-button-background-press: linear-gradient(0deg, var(--bi-states-press-dark) 0%, var(--bi-states-press-dark) 100%), var(--bic-button-background);
|
|
804
|
-
--bic-button-box-shadow: 0px 0px 0px 2px
|
|
626
|
+
--bic-button-box-shadow: 0px 0px 0px 2px #ffffff1f inset, 0px 0px 0px 1px #0a0d122e inset, 0px -2px 0px 0px #0a0d120d inset, 0px 1px 2px 0px #0a0d120d;
|
|
805
627
|
}
|
|
806
628
|
|
|
807
629
|
.bi-button[data-variant="outlined"] {
|
|
@@ -839,17 +661,13 @@
|
|
|
839
661
|
|
|
840
662
|
.bi-button[data-variant="flat"][data-dark="true"] {
|
|
841
663
|
--bic-button-color: var(--bi-basic-white);
|
|
842
|
-
--bic-button-background:
|
|
664
|
+
--bic-button-background: #ffffff1a;
|
|
843
665
|
--bic-button-background-hover: linear-gradient(0deg, var(--bi-states-hover-light) 0%, var(--bi-states-hover-light) 100%), var(--bic-button-background);
|
|
844
666
|
--bic-button-background-press: linear-gradient(0deg, var(--bi-states-press-light) 0%, var(--bi-states-press-light) 100%), var(--bic-button-background);
|
|
845
667
|
}
|
|
846
668
|
|
|
847
669
|
@media (hover: hover) and (pointer: fine) {
|
|
848
|
-
.bi-button:where(:not(
|
|
849
|
-
background: var(--bic-button-background-hover);
|
|
850
|
-
}
|
|
851
|
-
|
|
852
|
-
.bi-button:where(:not(:is(:disabled, [aria-disabled="true"], [aria-busy="true"]))):hover {
|
|
670
|
+
.bi-button:where(:not(:disabled, [aria-disabled="true"], [aria-busy="true"])):hover {
|
|
853
671
|
background: var(--bic-button-background-hover);
|
|
854
672
|
}
|
|
855
673
|
}
|
|
@@ -874,11 +692,7 @@
|
|
|
874
692
|
cursor: progress;
|
|
875
693
|
}
|
|
876
694
|
|
|
877
|
-
.bi-button:where(:not(
|
|
878
|
-
background: var(--bic-button-background-press);
|
|
879
|
-
}
|
|
880
|
-
|
|
881
|
-
.bi-button:where(:not(:is(:disabled, [aria-disabled="true"], [aria-busy="true"]))):active {
|
|
695
|
+
.bi-button:where(:not(:disabled, [aria-disabled="true"], [aria-busy="true"])):active {
|
|
882
696
|
background: var(--bic-button-background-press);
|
|
883
697
|
}
|
|
884
698
|
|
|
@@ -893,36 +707,54 @@
|
|
|
893
707
|
}
|
|
894
708
|
|
|
895
709
|
.bi-card {
|
|
896
|
-
--bic-card-border-color: var(--bi-neutral-15);
|
|
897
|
-
--bic-card-box-shadow: 0 0 0 var(--bi-stroke-thin) var(--bic-card-border-color);
|
|
898
|
-
--bic-card-border-radius: var(--bi-radius-medium);
|
|
899
710
|
--bic-card-background-color: var(--bi-basic-white);
|
|
711
|
+
--bic-card-box-shadow: 0 0 0 var(--bi-stroke-thin) var(--bic-card-border-color);
|
|
712
|
+
--bic-card-border-color: var(--bi-neutral-15);
|
|
900
713
|
--bic-card-color: var(--bi-neutral-95);
|
|
901
714
|
--bic-card-header-title-color: var(--bi-neutral-95);
|
|
902
715
|
--bic-card-header-bold-color: var(--bi-primary-60);
|
|
903
716
|
--bic-card-header-label-color: var(--bi-neutral-50);
|
|
904
|
-
--bic-card-actions-background-color: var(--bi-neutral-10);
|
|
905
|
-
--bic-card-actions-icon-color: var(--bi-primary-50);
|
|
906
|
-
--bic-card-actions-flex-direction: column;
|
|
907
|
-
--bic-card-content-padding: var(--bi-scale-4x);
|
|
908
717
|
--bic-card-content-color: var(--bi-neutral-50);
|
|
718
|
+
--bic-card-content-padding: var(--bi-scale-4x);
|
|
719
|
+
--bic-card-border-radius: var(--bi-radius-medium);
|
|
909
720
|
--bic-card-content-lines: 2;
|
|
910
721
|
--bic-card-media-width: 100%;
|
|
911
722
|
--bic-card-media-date-width: 3.1875rem;
|
|
912
723
|
--bic-card-media-date-height: 2.875rem;
|
|
724
|
+
--bic-card-actions-flex-direction: column;
|
|
725
|
+
--bic-card-actions-background-color: var(--bi-neutral-10);
|
|
726
|
+
--bic-card-actions-icon-color: var(--bi-primary-50);
|
|
727
|
+
--bic-card-border-hover-color: var(--bi-neutral-50);
|
|
728
|
+
--bic-card-box-shadow-hover-color: #0000000d;
|
|
729
|
+
--bic-card-box-shadow-focus-color: var(--bi-primary-50);
|
|
730
|
+
--bic-card-box-shadow-focus-background-color: var(--bi-basic-white);
|
|
731
|
+
--bic-card-box-shadow-focus-outer-border: 6px;
|
|
732
|
+
--bic-card-box-shadow-focus-inner-border: 4px;
|
|
733
|
+
--bic-card-border-active-color: var(--bi-primary-50);
|
|
734
|
+
--bic-card-box-shadow-active-color: #0000000d;
|
|
735
|
+
--bic-card-box-shadow-active-outer-border: 20px;
|
|
736
|
+
--bic-card-box-shadow-active-inner-border: 10px;
|
|
913
737
|
}
|
|
914
738
|
|
|
915
739
|
.bi-card[data-dark="true"] {
|
|
740
|
+
--bic-card-background-color: var(--bi-neutral-90);
|
|
916
741
|
--bic-card-box-shadow: 0 0 0 var(--bi-stroke-thin) var(--bi-neutral-70);
|
|
917
742
|
--bic-card-border-color: var(--bi-neutral-70);
|
|
918
|
-
--bic-card-background-color: var(--bi-neutral-95);
|
|
919
743
|
--bic-card-color: var(--bi-neutral-5);
|
|
920
744
|
--bic-card-header-title-color: var(--bi-neutral-5);
|
|
921
745
|
--bic-card-header-bold-color: var(--bi-primary-20);
|
|
922
746
|
--bic-card-header-label-color: var(--bi-neutral-30);
|
|
923
|
-
--bic-card-actions-background-color: var(--bi-neutral-75);
|
|
924
|
-
--bic-card-actions-icon-color: var(--bi-primary-20);
|
|
925
747
|
--bic-card-content-color: var(--bi-neutral-30);
|
|
748
|
+
--bic-card-actions-background-color: var(--bi-neutral-75);
|
|
749
|
+
--bic-card-actions-icon-color: var(--bi-neutral-10);
|
|
750
|
+
--bic-card-border-hover-color: var(--bi-neutral-25);
|
|
751
|
+
--bic-card-box-shadow-hover-color: #b2cdf40d;
|
|
752
|
+
--bic-card-box-shadow-focus-color: var(--bi-secondary-50);
|
|
753
|
+
--bic-card-box-shadow-focus-background-color: var(--bi-neutral-95);
|
|
754
|
+
--bic-card-box-shadow-focus-outer-border: 4.5px;
|
|
755
|
+
--bic-card-box-shadow-focus-inner-border: 4px;
|
|
756
|
+
--bic-card-border-active-color: var(--bi-primary-50);
|
|
757
|
+
--bic-card-box-shadow-active-color: #b2cdf40d;
|
|
926
758
|
}
|
|
927
759
|
|
|
928
760
|
.bi-card {
|
|
@@ -1001,6 +833,23 @@
|
|
|
1001
833
|
--bic-card-header-label-color: var(--bi-warning-90);
|
|
1002
834
|
}
|
|
1003
835
|
|
|
836
|
+
.bi-card[data-color="primary"][data-dark="true"] {
|
|
837
|
+
--bic-card-background-color: var(--bi-primary-90);
|
|
838
|
+
--bic-card-box-shadow: 0 0 0 var(--bi-stroke-thin) var(--bi-primary-75);
|
|
839
|
+
--bic-card-border-color: var(--bi-primary-75);
|
|
840
|
+
--bic-card-color: var(--bi-neutral-5);
|
|
841
|
+
--bic-card-header-title-color: var(--bi-neutral-5);
|
|
842
|
+
--bic-card-header-bold-color: var(--bi-primary-20);
|
|
843
|
+
--bic-card-header-label-color: var(--bi-neutral-30);
|
|
844
|
+
--bic-card-content-color: var(--bi-neutral-30);
|
|
845
|
+
--bic-card-actions-background-color: var(--bi-primary-85);
|
|
846
|
+
--bic-card-actions-icon-color: var(--bi-primary-10);
|
|
847
|
+
--bic-card-border-hover-color: var(--bi-primary-40);
|
|
848
|
+
--bic-card-box-shadow-focus-color: var(--bi-neutral-15);
|
|
849
|
+
--bic-card-box-shadow-focus-background-color: var(--bi-secondary-50);
|
|
850
|
+
--bic-card-border-active-color: var(--bi-primary-10);
|
|
851
|
+
}
|
|
852
|
+
|
|
1004
853
|
.bi-card[data-error="true"] {
|
|
1005
854
|
box-shadow: 0 0 0 var(--bi-stroke-thick) var(--bi-alert-50);
|
|
1006
855
|
--bic-card-border-color: transparent;
|
|
@@ -1048,8 +897,8 @@
|
|
|
1048
897
|
}
|
|
1049
898
|
|
|
1050
899
|
.bi-card:-webkit-any(a, button):not(.disabled):focus-visible {
|
|
1051
|
-
box-shadow: var(--bic-card-box-shadow)
|
|
1052
|
-
outline: var(--_bi--focus, 1.5px solid var(--
|
|
900
|
+
box-shadow: 0 0 0 var(--bic-card-box-shadow-focus-inner-border) var(--bic-card-box-shadow-focus-background-color), 0 0 0 var(--bic-card-box-shadow-focus-outer-border) var(--bic-card-box-shadow-focus-color);
|
|
901
|
+
outline: var(--_bi--focus, 1.5px solid var(--bic-card-box-shadow-focus-color));
|
|
1053
902
|
outline-offset: var(--_bi--focus, 2px);
|
|
1054
903
|
}
|
|
1055
904
|
|
|
@@ -1059,12 +908,12 @@
|
|
|
1059
908
|
|
|
1060
909
|
@media (hover: hover) and (pointer: fine) {
|
|
1061
910
|
.bi-card:-webkit-any(a, button):not(.disabled):hover {
|
|
1062
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--
|
|
911
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--bic-card-border-hover-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-hover-color), 0px 0px 10px 0px var(--bic-card-box-shadow-hover-color);
|
|
1063
912
|
}
|
|
1064
913
|
}
|
|
1065
914
|
|
|
1066
915
|
.bi-card:-webkit-any(a, button):not(.disabled):active {
|
|
1067
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-
|
|
916
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-medium) var(--bic-card-border-active-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-active-color), 0px 0px 10px 0px var(--bic-card-box-shadow-active-color);
|
|
1068
917
|
}
|
|
1069
918
|
|
|
1070
919
|
.bi-card:-webkit-any(a, button):disabled {
|
|
@@ -1079,8 +928,8 @@
|
|
|
1079
928
|
}
|
|
1080
929
|
|
|
1081
930
|
.bi-card:is(a, button):not(.disabled):focus-visible {
|
|
1082
|
-
box-shadow: var(--bic-card-box-shadow)
|
|
1083
|
-
outline: var(--_bi--focus, 1.5px solid var(--
|
|
931
|
+
box-shadow: 0 0 0 var(--bic-card-box-shadow-focus-inner-border) var(--bic-card-box-shadow-focus-background-color), 0 0 0 var(--bic-card-box-shadow-focus-outer-border) var(--bic-card-box-shadow-focus-color);
|
|
932
|
+
outline: var(--_bi--focus, 1.5px solid var(--bic-card-box-shadow-focus-color));
|
|
1084
933
|
outline-offset: var(--_bi--focus, 2px);
|
|
1085
934
|
}
|
|
1086
935
|
|
|
@@ -1090,12 +939,12 @@
|
|
|
1090
939
|
|
|
1091
940
|
@media (hover: hover) and (pointer: fine) {
|
|
1092
941
|
.bi-card:is(a, button):not(.disabled):hover {
|
|
1093
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--
|
|
942
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--bic-card-border-hover-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-hover-color), 0px 0px 10px 0px var(--bic-card-box-shadow-hover-color);
|
|
1094
943
|
}
|
|
1095
944
|
}
|
|
1096
945
|
|
|
1097
946
|
.bi-card:is(a, button):not(.disabled):active {
|
|
1098
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-
|
|
947
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-medium) var(--bic-card-border-active-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-active-color), 0px 0px 10px 0px var(--bic-card-box-shadow-active-color);
|
|
1099
948
|
}
|
|
1100
949
|
|
|
1101
950
|
.bi-card:is(a, button):disabled {
|
|
@@ -1110,8 +959,8 @@
|
|
|
1110
959
|
}
|
|
1111
960
|
|
|
1112
961
|
.bi-card .bi-card--content:-webkit-any(a, button):not(.disabled):focus-visible {
|
|
1113
|
-
box-shadow: var(--bic-card-box-shadow)
|
|
1114
|
-
outline: var(--_bi--focus, 1.5px solid var(--
|
|
962
|
+
box-shadow: 0 0 0 var(--bic-card-box-shadow-focus-inner-border) var(--bic-card-box-shadow-focus-background-color), 0 0 0 var(--bic-card-box-shadow-focus-outer-border) var(--bic-card-box-shadow-focus-color);
|
|
963
|
+
outline: var(--_bi--focus, 1.5px solid var(--bic-card-box-shadow-focus-color));
|
|
1115
964
|
outline-offset: var(--_bi--focus, 2px);
|
|
1116
965
|
}
|
|
1117
966
|
|
|
@@ -1121,12 +970,12 @@
|
|
|
1121
970
|
|
|
1122
971
|
@media (hover: hover) and (pointer: fine) {
|
|
1123
972
|
.bi-card .bi-card--content:-webkit-any(a, button):not(.disabled):hover {
|
|
1124
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--
|
|
973
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--bic-card-border-hover-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-hover-color), 0px 0px 10px 0px var(--bic-card-box-shadow-hover-color);
|
|
1125
974
|
}
|
|
1126
975
|
}
|
|
1127
976
|
|
|
1128
977
|
.bi-card .bi-card--content:-webkit-any(a, button):not(.disabled):active {
|
|
1129
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-
|
|
978
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-medium) var(--bic-card-border-active-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-active-color), 0px 0px 10px 0px var(--bic-card-box-shadow-active-color);
|
|
1130
979
|
}
|
|
1131
980
|
|
|
1132
981
|
.bi-card .bi-card--content:-webkit-any(a, button):disabled {
|
|
@@ -1141,8 +990,8 @@
|
|
|
1141
990
|
}
|
|
1142
991
|
|
|
1143
992
|
.bi-card .bi-card--content:is(a, button):not(.disabled):focus-visible {
|
|
1144
|
-
box-shadow: var(--bic-card-box-shadow)
|
|
1145
|
-
outline: var(--_bi--focus, 1.5px solid var(--
|
|
993
|
+
box-shadow: 0 0 0 var(--bic-card-box-shadow-focus-inner-border) var(--bic-card-box-shadow-focus-background-color), 0 0 0 var(--bic-card-box-shadow-focus-outer-border) var(--bic-card-box-shadow-focus-color);
|
|
994
|
+
outline: var(--_bi--focus, 1.5px solid var(--bic-card-box-shadow-focus-color));
|
|
1146
995
|
outline-offset: var(--_bi--focus, 2px);
|
|
1147
996
|
}
|
|
1148
997
|
|
|
@@ -1152,12 +1001,12 @@
|
|
|
1152
1001
|
|
|
1153
1002
|
@media (hover: hover) and (pointer: fine) {
|
|
1154
1003
|
.bi-card .bi-card--content:is(a, button):not(.disabled):hover {
|
|
1155
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--
|
|
1004
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-thick) var(--bic-card-border-hover-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-hover-color), 0px 0px 10px 0px var(--bic-card-box-shadow-hover-color);
|
|
1156
1005
|
}
|
|
1157
1006
|
}
|
|
1158
1007
|
|
|
1159
1008
|
.bi-card .bi-card--content:is(a, button):not(.disabled):active {
|
|
1160
|
-
box-shadow: 0px 0px 0px var(--bi-stroke-
|
|
1009
|
+
box-shadow: 0px 0px 0px var(--bi-stroke-medium) var(--bic-card-border-active-color), 0px 0px 20px var(--bi-scale-1-5x) var(--bic-card-box-shadow-active-color), 0px 0px 10px 0px var(--bic-card-box-shadow-active-color);
|
|
1161
1010
|
}
|
|
1162
1011
|
|
|
1163
1012
|
.bi-card .bi-card--content:is(a, button):disabled {
|
|
@@ -1302,7 +1151,7 @@
|
|
|
1302
1151
|
padding: var(--bi-scale-1x) var(--bi-scale-1x) var(--bi-scale-2x);
|
|
1303
1152
|
border-radius: var(--bi-radius-small) var(--bi-radius-small) var(--bi-radius-large) var(--bi-radius-large);
|
|
1304
1153
|
background: var(--bic-card-background-color);
|
|
1305
|
-
box-shadow: 0px 8px 16px var(--bi-scale-1-5x)
|
|
1154
|
+
box-shadow: 0px 8px 16px var(--bi-scale-1-5x) #26333f0d, 0px 4px 6px 0px #26333f0d;
|
|
1306
1155
|
color: var(--bic-card-header-title-color);
|
|
1307
1156
|
text-align: center;
|
|
1308
1157
|
flex-direction: column;
|
|
@@ -1334,7 +1183,7 @@
|
|
|
1334
1183
|
.bi-checkbox-subsection > div:first-child {
|
|
1335
1184
|
margin: 0 var(--bi-scale-3x) 0 var(--bi-scale-5x);
|
|
1336
1185
|
background-color: var(--bic-checkbox-subsection-line-bg);
|
|
1337
|
-
width: var(--bi-stroke-
|
|
1186
|
+
width: var(--bi-stroke-medium);
|
|
1338
1187
|
}
|
|
1339
1188
|
|
|
1340
1189
|
.bi-checkbox-subsection > div:last-child {
|
|
@@ -1540,7 +1389,7 @@ details.bi-details {
|
|
|
1540
1389
|
--bic-details-background-hover: linear-gradient(0deg, var(--bi-states-hover-dark) 0%, var(--bi-states-hover-dark) 100%), var(--bic-details-background);
|
|
1541
1390
|
--bic-details-background-press: linear-gradient(0deg, var(--bi-states-press-dark) 0%, var(--bi-states-press-dark) 100%), var(--bic-details-background);
|
|
1542
1391
|
--bic-details-color: var(--bi-neutral-90);
|
|
1543
|
-
--bic-details-border-color: var(--bi-
|
|
1392
|
+
--bic-details-border-color: var(--bi-neutral-15);
|
|
1544
1393
|
--bic-details-padding: var(--bi-scale-4x);
|
|
1545
1394
|
}
|
|
1546
1395
|
|
|
@@ -1674,7 +1523,7 @@ details.bi-details > *:not(summary) + * {
|
|
|
1674
1523
|
|
|
1675
1524
|
.bi-dialog {
|
|
1676
1525
|
--bic-dialog-animation-duration: .2s;
|
|
1677
|
-
--bic-dialog-backdrop-background:
|
|
1526
|
+
--bic-dialog-backdrop-background: #00000080;
|
|
1678
1527
|
--bic-dialog-background: var(--bi-basic-white);
|
|
1679
1528
|
--bic-dialog-border-color: var(--bi-neutral-15);
|
|
1680
1529
|
--bic-dialog-icon-spacing: .625rem;
|
|
@@ -1694,7 +1543,7 @@ details.bi-details > *:not(summary) + * {
|
|
|
1694
1543
|
animation: bi-dialog-fade-in-animation var(--bic-dialog-animation-duration) forwards;
|
|
1695
1544
|
background: var(--bic-dialog-background);
|
|
1696
1545
|
border-radius: var(--bi-radius-large);
|
|
1697
|
-
box-shadow: 0 var(--bi-scale-1x) var(--bi-scale-1x) 0
|
|
1546
|
+
box-shadow: 0 var(--bi-scale-1x) var(--bi-scale-1x) 0 #00000040;
|
|
1698
1547
|
color: var(--bic-dialog-color);
|
|
1699
1548
|
max-height: var(--bic-dialog-max-height);
|
|
1700
1549
|
max-width: var(--bic-dialog-max-width);
|
|
@@ -1713,7 +1562,7 @@ details.bi-details > *:not(summary) + * {
|
|
|
1713
1562
|
|
|
1714
1563
|
.bi-dialog::backdrop {
|
|
1715
1564
|
animation: bi-dialog-fade-in-animation var(--bic-dialog-animation-duration) ease-in-out;
|
|
1716
|
-
background: var(--bic-dialog-backdrop-background,
|
|
1565
|
+
background: var(--bic-dialog-backdrop-background, #00000080);
|
|
1717
1566
|
}
|
|
1718
1567
|
|
|
1719
1568
|
.bi-dialog[open] {
|
|
@@ -1906,15 +1755,15 @@ body:has(.bi-dialog:modal) {
|
|
|
1906
1755
|
--bic-dropdown-background: var(--bi-basic-white);
|
|
1907
1756
|
--bic-dropdown-border-width: var(--bi-stroke-thin);
|
|
1908
1757
|
--bic-dropdown-border-style: solid;
|
|
1909
|
-
--bic-dropdown-border-color: var(--bi-
|
|
1910
|
-
--bic-dropdown-box-shadow: 0px 8px 16px -4px
|
|
1758
|
+
--bic-dropdown-border-color: var(--bi-neutral-15);
|
|
1759
|
+
--bic-dropdown-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08, 0px 2px 2px -1px #26333f0a;
|
|
1911
1760
|
}
|
|
1912
1761
|
|
|
1913
1762
|
.bi-dropdown[data-dark="true"] {
|
|
1914
1763
|
--bic-dropdown-background: var(--bi-neutral-100);
|
|
1915
1764
|
--bic-dropdown-border-color: var(--bi-neutral-90);
|
|
1916
1765
|
--bic-dropdown-color: var(--bi-neutral-5);
|
|
1917
|
-
--bic-dropdown-box-shadow: 0px 8px 16px -4px
|
|
1766
|
+
--bic-dropdown-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08, 0px 2px 2px -1px #26333f0a;
|
|
1918
1767
|
}
|
|
1919
1768
|
|
|
1920
1769
|
.bi-dropdown {
|
|
@@ -2084,19 +1933,11 @@ body:has(.bi-dialog:modal) {
|
|
|
2084
1933
|
gap: 0;
|
|
2085
1934
|
}
|
|
2086
1935
|
|
|
2087
|
-
.bi-field:has(.bi-input
|
|
2088
|
-
background: var(--_bi--hover, var(--bic-field-background-hover));
|
|
2089
|
-
}
|
|
2090
|
-
|
|
2091
|
-
.bi-field:has(.bi-input:-webkit-any([type="radio"], [type="checkbox"])):hover:not(:-webkit-any(:has(a:hover), :has([aria-disabled="true"], :disabled))) * {
|
|
2092
|
-
--_bi--hover: ;
|
|
2093
|
-
}
|
|
2094
|
-
|
|
2095
|
-
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:is(:has(a:hover), :has([aria-disabled="true"], :disabled))) {
|
|
1936
|
+
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:has(a:hover), :has([aria-disabled="true"], :disabled)) {
|
|
2096
1937
|
background: var(--_bi--hover, var(--bic-field-background-hover));
|
|
2097
1938
|
}
|
|
2098
1939
|
|
|
2099
|
-
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:
|
|
1940
|
+
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:has(a:hover), :has([aria-disabled="true"], :disabled)) * {
|
|
2100
1941
|
--_bi--hover: ;
|
|
2101
1942
|
}
|
|
2102
1943
|
|
|
@@ -2167,19 +2008,11 @@ body:has(.bi-dialog:modal) {
|
|
|
2167
2008
|
gap: 0;
|
|
2168
2009
|
}
|
|
2169
2010
|
|
|
2170
|
-
.bi-field:has(.bi-input
|
|
2171
|
-
background: var(--_bi--hover, var(--bic-field-background-hover));
|
|
2172
|
-
}
|
|
2173
|
-
|
|
2174
|
-
.bi-field:has(.bi-input:-webkit-any([type="radio"], [type="checkbox"])):hover:not(:-webkit-any(:has(a:hover), :has([aria-disabled="true"], :disabled))) * {
|
|
2175
|
-
--_bi--hover: ;
|
|
2176
|
-
}
|
|
2177
|
-
|
|
2178
|
-
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:is(:has(a:hover), :has([aria-disabled="true"], :disabled))) {
|
|
2011
|
+
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:has(a:hover), :has([aria-disabled="true"], :disabled)) {
|
|
2179
2012
|
background: var(--_bi--hover, var(--bic-field-background-hover));
|
|
2180
2013
|
}
|
|
2181
2014
|
|
|
2182
|
-
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:
|
|
2015
|
+
.bi-field:has(.bi-input:is([type="radio"], [type="checkbox"])):hover:not(:has(a:hover), :has([aria-disabled="true"], :disabled)) * {
|
|
2183
2016
|
--_bi--hover: ;
|
|
2184
2017
|
}
|
|
2185
2018
|
|
|
@@ -2234,7 +2067,7 @@ body:has(.bi-dialog:modal) {
|
|
|
2234
2067
|
.bi-field .bi-field--affixes:has(.bi-input:focus-visible) {
|
|
2235
2068
|
outline: var(--_bi--focus, var(--bi-stroke-thick) solid var(--bi-primary-50));
|
|
2236
2069
|
outline-offset: 0;
|
|
2237
|
-
box-shadow: var(--_bi--focus, 0px 0px 20px var(--bi-scale-1-5x)
|
|
2070
|
+
box-shadow: var(--_bi--focus, 0px 0px 20px var(--bi-scale-1-5x) #0000000d, 0px 0px 10px 0px #0000000d);
|
|
2238
2071
|
}
|
|
2239
2072
|
|
|
2240
2073
|
.bi-field .bi-field--affixes:has(.bi-input:focus-visible) * {
|
|
@@ -2252,14 +2085,7 @@ body:has(.bi-dialog:modal) {
|
|
|
2252
2085
|
display: flex;
|
|
2253
2086
|
}
|
|
2254
2087
|
|
|
2255
|
-
.bi-field .bi-field--affixes .bi-field--affix:first-child:not(
|
|
2256
|
-
border-top-left-radius: inherit;
|
|
2257
|
-
border-bottom-left-radius: inherit;
|
|
2258
|
-
border-right: 0;
|
|
2259
|
-
padding-right: 0;
|
|
2260
|
-
}
|
|
2261
|
-
|
|
2262
|
-
.bi-field .bi-field--affixes .bi-field--affix:first-child:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
|
|
2088
|
+
.bi-field .bi-field--affixes .bi-field--affix:first-child:not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
|
|
2263
2089
|
border-top-left-radius: inherit;
|
|
2264
2090
|
border-bottom-left-radius: inherit;
|
|
2265
2091
|
border-right: 0;
|
|
@@ -2280,14 +2106,7 @@ body:has(.bi-dialog:modal) {
|
|
|
2280
2106
|
padding-left: 0;
|
|
2281
2107
|
}
|
|
2282
2108
|
|
|
2283
|
-
.bi-field .bi-field--affixes .bi-field--affix:last-child:not(
|
|
2284
|
-
border-top-right-radius: inherit;
|
|
2285
|
-
border-bottom-right-radius: inherit;
|
|
2286
|
-
border-left: 0;
|
|
2287
|
-
padding-left: 0;
|
|
2288
|
-
}
|
|
2289
|
-
|
|
2290
|
-
.bi-field .bi-field--affixes .bi-field--affix:last-child:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
|
|
2109
|
+
.bi-field .bi-field--affixes .bi-field--affix:last-child:not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
|
|
2291
2110
|
border-top-right-radius: inherit;
|
|
2292
2111
|
border-bottom-right-radius: inherit;
|
|
2293
2112
|
border-left: 0;
|
|
@@ -2356,7 +2175,7 @@ body:has(.bi-dialog:modal) {
|
|
|
2356
2175
|
--bic-filter-group-background: var(--bi-basic-white);
|
|
2357
2176
|
--bic-filter-group-background-hover: linear-gradient(0deg, var(--bi-states-hover-dark) 0%, var(--bi-states-hover-dark) 100%), var(--bic-filter-group-background);
|
|
2358
2177
|
--bic-filter-group-background-press: linear-gradient(0deg, var(--bi-states-press-dark) 0%, var(--bi-states-press-dark) 100%), var(--bic-filter-group-background);
|
|
2359
|
-
--bic-filter-group-background-expanded: var(--bi-
|
|
2178
|
+
--bic-filter-group-background-expanded: var(--bi-neutral-15);
|
|
2360
2179
|
--bic-filter-group-border-color: var(--bi-neutral-15);
|
|
2361
2180
|
--bic-filter-group-text-color: var(--bi-neutral-90);
|
|
2362
2181
|
}
|
|
@@ -2439,7 +2258,7 @@ body:has(.bi-dialog:modal) {
|
|
|
2439
2258
|
|
|
2440
2259
|
.bi-filter-group:last-of-type > button {
|
|
2441
2260
|
border-radius: var(--bi-radius-small);
|
|
2442
|
-
border-bottom-color:
|
|
2261
|
+
border-bottom-color: #0000;
|
|
2443
2262
|
}
|
|
2444
2263
|
|
|
2445
2264
|
.bi-filter-group:last-of-type > div {
|
|
@@ -2452,7 +2271,7 @@ body:has(.bi-dialog:modal) {
|
|
|
2452
2271
|
|
|
2453
2272
|
.bi-filter-group[data-expanded="true"] > button {
|
|
2454
2273
|
border-radius: var(--bi-radius-small);
|
|
2455
|
-
border-bottom-color:
|
|
2274
|
+
border-bottom-color: #0000;
|
|
2456
2275
|
}
|
|
2457
2276
|
|
|
2458
2277
|
.bi-filter-group[data-expanded="true"] > div {
|
|
@@ -2743,26 +2562,18 @@ svg[data-color="white"] {
|
|
|
2743
2562
|
--bic-input-font-size: 1.25rem;
|
|
2744
2563
|
}
|
|
2745
2564
|
|
|
2746
|
-
.bi-input:where(:not(
|
|
2747
|
-
box-shadow: var(--_bi--hover, var(--bic-input-box-shadow-hover));
|
|
2748
|
-
}
|
|
2749
|
-
|
|
2750
|
-
.bi-input:where(:not(:-webkit-any([type="checkbox"], [type="radio"]))):focus-visible {
|
|
2751
|
-
--bic-input-border-color: var(--bi-primary-50);
|
|
2752
|
-
}
|
|
2753
|
-
|
|
2754
|
-
.bi-input:where(:not(:is([type="checkbox"], [type="radio"]))):hover {
|
|
2565
|
+
.bi-input:where(:not([type="checkbox"], [type="radio"])):hover {
|
|
2755
2566
|
box-shadow: var(--_bi--hover, var(--bic-input-box-shadow-hover));
|
|
2756
2567
|
}
|
|
2757
2568
|
|
|
2758
|
-
.bi-input:where(:not(
|
|
2569
|
+
.bi-input:where(:not([type="checkbox"], [type="radio"])):focus-visible {
|
|
2759
2570
|
--bic-input-border-color: var(--bi-primary-50);
|
|
2760
2571
|
}
|
|
2761
2572
|
|
|
2762
2573
|
.bi-input:focus-visible {
|
|
2763
2574
|
outline: var(--_bi--focus, var(--bi-stroke-thick) solid var(--bi-primary-50));
|
|
2764
2575
|
outline-offset: 0;
|
|
2765
|
-
box-shadow: var(--_bi--focus, 0px 0px 20px var(--bi-scale-1-5x)
|
|
2576
|
+
box-shadow: var(--_bi--focus, 0px 0px 20px var(--bi-scale-1-5x) #0000000d, 0px 0px 10px 0px #0000000d);
|
|
2766
2577
|
}
|
|
2767
2578
|
|
|
2768
2579
|
.bi-input:focus-visible * {
|
|
@@ -2773,11 +2584,7 @@ svg[data-color="white"] {
|
|
|
2773
2584
|
color: var(--bic-input-placeholder-color);
|
|
2774
2585
|
}
|
|
2775
2586
|
|
|
2776
|
-
.bi-input:not(
|
|
2777
|
-
width: 100%;
|
|
2778
|
-
}
|
|
2779
|
-
|
|
2780
|
-
.bi-input:not(:is([size], [cols])) {
|
|
2587
|
+
.bi-input:not([size], [cols]) {
|
|
2781
2588
|
width: 100%;
|
|
2782
2589
|
}
|
|
2783
2590
|
|
|
@@ -2831,26 +2638,18 @@ svg[data-color="white"] {
|
|
|
2831
2638
|
field-sizing: content;
|
|
2832
2639
|
}
|
|
2833
2640
|
|
|
2834
|
-
.bi-input:-webkit-any(select):not(
|
|
2641
|
+
.bi-input:-webkit-any(select):not([readonly], [aria-disabled="true"], :disabled) {
|
|
2835
2642
|
cursor: pointer;
|
|
2836
2643
|
}
|
|
2837
2644
|
|
|
2838
|
-
.bi-input
|
|
2839
|
-
cursor: pointer;
|
|
2840
|
-
}
|
|
2841
|
-
|
|
2842
|
-
.bi-input:is(select) {
|
|
2645
|
+
.bi-input:-webkit-any(select) {
|
|
2843
2646
|
background-image: var(--bic-input-select-chevron);
|
|
2844
2647
|
background-position: calc(100% - .5em);
|
|
2845
2648
|
background-repeat: no-repeat;
|
|
2846
2649
|
background-size: 1.5em;
|
|
2847
2650
|
}
|
|
2848
2651
|
|
|
2849
|
-
.bi-input
|
|
2850
|
-
cursor: pointer;
|
|
2851
|
-
}
|
|
2852
|
-
|
|
2853
|
-
.bi-input:is(select):not(:is([readonly], [aria-disabled="true"], :disabled)) {
|
|
2652
|
+
.bi-input:is(select):not([readonly], [aria-disabled="true"], :disabled) {
|
|
2854
2653
|
cursor: pointer;
|
|
2855
2654
|
}
|
|
2856
2655
|
|
|
@@ -2867,7 +2666,7 @@ svg[data-color="white"] {
|
|
|
2867
2666
|
height: var(--bic-input-toggle-size);
|
|
2868
2667
|
width: var(--bic-input-toggle-size);
|
|
2869
2668
|
box-shadow: none;
|
|
2870
|
-
border-width: var(--bi-stroke-
|
|
2669
|
+
border-width: var(--bi-stroke-medium);
|
|
2871
2670
|
border-style: solid;
|
|
2872
2671
|
border-color: var(--bic-input-border-color);
|
|
2873
2672
|
background: none;
|
|
@@ -2884,11 +2683,7 @@ svg[data-color="white"] {
|
|
|
2884
2683
|
--_bi--focus: ;
|
|
2885
2684
|
}
|
|
2886
2685
|
|
|
2887
|
-
.bi-input
|
|
2888
|
-
cursor: pointer;
|
|
2889
|
-
}
|
|
2890
|
-
|
|
2891
|
-
.bi-input:is([type="checkbox"], [type="radio"]):read-only:not(:is([readonly], [aria-disabled="true"], :disabled)) {
|
|
2686
|
+
.bi-input:is([type="checkbox"], [type="radio"]):read-only:not([readonly], [aria-disabled="true"], :disabled) {
|
|
2892
2687
|
cursor: pointer;
|
|
2893
2688
|
}
|
|
2894
2689
|
|
|
@@ -2964,7 +2759,7 @@ svg[data-color="white"] {
|
|
|
2964
2759
|
height: var(--bic-input-toggle-size);
|
|
2965
2760
|
width: var(--bic-input-toggle-size);
|
|
2966
2761
|
box-shadow: none;
|
|
2967
|
-
border-width: var(--bi-stroke-
|
|
2762
|
+
border-width: var(--bi-stroke-medium);
|
|
2968
2763
|
border-style: solid;
|
|
2969
2764
|
border-color: var(--bic-input-border-color);
|
|
2970
2765
|
background: none;
|
|
@@ -2981,11 +2776,7 @@ svg[data-color="white"] {
|
|
|
2981
2776
|
--_bi--focus: ;
|
|
2982
2777
|
}
|
|
2983
2778
|
|
|
2984
|
-
.bi-input
|
|
2985
|
-
cursor: pointer;
|
|
2986
|
-
}
|
|
2987
|
-
|
|
2988
|
-
.bi-input:is([type="checkbox"], [type="radio"]):read-only:not(:is([readonly], [aria-disabled="true"], :disabled)) {
|
|
2779
|
+
.bi-input:is([type="checkbox"], [type="radio"]):read-only:not([readonly], [aria-disabled="true"], :disabled) {
|
|
2989
2780
|
cursor: pointer;
|
|
2990
2781
|
}
|
|
2991
2782
|
|
|
@@ -3086,11 +2877,7 @@ svg[data-color="white"] {
|
|
|
3086
2877
|
color: var(--bic-label-required-color);
|
|
3087
2878
|
}
|
|
3088
2879
|
|
|
3089
|
-
.bi-label:has( ~ .bi-input:required, ~ .bi-field--affixes > .bi-input:required):not(
|
|
3090
|
-
padding-right: var(--bi-scale-0-25x);
|
|
3091
|
-
}
|
|
3092
|
-
|
|
3093
|
-
.bi-label:has( ~ .bi-input:required, ~ .bi-field--affixes > .bi-input:required):not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))):before {
|
|
2880
|
+
.bi-label:has( ~ .bi-input:required, ~ .bi-field--affixes > .bi-input:required):not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
|
|
3094
2881
|
padding-right: var(--bi-scale-0-25x);
|
|
3095
2882
|
}
|
|
3096
2883
|
|
|
@@ -3266,12 +3053,18 @@ svg[data-color="white"] {
|
|
|
3266
3053
|
align-items: center;
|
|
3267
3054
|
gap: var(--bi-scale-6x);
|
|
3268
3055
|
width: 100%;
|
|
3269
|
-
padding: 0 var(--bi-scale-
|
|
3056
|
+
padding: 0 var(--bi-scale-6x);
|
|
3270
3057
|
background-color: inherit;
|
|
3271
3058
|
color: inherit;
|
|
3272
3059
|
display: flex;
|
|
3273
3060
|
}
|
|
3274
3061
|
|
|
3062
|
+
@media not (min-width: 768px) {
|
|
3063
|
+
.bi-navbar > header {
|
|
3064
|
+
padding: 0 var(--bi-scale-4x);
|
|
3065
|
+
}
|
|
3066
|
+
}
|
|
3067
|
+
|
|
3275
3068
|
@media (prefers-reduced-motion: no-preference) {
|
|
3276
3069
|
.bi-navbar > header {
|
|
3277
3070
|
transition: transform .2s ease-in-out;
|
|
@@ -3396,19 +3189,19 @@ svg[data-color="white"] {
|
|
|
3396
3189
|
--bic-popover-background: var(--bi-basic-white);
|
|
3397
3190
|
--bic-popover-border-width: var(--bi-stroke-thin);
|
|
3398
3191
|
--bic-popover-border-style: solid;
|
|
3399
|
-
--bic-popover-border-color: var(--bi-
|
|
3192
|
+
--bic-popover-border-color: var(--bi-neutral-15);
|
|
3400
3193
|
--bic-popover-color: var(--bi-neutral-90);
|
|
3401
3194
|
--bic-popover-border-radius: var(--bi-radius-medium);
|
|
3402
3195
|
--bic-popover-max-width: 300px;
|
|
3403
3196
|
--bic-popover-padding: var(--bi-scale-1x);
|
|
3404
|
-
--bic-popover-box-shadow: 0px 8px 16px -4px
|
|
3197
|
+
--bic-popover-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08, 0px 2px 2px -1px #26333f0a;
|
|
3405
3198
|
}
|
|
3406
3199
|
|
|
3407
3200
|
.bi-popover[data-dark="true"] {
|
|
3408
3201
|
--bic-popover-background: var(--bi-neutral-95);
|
|
3409
3202
|
--bic-popover-border-color: var(--bi-neutral-70);
|
|
3410
3203
|
--bic-popover-color: var(--bi-neutral-5);
|
|
3411
|
-
--bic-popover-box-shadow: 0px 8px 16px -4px
|
|
3204
|
+
--bic-popover-box-shadow: 0px 8px 16px -4px #26333f14, 4px 4px 6px -2px #26333f08, 0px 2px 2px -1px #26333f0a;
|
|
3412
3205
|
}
|
|
3413
3206
|
|
|
3414
3207
|
.bi-popover {
|
|
@@ -3501,13 +3294,13 @@ svg[data-color="white"] {
|
|
|
3501
3294
|
.bi-spinner {
|
|
3502
3295
|
--bic-spinner-color: currentColor;
|
|
3503
3296
|
aspect-ratio: 1;
|
|
3504
|
-
background: radial-gradient(farthest-side, var(--bic-spinner-color) 94%,
|
|
3297
|
+
background: radial-gradient(farthest-side, var(--bic-spinner-color) 94%, #0000) top / 4px 4px no-repeat, conic-gradient(#0000 30%, var(--bic-spinner-color));
|
|
3505
3298
|
border-radius: 50%;
|
|
3506
3299
|
width: 1em;
|
|
3507
3300
|
height: 1em;
|
|
3508
3301
|
animation: 1s linear infinite bi-spinner;
|
|
3509
|
-
-webkit-mask: radial-gradient(farthest-side,
|
|
3510
|
-
mask: radial-gradient(farthest-side,
|
|
3302
|
+
-webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
|
|
3303
|
+
mask: radial-gradient(farthest-side, #0000 calc(100% - 4px), #000 0);
|
|
3511
3304
|
}
|
|
3512
3305
|
|
|
3513
3306
|
@media (prefers-reduced-motion: reduce) {
|
|
@@ -3669,11 +3462,7 @@ svg[data-color="white"] {
|
|
|
3669
3462
|
position: relative;
|
|
3670
3463
|
}
|
|
3671
3464
|
|
|
3672
|
-
.bi-validation-message:has( > svg):not(
|
|
3673
|
-
padding-left: calc(var(--bic-validation-message-icon-size) + var(--bic-validation-message-padding) * 2);
|
|
3674
|
-
}
|
|
3675
|
-
|
|
3676
|
-
.bi-validation-message:has( > svg):not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {
|
|
3465
|
+
.bi-validation-message:has( > svg):not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
|
|
3677
3466
|
padding-left: calc(var(--bic-validation-message-icon-size) + var(--bic-validation-message-padding) * 2);
|
|
3678
3467
|
}
|
|
3679
3468
|
|