@blackbaud/skyux-design-tokens 5.2.0 → 5.4.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/CHANGELOG.md CHANGED
@@ -2,6 +2,22 @@
2
2
 
3
3
  - Added `neutral-medium-dark` token in modern. [#64](https://github.com/blackbaud/skyux-design-tokens/pull/64)
4
4
 
5
+ ## [5.4.0](https://github.com/blackbaud/skyux-design-tokens/compare/5.3.0...5.4.0) (2026-03-23)
6
+
7
+
8
+ ### Features
9
+
10
+ * public typography fixes, don't namespace public classes ([#333](https://github.com/blackbaud/skyux-design-tokens/issues/333)) ([ac81208](https://github.com/blackbaud/skyux-design-tokens/commit/ac81208177182f400df09fa9f2956a316d5e1fb3))
11
+ * update base names to default ([#331](https://github.com/blackbaud/skyux-design-tokens/issues/331)) ([9a98530](https://github.com/blackbaud/skyux-design-tokens/commit/9a98530a6cf8c5aecd65b37888c5bffbdd5140fc))
12
+
13
+ ## [5.3.0](https://github.com/blackbaud/skyux-design-tokens/compare/5.2.0...5.3.0) (2026-03-19)
14
+
15
+
16
+ ### Features
17
+
18
+ * initial public api ([#330](https://github.com/blackbaud/skyux-design-tokens/issues/330)) ([0f9df8d](https://github.com/blackbaud/skyux-design-tokens/commit/0f9df8d242a1b44b02c948e686f6839e0b9a3cdc))
19
+ * line height for m, l paragraphs; font styles for HTML strong and em ([#328](https://github.com/blackbaud/skyux-design-tokens/issues/328)) ([1b2ec8d](https://github.com/blackbaud/skyux-design-tokens/commit/1b2ec8d3605032ef4a602a7a920376d9a3c890e2))
20
+
5
21
  ## [5.2.0](https://github.com/blackbaud/skyux-design-tokens/compare/5.1.0...5.2.0) (2026-03-11)
6
22
 
7
23
 
@@ -2,7 +2,7 @@
2
2
  "fonts": [],
3
3
  "images": {
4
4
  "favicon": {
5
- "src": "https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/favicon.ico"
5
+ "src": "https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/favicon.ico"
6
6
  }
7
7
  },
8
8
  "strings": {
@@ -245,6 +245,7 @@
245
245
  --bb-font-size-650: 1.3125rem;
246
246
  --bb-font-size-700: 1.5rem;
247
247
  --bb-font-size-800: 1.6875rem;
248
+ --bb-font-style-bold: 700;
248
249
  --bb-font-style-italic-style: italic;
249
250
  --bb-font-style-italic-weight: 400;
250
251
  --bb-font-style-light: 300;
@@ -261,22 +262,24 @@
261
262
  --bb-font-weight-light: 300;
262
263
  --bb-font-weight-regular: 400;
263
264
  --bb-font-weight-semibold: 600;
264
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/bb-logo.png');
265
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
266
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-base-light.svg');
267
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
268
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
269
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
270
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
271
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
272
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.2.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
265
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/bb-logo.png');
266
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
267
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-base-light.svg');
268
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
269
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
270
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
271
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
272
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
273
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/5.4.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
273
274
  --bb-letter_spacing-normal: normal;
274
275
  --bb-letter_spacing-wider: 0.01rem;
275
276
  --bb-letter_spacing-widest: 0.046875rem;
276
277
  --bb-line_height-200: calc(16/11);
277
278
  --bb-line_height-300: calc(18/13);
278
279
  --bb-line_height-400: calc(20/15);
280
+ --bb-line_height-450: calc(22/15);
279
281
  --bb-line_height-500: calc(24/17);
282
+ --bb-line_height-550: calc(26/17);
280
283
  --bb-line_height-600: calc(28/19);
281
284
  --bb-line_height-650: calc(28/21);
282
285
  --bb-line_height-700: calc(32/24);
@@ -354,259 +357,6 @@
354
357
  --bb-shadow-slate-800: 0 5px 5px -3px rgba(33, 44, 63, 0.2), 0 3px 14px 2px rgba(33, 44, 63, 0.12), 0 8px 10px 1px rgba(33, 44, 63, 0.14);
355
358
  --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
356
359
  }
357
- .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
358
- --sky-color-background-action-accent-active: var(--bb-color-gray-600);
359
- --sky-color-background-action-accent-base: var(--bb-color-blue-900);
360
- --sky-color-background-action-accent-focus: var(--bb-color-gray-700);
361
- --sky-color-background-action-accent-hover: var(--bb-color-gray-700);
362
- --sky-color-background-action-danger-active: var(--bb-color-red-600);
363
- --sky-color-background-action-danger-base: var(--bb-color-red-600);
364
- --sky-color-background-action-danger-focus: var(--bb-color-red-600);
365
- --sky-color-background-action-danger-hover: var(--bb-color-red-600);
366
- --sky-color-background-action-input-active: var(--bb-color-transparent);
367
- --sky-color-background-action-input-base: var(--bb-color-blue-900);
368
- --sky-color-background-action-input-focus: var(--bb-color-blue-900);
369
- --sky-color-background-action-input-hover: var(--bb-color-transparent);
370
- --sky-color-background-action-primary-active: var(--bb-color-sky-500);
371
- --sky-color-background-action-primary-base: var(--bb-color-sky-600);
372
- --sky-color-background-action-primary-focus: var(--bb-color-sky-600);
373
- --sky-color-background-action-primary-hover: var(--bb-color-sky-600);
374
- --sky-color-background-action-secondary-active: var(--bb-color-gray-600);
375
- --sky-color-background-action-secondary-base: var(--bb-color-gray-800);
376
- --sky-color-background-action-secondary-focus: var(--bb-color-gray-700);
377
- --sky-color-background-action-secondary-hover: var(--bb-color-gray-700);
378
- --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
379
- --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
380
- --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
381
- --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
382
- --sky-color-background-blocking: var(--bb-color-rgba-black-70);
383
- --sky-color-background-container-backdrop: var(--bb-color-gray-900);
384
- --sky-color-background-container-base: var(--bb-color-gray-1000);
385
- --sky-color-background-container-danger: var(--bb-color-red-800);
386
- --sky-color-background-container-dimmed: var(--bb-color-gray-1000);
387
- --sky-color-background-container-info: var(--bb-color-blue-800);
388
- --sky-color-background-container-menu: var(--bb-color-gray-900);
389
- --sky-color-background-container-success: var(--bb-color-green-900);
390
- --sky-color-background-container-tooltip: var(--bb-color-gray-25);
391
- --sky-color-background-container-warning: var(--bb-color-yellow-800);
392
- --sky-color-background-disabled: var(--bb-color-gray-700);
393
- --sky-color-background-file_drop: var(--bb-color-gray-1000);
394
- --sky-color-background-icon_matte-action-heavy: var(--bb-color-blue-600);
395
- --sky-color-background-icon_matte-action-soft: var(--bb-color-blue-900);
396
- --sky-color-background-icon_matte-danger: var(--bb-color-red-600);
397
- --sky-color-background-icon_matte-info: var(--bb-color-blue-600);
398
- --sky-color-background-icon_matte-success: var(--bb-color-green-700);
399
- --sky-color-background-icon_matte-warning: var(--bb-color-yellow-600);
400
- --sky-color-background-input-base: var(--bb-color-gray-900);
401
- --sky-color-background-nav-active: var(--bb-color-transparent);
402
- --sky-color-background-nav-base: var(--bb-color-transparent);
403
- --sky-color-background-nav-focus: var(--bb-color-transparent);
404
- --sky-color-background-nav-hover: var(--bb-color-transparent);
405
- --sky-color-background-page: var(--bb-color-gray-1100);
406
- --sky-color-background-row-active: var(--bb-color-transparent);
407
- --sky-color-background-row-base: var(--bb-color-gray-1000);
408
- --sky-color-background-row-focus: var(--bb-color-gray-1000);
409
- --sky-color-background-row-hover: var(--bb-color-transparent);
410
- --sky-color-background-scrim: var(--bb-color-scrim);
411
- --sky-color-background-selected-danger: var(--bb-color-red-900);
412
- --sky-color-background-selected-heavy: var(--bb-color-blue-600);
413
- --sky-color-background-selected-soft: var(--bb-color-blue-900);
414
- --sky-color-background-selected-success: var(--bb-color-green-900);
415
- --sky-color-background-selected-switch-base: var(--bb-color-blue-600);
416
- --sky-color-background-selected-warning: var(--bb-color-yellow-900);
417
- --sky-color-background-tab-active: var(--bb-color-transparent);
418
- --sky-color-background-tab-base: var(--bb-color-transparent);
419
- --sky-color-background-tab-focus: var(--bb-color-transparent);
420
- --sky-color-background-tab-hover: var(--bb-color-transparent);
421
- --sky-color-background-tab-selected: var(--bb-color-transparent);
422
- --sky-color-background-tab-wizard-disabled: var(--bb-color-transparent);
423
- --sky-color-background-text_highlight: var(--bb-color-yellow-800);
424
- --sky-color-background-thumb-base: var(--bb-color-white);
425
- --sky-color-background-thumb-disabled: var(--bb-color-gray-600);
426
- --sky-color-background-thumbnail_matte: var(--bb-color-white);
427
- --sky-color-border-action-accent-active: var(--bb-color-sky-500);
428
- --sky-color-border-action-accent-base: var(--bb-color-gray-700);
429
- --sky-color-border-action-accent-focus: var(--bb-color-sky-600);
430
- --sky-color-border-action-accent-hover: var(--bb-color-sky-600);
431
- --sky-color-border-action-danger-active: var(--bb-color-red-200);
432
- --sky-color-border-action-danger-base: var(--bb-color-red-600);
433
- --sky-color-border-action-danger-focus: var(--bb-color-red-200);
434
- --sky-color-border-action-danger-hover: var(--bb-color-red-200);
435
- --sky-color-border-action-input-active: var(--bb-color-blue-600);
436
- --sky-color-border-action-input-base: var(--bb-color-blue-400);
437
- --sky-color-border-action-input-focus: var(--bb-color-blue-600);
438
- --sky-color-border-action-input-hover: var(--bb-color-blue-600);
439
- --sky-color-border-action-primary-active: var(--bb-color-sky-500);
440
- --sky-color-border-action-primary-base: var(--bb-color-sky-600);
441
- --sky-color-border-action-primary-focus: var(--bb-color-sky-600);
442
- --sky-color-border-action-primary-hover: var(--bb-color-sky-600);
443
- --sky-color-border-action-secondary-active: var(--bb-color-sky-500);
444
- --sky-color-border-action-secondary-base: var(--bb-color-gray-700);
445
- --sky-color-border-action-secondary-focus: var(--bb-color-sky-600);
446
- --sky-color-border-action-secondary-hover: var(--bb-color-sky-600);
447
- --sky-color-border-action-tertiary-active: var(--bb-color-sky-500);
448
- --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
449
- --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
450
- --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
451
- --sky-color-border-column_divider: var(--bb-color-blue-400);
452
- --sky-color-border-container-base: var(--bb-color-blue-900);
453
- --sky-color-border-danger: var(--bb-color-red-400);
454
- --sky-color-border-disabled: var(--bb-color-gray-800);
455
- --sky-color-border-divider: var(--bb-color-gray-800);
456
- --sky-color-border-elevation: var(--bb-color-gray-800);
457
- --sky-color-border-info: var(--bb-color-blue-400);
458
- --sky-color-border-input-active: var(--bb-color-blue-600);
459
- --sky-color-border-input-base: var(--bb-color-blue-200);
460
- --sky-color-border-input-error: var(--bb-color-red-600);
461
- --sky-color-border-input-focus: var(--bb-color-blue-600);
462
- --sky-color-border-input-hover: var(--bb-color-blue-600);
463
- --sky-color-border-nav-active: var(--bb-color-sky-500);
464
- --sky-color-border-nav-base: var(--bb-color-transparent);
465
- --sky-color-border-nav-focus: var(--bb-color-sky-600);
466
- --sky-color-border-nav-hover: var(--bb-color-sky-600);
467
- --sky-color-border-progress_step: var(--bb-color-gray-600);
468
- --sky-color-border-selected: var(--bb-color-blue-400);
469
- --sky-color-border-selected_soft: var(--bb-color-blue-500);
470
- --sky-color-border-separator-dark: var(--bb-color-gray-800);
471
- --sky-color-border-separator-light: var(--bb-color-gray-700);
472
- --sky-color-border-separator-row: var(--bb-color-gray-800);
473
- --sky-color-border-success: var(--bb-color-green-400);
474
- --sky-color-border-switch-active: var(--bb-color-blue-600);
475
- --sky-color-border-switch-base: var(--bb-color-blue-500);
476
- --sky-color-border-switch-error: var(--bb-color-red-600);
477
- --sky-color-border-switch-focus: var(--bb-color-blue-600);
478
- --sky-color-border-switch-hover: var(--bb-color-blue-600);
479
- --sky-color-border-switch-selected-active: var(--bb-color-blue-900);
480
- --sky-color-border-switch-selected-base: var(--bb-color-transparent);
481
- --sky-color-border-switch-selected-focus: var(--bb-color-blue-900);
482
- --sky-color-border-switch-selected-hover: var(--bb-color-blue-900);
483
- --sky-color-border-tab-active: var(--bb-color-sky-500);
484
- --sky-color-border-tab-base: var(--bb-color-transparent);
485
- --sky-color-border-tab-focus: var(--bb-color-sky-600);
486
- --sky-color-border-tab-hover: var(--bb-color-sky-600);
487
- --sky-color-border-tab-wizard-disabled: var(--bb-color-transparent);
488
- --sky-color-border-text_highlight: var(--bb-color-yellow-600);
489
- --sky-color-border-warning: var(--bb-color-yellow-400);
490
- --sky-color-category-blue: var(--bb-color-sky-900);
491
- --sky-color-category-green: var(--bb-color-green-900);
492
- --sky-color-category-orange: var(--bb-color-orange-900);
493
- --sky-color-category-purple: var(--bb-color-purple-900);
494
- --sky-color-category-red: var(--bb-color-red-900);
495
- --sky-color-category-teal: var(--bb-color-teal-900);
496
- --sky-color-category-yellow: var(--bb-color-yellow-900);
497
- --sky-color-classify-1-heavy: var(--bb-color-teal-400);
498
- --sky-color-classify-1-soft: var(--bb-color-teal-900);
499
- --sky-color-classify-2-heavy: var(--bb-color-purple-400);
500
- --sky-color-classify-2-soft: var(--bb-color-purple-900);
501
- --sky-color-classify-3-heavy: var(--bb-color-sky-400);
502
- --sky-color-classify-3-soft: var(--bb-color-sky-900);
503
- --sky-color-classify-4-heavy: var(--bb-color-orange-400);
504
- --sky-color-classify-4-soft: var(--bb-color-orange-900);
505
- --sky-color-classify-5-heavy: var(--bb-color-pink-400);
506
- --sky-color-classify-5-soft: var(--bb-color-pink-900);
507
- --sky-color-classify-6-heavy: var(--bb-color-green-400);
508
- --sky-color-classify-6-soft: var(--bb-color-green-900);
509
- --sky-color-classify-7-heavy: var(--bb-color-red-400);
510
- --sky-color-classify-7-soft: var(--bb-color-red-900);
511
- --sky-color-icon-action: var(--bb-color-sky-600);
512
- --sky-color-icon-danger: var(--bb-color-red-400);
513
- --sky-color-icon-deemphasized: var(--bb-color-gray-300);
514
- --sky-color-icon-default: var(--bb-color-gray-25);
515
- --sky-color-icon-eyebrow: var(--bb-color-brand-impact_green);
516
- --sky-color-icon-info: var(--bb-color-blue-600);
517
- --sky-color-icon-input-action: var(--bb-color-sky-600);
518
- --sky-color-icon-inverse: var(--bb-color-gray-1100);
519
- --sky-color-icon-selected: var(--bb-color-blue-600);
520
- --sky-color-icon-success: var(--bb-color-green-700);
521
- --sky-color-icon-warning: var(--bb-color-yellow-600);
522
- --sky-color-illustration-fill-heavy: var(--bb-color-green-700);
523
- --sky-color-illustration-fill-soft: var(--bb-color-green-900);
524
- --sky-color-illustration-fill-softest: var(--bb-color-gray-900);
525
- --sky-color-illustration-stroke: var(--bb-color-green-200);
526
- --sky-color-text-action: var(--bb-color-sky-600);
527
- --sky-color-text-action_contrast: var(--bb-color-blue-300);
528
- --sky-color-text-danger: var(--bb-color-red-400);
529
- --sky-color-text-deemphasized: var(--bb-color-gray-300);
530
- --sky-color-text-default: var(--bb-color-gray-25);
531
- --sky-color-text-heading: var(--bb-color-gray-50);
532
- --sky-color-text-inverse: var(--bb-color-gray-1100);
533
- --sky-color-text-selected: var(--bb-color-blue-400);
534
- --sky-color-viz-axis: var(--bb-color-gray-600);
535
- --sky-color-viz-category-1: var(--bb-color-teal-600);
536
- --sky-color-viz-category-2: var(--bb-color-purple-300);
537
- --sky-color-viz-category-3: var(--bb-color-blue-600);
538
- --sky-color-viz-category-4: var(--bb-color-sky-200);
539
- --sky-color-viz-category-5: var(--bb-color-orange-500);
540
- --sky-color-viz-category-6: var(--bb-color-red-300);
541
- --sky-color-viz-category-7: var(--bb-color-pink-500);
542
- --sky-color-viz-category-8: var(--bb-color-green-400);
543
- --sky-color-viz-diverge-neg-1: var(--bb-color-red-1000);
544
- --sky-color-viz-diverge-neg-10: var(--bb-color-red-100);
545
- --sky-color-viz-diverge-neg-2: var(--bb-color-red-900);
546
- --sky-color-viz-diverge-neg-3: var(--bb-color-red-800);
547
- --sky-color-viz-diverge-neg-4: var(--bb-color-red-700);
548
- --sky-color-viz-diverge-neg-5: var(--bb-color-red-600);
549
- --sky-color-viz-diverge-neg-6: var(--bb-color-red-500);
550
- --sky-color-viz-diverge-neg-7: var(--bb-color-red-400);
551
- --sky-color-viz-diverge-neg-8: var(--bb-color-red-300);
552
- --sky-color-viz-diverge-neg-9: var(--bb-color-red-200);
553
- --sky-color-viz-diverge-pos-1: var(--bb-color-blue-1000);
554
- --sky-color-viz-diverge-pos-10: var(--bb-color-blue-100);
555
- --sky-color-viz-diverge-pos-2: var(--bb-color-blue-900);
556
- --sky-color-viz-diverge-pos-3: var(--bb-color-blue-800);
557
- --sky-color-viz-diverge-pos-4: var(--bb-color-blue-700);
558
- --sky-color-viz-diverge-pos-5: var(--bb-color-blue-600);
559
- --sky-color-viz-diverge-pos-6: var(--bb-color-blue-500);
560
- --sky-color-viz-diverge-pos-7: var(--bb-color-blue-400);
561
- --sky-color-viz-diverge-pos-8: var(--bb-color-blue-300);
562
- --sky-color-viz-diverge-pos-9: var(--bb-color-blue-200);
563
- --sky-color-viz-gridline: var(--bb-color-gray-850);
564
- --sky-color-viz-marker: var(--bb-color-gray-200);
565
- --sky-color-viz-sequence-1: var(--bb-color-teal-1000);
566
- --sky-color-viz-sequence-10: var(--bb-color-teal-100);
567
- --sky-color-viz-sequence-2: var(--bb-color-teal-900);
568
- --sky-color-viz-sequence-3: var(--bb-color-teal-800);
569
- --sky-color-viz-sequence-4: var(--bb-color-teal-700);
570
- --sky-color-viz-sequence-5: var(--bb-color-teal-600);
571
- --sky-color-viz-sequence-6: var(--bb-color-teal-500);
572
- --sky-color-viz-sequence-7: var(--bb-color-teal-400);
573
- --sky-color-viz-sequence-8: var(--bb-color-teal-300);
574
- --sky-color-viz-sequence-9: var(--bb-color-teal-200);
575
- --sky-elevation-none: var(--bb-shadow-gray-0);
576
- --sky-image-select_icon-base: var(--bb-image-select_icon-base-dark-src);
577
- --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-dark-src);
578
- --sky-opacity-wait: var(--bb-opacity-600);
579
- --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
580
- --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
581
- --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
582
- --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
583
- --sky-color-background-action-secondary-disabled: var(--sky-color-background-disabled);
584
- --sky-color-background-action-tertiary-disabled: var(--sky-color-background-disabled);
585
- --sky-color-background-input-disabled: var(--sky-color-background-disabled);
586
- --sky-color-background-nav-disabled: var(--sky-color-background-disabled);
587
- --sky-color-background-row-disabled: var(--sky-color-background-disabled);
588
- --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
589
- --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
590
- --sky-color-border-action-accent-disabled: var(--sky-color-background-disabled);
591
- --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
592
- --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
593
- --sky-color-border-action-primary-disabled: var(--sky-color-border-disabled);
594
- --sky-color-border-action-secondary-disabled: var(--sky-color-border-disabled);
595
- --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
596
- --sky-color-border-input-disabled: var(--sky-color-border-disabled);
597
- --sky-color-border-nav-disabled: var(--sky-color-border-disabled);
598
- --sky-color-border-switch-disabled: var(--sky-color-border-disabled);
599
- --sky-color-border-switch-selected-disabled: var(--sky-color-border-disabled);
600
- --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
601
- --sky-elevation-focus: var(--bb-shadow-gray-200);
602
- --sky-elevation-overflow: var(--bb-shadow-gray-200);
603
- --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
604
- --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
605
- --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
606
- --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
607
- --sky-elevation-overlay-simple-100: var(--bb-shadow-gray-simple-400);
608
- --sky-elevation-raised-100: var(--bb-shadow-gray-100);
609
- }
610
360
  .sky-theme-modern.sky-theme-brand-base {
611
361
  --sky-brand-name: var(--bb-brand-name);
612
362
  --sky-color-background-action-accent-active: var(--bb-color-blue-100);
@@ -893,9 +643,264 @@
893
643
  --sky-elevation-overlay-simple-100: var(--bb-shadow-gray-simple-400);
894
644
  --sky-elevation-raised-100: var(--bb-shadow-gray-100);
895
645
  }
646
+ .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
647
+ --sky-color-background-action-accent-active: var(--bb-color-gray-600);
648
+ --sky-color-background-action-accent-base: var(--bb-color-blue-900);
649
+ --sky-color-background-action-accent-focus: var(--bb-color-gray-700);
650
+ --sky-color-background-action-accent-hover: var(--bb-color-gray-700);
651
+ --sky-color-background-action-danger-active: var(--bb-color-red-600);
652
+ --sky-color-background-action-danger-base: var(--bb-color-red-600);
653
+ --sky-color-background-action-danger-focus: var(--bb-color-red-600);
654
+ --sky-color-background-action-danger-hover: var(--bb-color-red-600);
655
+ --sky-color-background-action-input-active: var(--bb-color-transparent);
656
+ --sky-color-background-action-input-base: var(--bb-color-blue-900);
657
+ --sky-color-background-action-input-focus: var(--bb-color-blue-900);
658
+ --sky-color-background-action-input-hover: var(--bb-color-transparent);
659
+ --sky-color-background-action-primary-active: var(--bb-color-sky-500);
660
+ --sky-color-background-action-primary-base: var(--bb-color-sky-600);
661
+ --sky-color-background-action-primary-focus: var(--bb-color-sky-600);
662
+ --sky-color-background-action-primary-hover: var(--bb-color-sky-600);
663
+ --sky-color-background-action-secondary-active: var(--bb-color-gray-600);
664
+ --sky-color-background-action-secondary-base: var(--bb-color-gray-800);
665
+ --sky-color-background-action-secondary-focus: var(--bb-color-gray-700);
666
+ --sky-color-background-action-secondary-hover: var(--bb-color-gray-700);
667
+ --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
668
+ --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
669
+ --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
670
+ --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
671
+ --sky-color-background-blocking: var(--bb-color-rgba-black-70);
672
+ --sky-color-background-container-backdrop: var(--bb-color-gray-900);
673
+ --sky-color-background-container-base: var(--bb-color-gray-1000);
674
+ --sky-color-background-container-danger: var(--bb-color-red-800);
675
+ --sky-color-background-container-dimmed: var(--bb-color-gray-1000);
676
+ --sky-color-background-container-info: var(--bb-color-blue-800);
677
+ --sky-color-background-container-menu: var(--bb-color-gray-900);
678
+ --sky-color-background-container-success: var(--bb-color-green-900);
679
+ --sky-color-background-container-tooltip: var(--bb-color-gray-25);
680
+ --sky-color-background-container-warning: var(--bb-color-yellow-800);
681
+ --sky-color-background-disabled: var(--bb-color-gray-700);
682
+ --sky-color-background-file_drop: var(--bb-color-gray-1000);
683
+ --sky-color-background-icon_matte-action-heavy: var(--bb-color-blue-600);
684
+ --sky-color-background-icon_matte-action-soft: var(--bb-color-blue-900);
685
+ --sky-color-background-icon_matte-danger: var(--bb-color-red-600);
686
+ --sky-color-background-icon_matte-info: var(--bb-color-blue-600);
687
+ --sky-color-background-icon_matte-success: var(--bb-color-green-700);
688
+ --sky-color-background-icon_matte-warning: var(--bb-color-yellow-600);
689
+ --sky-color-background-input-base: var(--bb-color-gray-900);
690
+ --sky-color-background-nav-active: var(--bb-color-transparent);
691
+ --sky-color-background-nav-base: var(--bb-color-transparent);
692
+ --sky-color-background-nav-focus: var(--bb-color-transparent);
693
+ --sky-color-background-nav-hover: var(--bb-color-transparent);
694
+ --sky-color-background-page: var(--bb-color-gray-1100);
695
+ --sky-color-background-row-active: var(--bb-color-transparent);
696
+ --sky-color-background-row-base: var(--bb-color-gray-1000);
697
+ --sky-color-background-row-focus: var(--bb-color-gray-1000);
698
+ --sky-color-background-row-hover: var(--bb-color-transparent);
699
+ --sky-color-background-scrim: var(--bb-color-scrim);
700
+ --sky-color-background-selected-danger: var(--bb-color-red-900);
701
+ --sky-color-background-selected-heavy: var(--bb-color-blue-600);
702
+ --sky-color-background-selected-soft: var(--bb-color-blue-900);
703
+ --sky-color-background-selected-success: var(--bb-color-green-900);
704
+ --sky-color-background-selected-switch-base: var(--bb-color-blue-600);
705
+ --sky-color-background-selected-warning: var(--bb-color-yellow-900);
706
+ --sky-color-background-tab-active: var(--bb-color-transparent);
707
+ --sky-color-background-tab-base: var(--bb-color-transparent);
708
+ --sky-color-background-tab-focus: var(--bb-color-transparent);
709
+ --sky-color-background-tab-hover: var(--bb-color-transparent);
710
+ --sky-color-background-tab-selected: var(--bb-color-transparent);
711
+ --sky-color-background-tab-wizard-disabled: var(--bb-color-transparent);
712
+ --sky-color-background-text_highlight: var(--bb-color-yellow-800);
713
+ --sky-color-background-thumb-base: var(--bb-color-white);
714
+ --sky-color-background-thumb-disabled: var(--bb-color-gray-600);
715
+ --sky-color-background-thumbnail_matte: var(--bb-color-white);
716
+ --sky-color-border-action-accent-active: var(--bb-color-sky-500);
717
+ --sky-color-border-action-accent-base: var(--bb-color-gray-700);
718
+ --sky-color-border-action-accent-focus: var(--bb-color-sky-600);
719
+ --sky-color-border-action-accent-hover: var(--bb-color-sky-600);
720
+ --sky-color-border-action-danger-active: var(--bb-color-red-200);
721
+ --sky-color-border-action-danger-base: var(--bb-color-red-600);
722
+ --sky-color-border-action-danger-focus: var(--bb-color-red-200);
723
+ --sky-color-border-action-danger-hover: var(--bb-color-red-200);
724
+ --sky-color-border-action-input-active: var(--bb-color-blue-600);
725
+ --sky-color-border-action-input-base: var(--bb-color-blue-400);
726
+ --sky-color-border-action-input-focus: var(--bb-color-blue-600);
727
+ --sky-color-border-action-input-hover: var(--bb-color-blue-600);
728
+ --sky-color-border-action-primary-active: var(--bb-color-sky-500);
729
+ --sky-color-border-action-primary-base: var(--bb-color-sky-600);
730
+ --sky-color-border-action-primary-focus: var(--bb-color-sky-600);
731
+ --sky-color-border-action-primary-hover: var(--bb-color-sky-600);
732
+ --sky-color-border-action-secondary-active: var(--bb-color-sky-500);
733
+ --sky-color-border-action-secondary-base: var(--bb-color-gray-700);
734
+ --sky-color-border-action-secondary-focus: var(--bb-color-sky-600);
735
+ --sky-color-border-action-secondary-hover: var(--bb-color-sky-600);
736
+ --sky-color-border-action-tertiary-active: var(--bb-color-sky-500);
737
+ --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
738
+ --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
739
+ --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
740
+ --sky-color-border-column_divider: var(--bb-color-blue-400);
741
+ --sky-color-border-container-base: var(--bb-color-blue-900);
742
+ --sky-color-border-danger: var(--bb-color-red-400);
743
+ --sky-color-border-disabled: var(--bb-color-gray-800);
744
+ --sky-color-border-divider: var(--bb-color-gray-800);
745
+ --sky-color-border-elevation: var(--bb-color-gray-800);
746
+ --sky-color-border-info: var(--bb-color-blue-400);
747
+ --sky-color-border-input-active: var(--bb-color-blue-600);
748
+ --sky-color-border-input-base: var(--bb-color-blue-200);
749
+ --sky-color-border-input-error: var(--bb-color-red-600);
750
+ --sky-color-border-input-focus: var(--bb-color-blue-600);
751
+ --sky-color-border-input-hover: var(--bb-color-blue-600);
752
+ --sky-color-border-nav-active: var(--bb-color-sky-500);
753
+ --sky-color-border-nav-base: var(--bb-color-transparent);
754
+ --sky-color-border-nav-focus: var(--bb-color-sky-600);
755
+ --sky-color-border-nav-hover: var(--bb-color-sky-600);
756
+ --sky-color-border-progress_step: var(--bb-color-gray-600);
757
+ --sky-color-border-selected: var(--bb-color-blue-400);
758
+ --sky-color-border-selected_soft: var(--bb-color-blue-500);
759
+ --sky-color-border-separator-dark: var(--bb-color-gray-800);
760
+ --sky-color-border-separator-light: var(--bb-color-gray-700);
761
+ --sky-color-border-separator-row: var(--bb-color-gray-800);
762
+ --sky-color-border-success: var(--bb-color-green-400);
763
+ --sky-color-border-switch-active: var(--bb-color-blue-600);
764
+ --sky-color-border-switch-base: var(--bb-color-blue-500);
765
+ --sky-color-border-switch-error: var(--bb-color-red-600);
766
+ --sky-color-border-switch-focus: var(--bb-color-blue-600);
767
+ --sky-color-border-switch-hover: var(--bb-color-blue-600);
768
+ --sky-color-border-switch-selected-active: var(--bb-color-blue-900);
769
+ --sky-color-border-switch-selected-base: var(--bb-color-transparent);
770
+ --sky-color-border-switch-selected-focus: var(--bb-color-blue-900);
771
+ --sky-color-border-switch-selected-hover: var(--bb-color-blue-900);
772
+ --sky-color-border-tab-active: var(--bb-color-sky-500);
773
+ --sky-color-border-tab-base: var(--bb-color-transparent);
774
+ --sky-color-border-tab-focus: var(--bb-color-sky-600);
775
+ --sky-color-border-tab-hover: var(--bb-color-sky-600);
776
+ --sky-color-border-tab-wizard-disabled: var(--bb-color-transparent);
777
+ --sky-color-border-text_highlight: var(--bb-color-yellow-600);
778
+ --sky-color-border-warning: var(--bb-color-yellow-400);
779
+ --sky-color-category-blue: var(--bb-color-sky-900);
780
+ --sky-color-category-green: var(--bb-color-green-900);
781
+ --sky-color-category-orange: var(--bb-color-orange-900);
782
+ --sky-color-category-purple: var(--bb-color-purple-900);
783
+ --sky-color-category-red: var(--bb-color-red-900);
784
+ --sky-color-category-teal: var(--bb-color-teal-900);
785
+ --sky-color-category-yellow: var(--bb-color-yellow-900);
786
+ --sky-color-classify-1-heavy: var(--bb-color-teal-400);
787
+ --sky-color-classify-1-soft: var(--bb-color-teal-900);
788
+ --sky-color-classify-2-heavy: var(--bb-color-purple-400);
789
+ --sky-color-classify-2-soft: var(--bb-color-purple-900);
790
+ --sky-color-classify-3-heavy: var(--bb-color-sky-400);
791
+ --sky-color-classify-3-soft: var(--bb-color-sky-900);
792
+ --sky-color-classify-4-heavy: var(--bb-color-orange-400);
793
+ --sky-color-classify-4-soft: var(--bb-color-orange-900);
794
+ --sky-color-classify-5-heavy: var(--bb-color-pink-400);
795
+ --sky-color-classify-5-soft: var(--bb-color-pink-900);
796
+ --sky-color-classify-6-heavy: var(--bb-color-green-400);
797
+ --sky-color-classify-6-soft: var(--bb-color-green-900);
798
+ --sky-color-classify-7-heavy: var(--bb-color-red-400);
799
+ --sky-color-classify-7-soft: var(--bb-color-red-900);
800
+ --sky-color-icon-action: var(--bb-color-sky-600);
801
+ --sky-color-icon-danger: var(--bb-color-red-400);
802
+ --sky-color-icon-deemphasized: var(--bb-color-gray-300);
803
+ --sky-color-icon-default: var(--bb-color-gray-25);
804
+ --sky-color-icon-eyebrow: var(--bb-color-brand-impact_green);
805
+ --sky-color-icon-info: var(--bb-color-blue-600);
806
+ --sky-color-icon-input-action: var(--bb-color-sky-600);
807
+ --sky-color-icon-inverse: var(--bb-color-gray-1100);
808
+ --sky-color-icon-selected: var(--bb-color-blue-600);
809
+ --sky-color-icon-success: var(--bb-color-green-700);
810
+ --sky-color-icon-warning: var(--bb-color-yellow-600);
811
+ --sky-color-illustration-fill-heavy: var(--bb-color-green-700);
812
+ --sky-color-illustration-fill-soft: var(--bb-color-green-900);
813
+ --sky-color-illustration-fill-softest: var(--bb-color-gray-900);
814
+ --sky-color-illustration-stroke: var(--bb-color-green-200);
815
+ --sky-color-text-action: var(--bb-color-sky-600);
816
+ --sky-color-text-action_contrast: var(--bb-color-blue-300);
817
+ --sky-color-text-danger: var(--bb-color-red-400);
818
+ --sky-color-text-deemphasized: var(--bb-color-gray-300);
819
+ --sky-color-text-default: var(--bb-color-gray-25);
820
+ --sky-color-text-heading: var(--bb-color-gray-50);
821
+ --sky-color-text-inverse: var(--bb-color-gray-1100);
822
+ --sky-color-text-selected: var(--bb-color-blue-400);
823
+ --sky-color-viz-axis: var(--bb-color-gray-600);
824
+ --sky-color-viz-category-1: var(--bb-color-teal-600);
825
+ --sky-color-viz-category-2: var(--bb-color-purple-300);
826
+ --sky-color-viz-category-3: var(--bb-color-blue-600);
827
+ --sky-color-viz-category-4: var(--bb-color-sky-200);
828
+ --sky-color-viz-category-5: var(--bb-color-orange-500);
829
+ --sky-color-viz-category-6: var(--bb-color-red-300);
830
+ --sky-color-viz-category-7: var(--bb-color-pink-500);
831
+ --sky-color-viz-category-8: var(--bb-color-green-400);
832
+ --sky-color-viz-diverge-neg-1: var(--bb-color-red-1000);
833
+ --sky-color-viz-diverge-neg-10: var(--bb-color-red-100);
834
+ --sky-color-viz-diverge-neg-2: var(--bb-color-red-900);
835
+ --sky-color-viz-diverge-neg-3: var(--bb-color-red-800);
836
+ --sky-color-viz-diverge-neg-4: var(--bb-color-red-700);
837
+ --sky-color-viz-diverge-neg-5: var(--bb-color-red-600);
838
+ --sky-color-viz-diverge-neg-6: var(--bb-color-red-500);
839
+ --sky-color-viz-diverge-neg-7: var(--bb-color-red-400);
840
+ --sky-color-viz-diverge-neg-8: var(--bb-color-red-300);
841
+ --sky-color-viz-diverge-neg-9: var(--bb-color-red-200);
842
+ --sky-color-viz-diverge-pos-1: var(--bb-color-blue-1000);
843
+ --sky-color-viz-diverge-pos-10: var(--bb-color-blue-100);
844
+ --sky-color-viz-diverge-pos-2: var(--bb-color-blue-900);
845
+ --sky-color-viz-diverge-pos-3: var(--bb-color-blue-800);
846
+ --sky-color-viz-diverge-pos-4: var(--bb-color-blue-700);
847
+ --sky-color-viz-diverge-pos-5: var(--bb-color-blue-600);
848
+ --sky-color-viz-diverge-pos-6: var(--bb-color-blue-500);
849
+ --sky-color-viz-diverge-pos-7: var(--bb-color-blue-400);
850
+ --sky-color-viz-diverge-pos-8: var(--bb-color-blue-300);
851
+ --sky-color-viz-diverge-pos-9: var(--bb-color-blue-200);
852
+ --sky-color-viz-gridline: var(--bb-color-gray-850);
853
+ --sky-color-viz-marker: var(--bb-color-gray-200);
854
+ --sky-color-viz-sequence-1: var(--bb-color-teal-1000);
855
+ --sky-color-viz-sequence-10: var(--bb-color-teal-100);
856
+ --sky-color-viz-sequence-2: var(--bb-color-teal-900);
857
+ --sky-color-viz-sequence-3: var(--bb-color-teal-800);
858
+ --sky-color-viz-sequence-4: var(--bb-color-teal-700);
859
+ --sky-color-viz-sequence-5: var(--bb-color-teal-600);
860
+ --sky-color-viz-sequence-6: var(--bb-color-teal-500);
861
+ --sky-color-viz-sequence-7: var(--bb-color-teal-400);
862
+ --sky-color-viz-sequence-8: var(--bb-color-teal-300);
863
+ --sky-color-viz-sequence-9: var(--bb-color-teal-200);
864
+ --sky-elevation-none: var(--bb-shadow-gray-0);
865
+ --sky-image-select_icon-base: var(--bb-image-select_icon-base-dark-src);
866
+ --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-dark-src);
867
+ --sky-opacity-wait: var(--bb-opacity-600);
868
+ --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
869
+ --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
870
+ --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
871
+ --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
872
+ --sky-color-background-action-secondary-disabled: var(--sky-color-background-disabled);
873
+ --sky-color-background-action-tertiary-disabled: var(--sky-color-background-disabled);
874
+ --sky-color-background-input-disabled: var(--sky-color-background-disabled);
875
+ --sky-color-background-nav-disabled: var(--sky-color-background-disabled);
876
+ --sky-color-background-row-disabled: var(--sky-color-background-disabled);
877
+ --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
878
+ --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
879
+ --sky-color-border-action-accent-disabled: var(--sky-color-background-disabled);
880
+ --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
881
+ --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
882
+ --sky-color-border-action-primary-disabled: var(--sky-color-border-disabled);
883
+ --sky-color-border-action-secondary-disabled: var(--sky-color-border-disabled);
884
+ --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
885
+ --sky-color-border-input-disabled: var(--sky-color-border-disabled);
886
+ --sky-color-border-nav-disabled: var(--sky-color-border-disabled);
887
+ --sky-color-border-switch-disabled: var(--sky-color-border-disabled);
888
+ --sky-color-border-switch-selected-disabled: var(--sky-color-border-disabled);
889
+ --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
890
+ --sky-elevation-focus: var(--bb-shadow-gray-200);
891
+ --sky-elevation-overflow: var(--bb-shadow-gray-200);
892
+ --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
893
+ --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
894
+ --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
895
+ --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
896
+ --sky-elevation-overlay-simple-100: var(--bb-shadow-gray-simple-400);
897
+ --sky-elevation-raised-100: var(--bb-shadow-gray-100);
898
+ }
896
899
  .sky-theme-modern.sky-theme-brand-base {
897
900
  --sky-font-style-deemphasized-style: italic;
898
901
  --sky-font-style-deemphasized-weight: 400;
902
+ --sky-font-style-em-style: italic;
903
+ --sky-font-style-em-weight: 400;
899
904
  --sky-font-style-hint-m-style: italic;
900
905
  --sky-font-style-hint-m-weight: 400;
901
906
  --sky-font-style-hint-s-style: italic;
@@ -1441,6 +1446,8 @@
1441
1446
  --sky-font-line_height-hint-s: var(--bb-line_height-300);
1442
1447
  --sky-font-line_height-input-label: var(--bb-line_height-300);
1443
1448
  --sky-font-line_height-input-val: var(--bb-line_height-400);
1449
+ --sky-font-line_height-paragraph-l: var(--bb-line_height-550);
1450
+ --sky-font-line_height-paragraph-m: var(--bb-line_height-450);
1444
1451
  --sky-font-size-body-l: var(--bb-font-size-500);
1445
1452
  --sky-font-size-body-m: var(--bb-font-size-400);
1446
1453
  --sky-font-size-body-s: var(--bb-font-size-300);
@@ -1475,6 +1482,7 @@
1475
1482
  --sky-font-style-heading-4: var(--bb-font-style-semibold);
1476
1483
  --sky-font-style-heading-5: var(--bb-font-style-semibold);
1477
1484
  --sky-font-style-input-label: var(--bb-font-style-regular);
1485
+ --sky-font-style-strong: var(--bb-font-style-bold);
1478
1486
  --sky-font-text_transform-eyebrow: var(--bb-font-text_transform-uppercase);
1479
1487
  --sky-size-avatar-l: var(--bb-size-fluid-550);
1480
1488
  --sky-size-avatar-m: var(--bb-size-fluid-350);