@blackbaud/skyux-design-tokens 6.6.0 → 6.8.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.
Files changed (12) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/assets/assets.json +1 -1
  3. package/assets/scss/base.css +26 -20
  4. package/assets/scss/blackbaud.css +23 -20
  5. package/bundles/base.css +26 -20
  6. package/bundles/base_blackbaud_public-api.css +3777 -0
  7. package/bundles/base_public-api.css +2943 -0
  8. package/bundles/blackbaud.css +23 -20
  9. package/bundles/public-api-styles.json +41 -6
  10. package/bundles/public-api-tokens.json +33 -7
  11. package/bundles/public-api.css +15 -0
  12. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # Changelog
2
2
 
3
+ ## [6.8.0](https://github.com/blackbaud/skyux-design-tokens/compare/6.7.0...6.8.0) (2026-08-27)
4
+
5
+
6
+ ### Features
7
+
8
+ * add on_status colors ([#414](https://github.com/blackbaud/skyux-design-tokens/issues/414)) ([f5b9b78](https://github.com/blackbaud/skyux-design-tokens/commit/f5b9b780daccdccf437cf1cf0e1367d0af618554))
9
+ * add prominent container background ([#431](https://github.com/blackbaud/skyux-design-tokens/issues/431)) ([609bce6](https://github.com/blackbaud/skyux-design-tokens/commit/609bce6dabbb08aacbc67cabda8381530574453e))
10
+
11
+
12
+ ### Bug Fixes
13
+
14
+ * remove light mode selector from light mode styles ([#436](https://github.com/blackbaud/skyux-design-tokens/issues/436)) ([6f22bce](https://github.com/blackbaud/skyux-design-tokens/commit/6f22bce654fb554c2e65bc12071219e6bff1854d))
15
+ * revert light-mode shadow-slate color shift from steel-gray merge ([#438](https://github.com/blackbaud/skyux-design-tokens/issues/438)) ([0467bb8](https://github.com/blackbaud/skyux-design-tokens/commit/0467bb83a1284eefd4bebeb138aa4c8f41f73c71))
16
+
17
+ ## [6.7.0](https://github.com/blackbaud/skyux-design-tokens/compare/6.6.0...6.7.0) (2026-08-26)
18
+
19
+
20
+ ### Features
21
+
22
+ * generate base/brand/public API combo CSS ([#428](https://github.com/blackbaud/skyux-design-tokens/issues/428)) ([dbfb37e](https://github.com/blackbaud/skyux-design-tokens/commit/dbfb37e27a79f7cb5b386a9c7b921a641d85d578))
23
+
3
24
  ## [6.6.0](https://github.com/blackbaud/skyux-design-tokens/compare/6.5.1...6.6.0) (2026-08-26)
4
25
 
5
26
 
package/assets/assets.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "fonts": [],
3
3
  "images": {
4
4
  "favicon": {
5
- "src": "https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/favicon.ico"
5
+ "src": "https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/favicon.ico"
6
6
  }
7
7
  },
8
8
  "strings": {
package/assets/scss/base.css CHANGED
@@ -402,15 +402,15 @@
402
402
  --bb-font-weight-light: 300;
403
403
  --bb-font-weight-regular: 400;
404
404
  --bb-font-weight-semibold: 600;
405
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/bb-logo.png');
406
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
407
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-base-light.svg');
408
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
409
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
410
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
411
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
412
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
413
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
405
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/bb-logo.png');
406
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
407
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-light.svg');
408
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
409
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
410
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
411
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
412
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
413
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
414
414
  --bb-letter_spacing-normal: normal;
415
415
  --bb-letter_spacing-wider: 0.01rem;
416
416
  --bb-letter_spacing-widest: 0.046875rem;
@@ -500,15 +500,15 @@
500
500
  --bb-shadow-heavy-black-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
501
501
  --bb-shadow-heavy-black-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
502
502
  --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
503
- --bb-shadow-slate-100: 0 1px 3px 0 rgba(12, 16, 22, 0.2), 0 2px 1px -1px rgba(12, 16, 22, 0.12), 0 1px 1px 0 rgba(12, 16, 22, 0.14);
504
- --bb-shadow-slate-1600: 0 8px 10px -5px rgba(12, 16, 22, 0.2), 0 6px 30px 5px rgba(12, 16, 22, 0.12), 0 16px 24px 2px rgba(12, 16, 22, 0.14);
505
- --bb-shadow-slate-200: 0 1px 8px 0 rgba(12, 16, 22, 0.2), 0 3px 3px -2px rgba(12, 16, 22, 0.12), 0 3px 4px 0 rgba(12, 16, 22, 0.14);
506
- --bb-shadow-slate-2400: 0 11px 15px -7px rgba(12, 16, 22, 0.2), 0 9px 46px 8px rgba(12, 16, 22, 0.12), 0 24px 38px 3px rgba(12, 16, 22, 0.14);
507
- --bb-shadow-slate-25: 0 1px 1px 0 rgba(12, 16, 22, 0.05);
508
- --bb-shadow-slate-400: 0 2px 4px -1px rgba(12, 16, 22, 0.2), 0 1px 10px 0 rgba(12, 16, 22, 0.12), 0 4px 5px 0 rgba(12, 16, 22, 0.14);
509
- --bb-shadow-slate-50: 0 1px 1px 0 rgba(12, 16, 22, 0.05), 0 1.5px 1px -1px rgba(12, 16, 22, 0.12);
510
- --bb-shadow-slate-800: 0 5px 5px -3px rgba(12, 16, 22, 0.2), 0 3px 14px 2px rgba(12, 16, 22, 0.12), 0 8px 10px 1px rgba(12, 16, 22, 0.14);
511
- --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(12, 16, 22, 0.5);
503
+ --bb-shadow-slate-100: 0 1px 3px 0 rgba(33, 44, 63, 0.2), 0 2px 1px -1px rgba(33, 44, 63, 0.12), 0 1px 1px 0 rgba(33, 44, 63, 0.14);
504
+ --bb-shadow-slate-1600: 0 8px 10px -5px rgba(33, 44, 63, 0.2), 0 6px 30px 5px rgba(33, 44, 63, 0.12), 0 16px 24px 2px rgba(33, 44, 63, 0.14);
505
+ --bb-shadow-slate-200: 0 1px 8px 0 rgba(33, 44, 63, 0.2), 0 3px 3px -2px rgba(33, 44, 63, 0.12), 0 3px 4px 0 rgba(33, 44, 63, 0.14);
506
+ --bb-shadow-slate-2400: 0 11px 15px -7px rgba(33, 44, 63, 0.2), 0 9px 46px 8px rgba(33, 44, 63, 0.12), 0 24px 38px 3px rgba(33, 44, 63, 0.14);
507
+ --bb-shadow-slate-25: 0 1px 1px 0 rgba(33, 44, 63, 0.05);
508
+ --bb-shadow-slate-400: 0 2px 4px -1px rgba(33, 44, 63, 0.2), 0 1px 10px 0 rgba(33, 44, 63, 0.12), 0 4px 5px 0 rgba(33, 44, 63, 0.14);
509
+ --bb-shadow-slate-50: 0 1px 1px 0 rgba(33, 44, 63, 0.12), 0 1.5px 1px -1px rgba(33, 44, 63, 0.12);
510
+ --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);
511
+ --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
512
512
  --bb-shadow-steel-fusion-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
513
513
  --bb-shadow-steel-fusion-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
514
514
  --bb-shadow-steel-fusion-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
@@ -537,7 +537,7 @@
537
537
  --bb-color-scrollbar-bb-dark-thumb: #51555c;
538
538
  --bb-color-scrollbar-bb-dark-track: #1c2228;
539
539
  }
540
- .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-light {
540
+ .sky-theme-modern.sky-theme-brand-base:not(.sky-theme-mode-dark) {
541
541
  --sky-brand-name: var(--bb-brand-name);
542
542
  --sky-color-background-action-accent-active: var(--bb-color-blue-100);
543
543
  --sky-color-background-action-accent-base: var(--bb-color-white);
@@ -576,6 +576,7 @@
576
576
  --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
577
577
  --sky-color-background-container-info: var(--bb-color-blue-200);
578
578
  --sky-color-background-container-menu: var(--bb-color-white);
579
+ --sky-color-background-container-prominent: var(--bb-color-slate-50);
579
580
  --sky-color-background-container-success: var(--bb-color-green-200);
580
581
  --sky-color-background-container-tooltip: var(--bb-color-gray-1000);
581
582
  --sky-color-background-container-warning: var(--bb-color-yellow-200);
@@ -713,6 +714,7 @@
713
714
  --sky-color-icon-inverse: var(--bb-color-white);
714
715
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
715
716
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
717
+ --sky-color-icon-on_status: var(--bb-color-white);
716
718
  --sky-color-icon-selected: var(--bb-color-blue-600);
717
719
  --sky-color-icon-success: var(--bb-color-green-600);
718
720
  --sky-color-icon-warning: var(--bb-color-yellow-400);
@@ -728,6 +730,7 @@
728
730
  --sky-color-text-heading: var(--bb-color-gray-1100);
729
731
  --sky-color-text-inverse: var(--bb-color-white);
730
732
  --sky-color-text-on_prominent: var(--bb-color-white);
733
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
731
734
  --sky-color-text-selected: var(--bb-color-blue-600);
732
735
  --sky-color-viz-axis: var(--bb-color-gray-500);
733
736
  --sky-color-viz-category-1: var(--bb-color-teal-500);
@@ -838,7 +841,7 @@
838
841
  --sky-elevation-overlay-simple-100: var(--bb-shadow-gray-simple-400);
839
842
  --sky-elevation-raised-100: var(--bb-shadow-gray-100);
840
843
  }
841
- :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-mode-light) {
844
+ :root:has(body.sky-theme-modern.sky-theme-brand-base:not(.sky-theme-mode-dark)) {
842
845
  --sky-color-scrollbar-thumb: var(--bb-color-scrollbar-base-light-thumb);
843
846
  --sky-color-scrollbar-track: var(--bb-color-scrollbar-base-light-track);
844
847
  }
@@ -880,6 +883,7 @@
880
883
  --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
881
884
  --sky-color-background-container-info: var(--bb-color-blue-800);
882
885
  --sky-color-background-container-menu: var(--bb-color-gray-900);
886
+ --sky-color-background-container-prominent: var(--bb-color-steel-gray-1125);
883
887
  --sky-color-background-container-success: var(--bb-color-green-900);
884
888
  --sky-color-background-container-tooltip: var(--bb-color-gray-25);
885
889
  --sky-color-background-container-warning: var(--bb-color-yellow-800);
@@ -1016,6 +1020,7 @@
1016
1020
  --sky-color-icon-inverse: var(--bb-color-gray-1100);
1017
1021
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
1018
1022
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
1023
+ --sky-color-icon-on_status: var(--bb-color-white);
1019
1024
  --sky-color-icon-selected: var(--bb-color-blue-600);
1020
1025
  --sky-color-icon-success: var(--bb-color-green-700);
1021
1026
  --sky-color-icon-warning: var(--bb-color-yellow-600);
@@ -1031,6 +1036,7 @@
1031
1036
  --sky-color-text-heading: var(--bb-color-gray-50);
1032
1037
  --sky-color-text-inverse: var(--bb-color-gray-1100);
1033
1038
  --sky-color-text-on_prominent: var(--bb-color-white);
1039
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
1034
1040
  --sky-color-text-selected: var(--bb-color-blue-400);
1035
1041
  --sky-color-viz-axis: var(--bb-color-gray-600);
1036
1042
  --sky-color-viz-category-1: var(--bb-color-teal-dark-600);
package/assets/scss/blackbaud.css CHANGED
@@ -402,15 +402,15 @@
402
402
  --bb-font-weight-light: 300;
403
403
  --bb-font-weight-regular: 400;
404
404
  --bb-font-weight-semibold: 600;
405
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/bb-logo.png');
406
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
407
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-base-light.svg');
408
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
409
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
410
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
411
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
412
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
413
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
405
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/bb-logo.png');
406
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
407
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-light.svg');
408
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
409
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
410
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
411
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
412
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
413
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
414
414
  --bb-letter_spacing-normal: normal;
415
415
  --bb-letter_spacing-wider: 0.01rem;
416
416
  --bb-letter_spacing-widest: 0.046875rem;
@@ -500,15 +500,15 @@
500
500
  --bb-shadow-heavy-black-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
501
501
  --bb-shadow-heavy-black-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
502
502
  --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
503
- --bb-shadow-slate-100: 0 1px 3px 0 rgba(12, 16, 22, 0.2), 0 2px 1px -1px rgba(12, 16, 22, 0.12), 0 1px 1px 0 rgba(12, 16, 22, 0.14);
504
- --bb-shadow-slate-1600: 0 8px 10px -5px rgba(12, 16, 22, 0.2), 0 6px 30px 5px rgba(12, 16, 22, 0.12), 0 16px 24px 2px rgba(12, 16, 22, 0.14);
505
- --bb-shadow-slate-200: 0 1px 8px 0 rgba(12, 16, 22, 0.2), 0 3px 3px -2px rgba(12, 16, 22, 0.12), 0 3px 4px 0 rgba(12, 16, 22, 0.14);
506
- --bb-shadow-slate-2400: 0 11px 15px -7px rgba(12, 16, 22, 0.2), 0 9px 46px 8px rgba(12, 16, 22, 0.12), 0 24px 38px 3px rgba(12, 16, 22, 0.14);
507
- --bb-shadow-slate-25: 0 1px 1px 0 rgba(12, 16, 22, 0.05);
508
- --bb-shadow-slate-400: 0 2px 4px -1px rgba(12, 16, 22, 0.2), 0 1px 10px 0 rgba(12, 16, 22, 0.12), 0 4px 5px 0 rgba(12, 16, 22, 0.14);
509
- --bb-shadow-slate-50: 0 1px 1px 0 rgba(12, 16, 22, 0.05), 0 1.5px 1px -1px rgba(12, 16, 22, 0.12);
510
- --bb-shadow-slate-800: 0 5px 5px -3px rgba(12, 16, 22, 0.2), 0 3px 14px 2px rgba(12, 16, 22, 0.12), 0 8px 10px 1px rgba(12, 16, 22, 0.14);
511
- --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(12, 16, 22, 0.5);
503
+ --bb-shadow-slate-100: 0 1px 3px 0 rgba(33, 44, 63, 0.2), 0 2px 1px -1px rgba(33, 44, 63, 0.12), 0 1px 1px 0 rgba(33, 44, 63, 0.14);
504
+ --bb-shadow-slate-1600: 0 8px 10px -5px rgba(33, 44, 63, 0.2), 0 6px 30px 5px rgba(33, 44, 63, 0.12), 0 16px 24px 2px rgba(33, 44, 63, 0.14);
505
+ --bb-shadow-slate-200: 0 1px 8px 0 rgba(33, 44, 63, 0.2), 0 3px 3px -2px rgba(33, 44, 63, 0.12), 0 3px 4px 0 rgba(33, 44, 63, 0.14);
506
+ --bb-shadow-slate-2400: 0 11px 15px -7px rgba(33, 44, 63, 0.2), 0 9px 46px 8px rgba(33, 44, 63, 0.12), 0 24px 38px 3px rgba(33, 44, 63, 0.14);
507
+ --bb-shadow-slate-25: 0 1px 1px 0 rgba(33, 44, 63, 0.05);
508
+ --bb-shadow-slate-400: 0 2px 4px -1px rgba(33, 44, 63, 0.2), 0 1px 10px 0 rgba(33, 44, 63, 0.12), 0 4px 5px 0 rgba(33, 44, 63, 0.14);
509
+ --bb-shadow-slate-50: 0 1px 1px 0 rgba(33, 44, 63, 0.12), 0 1.5px 1px -1px rgba(33, 44, 63, 0.12);
510
+ --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);
511
+ --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
512
512
  --bb-shadow-steel-fusion-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
513
513
  --bb-shadow-steel-fusion-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
514
514
  --bb-shadow-steel-fusion-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
@@ -537,7 +537,7 @@
537
537
  --bb-color-scrollbar-bb-dark-thumb: #51555c;
538
538
  --bb-color-scrollbar-bb-dark-track: #1c2228;
539
539
  }
540
- .sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud.sky-theme-mode-light {
540
+ .sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud:not(.sky-theme-mode-dark) {
541
541
  --sky-brand-name: var(--bb-brand-name);
542
542
  --sky-color-background-action-accent-base: var(--bb-color-blue-25);
543
543
  --sky-color-background-container-backdrop: var(--bb-color-slate-200);
@@ -651,6 +651,7 @@
651
651
  --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
652
652
  --sky-color-background-container-info: var(--bb-color-blue-dark-400);
653
653
  --sky-color-background-container-menu: var(--bb-color-steel-gray-900);
654
+ --sky-color-background-container-prominent: var(--bb-color-steel-gray-1125);
654
655
  --sky-color-background-container-success: var(--bb-color-green-dark-400);
655
656
  --sky-color-background-container-warning: var(--bb-color-yellow-dark-400);
656
657
  --sky-color-background-disabled: var(--bb-color-gray-700);
@@ -787,10 +788,11 @@
787
788
  --sky-color-icon-deemphasized: var(--bb-color-steel-gray-400);
788
789
  --sky-color-icon-default: var(--bb-color-steel-gray-100);
789
790
  --sky-color-icon-info: var(--bb-color-blue-dark-400);
790
- --sky-color-icon-input-action: var(--bb-color-blue-dark-300);
791
+ --sky-color-icon-input-action: var(--bb-color-oklch-blue-375);
791
792
  --sky-color-icon-inverse: var(--bb-color-steel-gray-1100);
792
793
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
793
794
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
795
+ --sky-color-icon-on_status: var(--bb-color-white);
794
796
  --sky-color-icon-selected: var(--bb-color-blue-dark-300);
795
797
  --sky-color-icon-success: var(--bb-color-green-dark-400);
796
798
  --sky-color-icon-warning: var(--bb-color-yellow-dark-400);
@@ -806,6 +808,7 @@
806
808
  --sky-color-text-heading: var(--bb-color-steel-gray-100);
807
809
  --sky-color-text-inverse: var(--bb-color-steel-gray-1100);
808
810
  --sky-color-text-on_prominent: var(--bb-color-white);
811
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
809
812
  --sky-color-text-selected: var(--bb-color-steel-gray-100);
810
813
  --sky-image-select_icon-base: var(--bb-image-select_icon-bb-dark-src);
811
814
  --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-bb-dark-src);
package/bundles/base.css CHANGED
@@ -402,15 +402,15 @@
402
402
  --bb-font-weight-light: 300;
403
403
  --bb-font-weight-regular: 400;
404
404
  --bb-font-weight-semibold: 600;
405
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/bb-logo.png');
406
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
407
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-base-light.svg');
408
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
409
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
410
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
411
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
412
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
413
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.6.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
405
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/bb-logo.png');
406
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
407
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-base-light.svg');
408
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
409
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
410
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
411
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
412
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
413
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.8.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
414
414
  --bb-letter_spacing-normal: normal;
415
415
  --bb-letter_spacing-wider: 0.01rem;
416
416
  --bb-letter_spacing-widest: 0.046875rem;
@@ -500,15 +500,15 @@
500
500
  --bb-shadow-heavy-black-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
501
501
  --bb-shadow-heavy-black-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
502
502
  --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
503
- --bb-shadow-slate-100: 0 1px 3px 0 rgba(12, 16, 22, 0.2), 0 2px 1px -1px rgba(12, 16, 22, 0.12), 0 1px 1px 0 rgba(12, 16, 22, 0.14);
504
- --bb-shadow-slate-1600: 0 8px 10px -5px rgba(12, 16, 22, 0.2), 0 6px 30px 5px rgba(12, 16, 22, 0.12), 0 16px 24px 2px rgba(12, 16, 22, 0.14);
505
- --bb-shadow-slate-200: 0 1px 8px 0 rgba(12, 16, 22, 0.2), 0 3px 3px -2px rgba(12, 16, 22, 0.12), 0 3px 4px 0 rgba(12, 16, 22, 0.14);
506
- --bb-shadow-slate-2400: 0 11px 15px -7px rgba(12, 16, 22, 0.2), 0 9px 46px 8px rgba(12, 16, 22, 0.12), 0 24px 38px 3px rgba(12, 16, 22, 0.14);
507
- --bb-shadow-slate-25: 0 1px 1px 0 rgba(12, 16, 22, 0.05);
508
- --bb-shadow-slate-400: 0 2px 4px -1px rgba(12, 16, 22, 0.2), 0 1px 10px 0 rgba(12, 16, 22, 0.12), 0 4px 5px 0 rgba(12, 16, 22, 0.14);
509
- --bb-shadow-slate-50: 0 1px 1px 0 rgba(12, 16, 22, 0.05), 0 1.5px 1px -1px rgba(12, 16, 22, 0.12);
510
- --bb-shadow-slate-800: 0 5px 5px -3px rgba(12, 16, 22, 0.2), 0 3px 14px 2px rgba(12, 16, 22, 0.12), 0 8px 10px 1px rgba(12, 16, 22, 0.14);
511
- --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(12, 16, 22, 0.5);
503
+ --bb-shadow-slate-100: 0 1px 3px 0 rgba(33, 44, 63, 0.2), 0 2px 1px -1px rgba(33, 44, 63, 0.12), 0 1px 1px 0 rgba(33, 44, 63, 0.14);
504
+ --bb-shadow-slate-1600: 0 8px 10px -5px rgba(33, 44, 63, 0.2), 0 6px 30px 5px rgba(33, 44, 63, 0.12), 0 16px 24px 2px rgba(33, 44, 63, 0.14);
505
+ --bb-shadow-slate-200: 0 1px 8px 0 rgba(33, 44, 63, 0.2), 0 3px 3px -2px rgba(33, 44, 63, 0.12), 0 3px 4px 0 rgba(33, 44, 63, 0.14);
506
+ --bb-shadow-slate-2400: 0 11px 15px -7px rgba(33, 44, 63, 0.2), 0 9px 46px 8px rgba(33, 44, 63, 0.12), 0 24px 38px 3px rgba(33, 44, 63, 0.14);
507
+ --bb-shadow-slate-25: 0 1px 1px 0 rgba(33, 44, 63, 0.05);
508
+ --bb-shadow-slate-400: 0 2px 4px -1px rgba(33, 44, 63, 0.2), 0 1px 10px 0 rgba(33, 44, 63, 0.12), 0 4px 5px 0 rgba(33, 44, 63, 0.14);
509
+ --bb-shadow-slate-50: 0 1px 1px 0 rgba(33, 44, 63, 0.12), 0 1.5px 1px -1px rgba(33, 44, 63, 0.12);
510
+ --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);
511
+ --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
512
512
  --bb-shadow-steel-fusion-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
513
513
  --bb-shadow-steel-fusion-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
514
514
  --bb-shadow-steel-fusion-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
@@ -537,7 +537,7 @@
537
537
  --bb-color-scrollbar-bb-dark-thumb: #51555c;
538
538
  --bb-color-scrollbar-bb-dark-track: #1c2228;
539
539
  }
540
- .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-light {
540
+ .sky-theme-modern.sky-theme-brand-base:not(.sky-theme-mode-dark) {
541
541
  --sky-brand-name: var(--bb-brand-name);
542
542
  --sky-color-background-action-accent-active: var(--bb-color-blue-100);
543
543
  --sky-color-background-action-accent-base: var(--bb-color-white);
@@ -576,6 +576,7 @@
576
576
  --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
577
577
  --sky-color-background-container-info: var(--bb-color-blue-200);
578
578
  --sky-color-background-container-menu: var(--bb-color-white);
579
+ --sky-color-background-container-prominent: var(--bb-color-slate-50);
579
580
  --sky-color-background-container-success: var(--bb-color-green-200);
580
581
  --sky-color-background-container-tooltip: var(--bb-color-gray-1000);
581
582
  --sky-color-background-container-warning: var(--bb-color-yellow-200);
@@ -713,6 +714,7 @@
713
714
  --sky-color-icon-inverse: var(--bb-color-white);
714
715
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
715
716
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
717
+ --sky-color-icon-on_status: var(--bb-color-white);
716
718
  --sky-color-icon-selected: var(--bb-color-blue-600);
717
719
  --sky-color-icon-success: var(--bb-color-green-600);
718
720
  --sky-color-icon-warning: var(--bb-color-yellow-400);
@@ -728,6 +730,7 @@
728
730
  --sky-color-text-heading: var(--bb-color-gray-1100);
729
731
  --sky-color-text-inverse: var(--bb-color-white);
730
732
  --sky-color-text-on_prominent: var(--bb-color-white);
733
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
731
734
  --sky-color-text-selected: var(--bb-color-blue-600);
732
735
  --sky-color-viz-axis: var(--bb-color-gray-500);
733
736
  --sky-color-viz-category-1: var(--bb-color-teal-500);
@@ -838,7 +841,7 @@
838
841
  --sky-elevation-overlay-simple-100: var(--bb-shadow-gray-simple-400);
839
842
  --sky-elevation-raised-100: var(--bb-shadow-gray-100);
840
843
  }
841
- :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-mode-light) {
844
+ :root:has(body.sky-theme-modern.sky-theme-brand-base:not(.sky-theme-mode-dark)) {
842
845
  --sky-color-scrollbar-thumb: var(--bb-color-scrollbar-base-light-thumb);
843
846
  --sky-color-scrollbar-track: var(--bb-color-scrollbar-base-light-track);
844
847
  }
@@ -880,6 +883,7 @@
880
883
  --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
881
884
  --sky-color-background-container-info: var(--bb-color-blue-800);
882
885
  --sky-color-background-container-menu: var(--bb-color-gray-900);
886
+ --sky-color-background-container-prominent: var(--bb-color-steel-gray-1125);
883
887
  --sky-color-background-container-success: var(--bb-color-green-900);
884
888
  --sky-color-background-container-tooltip: var(--bb-color-gray-25);
885
889
  --sky-color-background-container-warning: var(--bb-color-yellow-800);
@@ -1016,6 +1020,7 @@
1016
1020
  --sky-color-icon-inverse: var(--bb-color-gray-1100);
1017
1021
  --sky-color-icon-on_prominent-base: var(--bb-color-white);
1018
1022
  --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
1023
+ --sky-color-icon-on_status: var(--bb-color-white);
1019
1024
  --sky-color-icon-selected: var(--bb-color-blue-600);
1020
1025
  --sky-color-icon-success: var(--bb-color-green-700);
1021
1026
  --sky-color-icon-warning: var(--bb-color-yellow-600);
@@ -1031,6 +1036,7 @@
1031
1036
  --sky-color-text-heading: var(--bb-color-gray-50);
1032
1037
  --sky-color-text-inverse: var(--bb-color-gray-1100);
1033
1038
  --sky-color-text-on_prominent: var(--bb-color-white);
1039
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
1034
1040
  --sky-color-text-selected: var(--bb-color-blue-400);
1035
1041
  --sky-color-viz-axis: var(--bb-color-gray-600);
1036
1042
  --sky-color-viz-category-1: var(--bb-color-teal-dark-600);