@blackbaud/skyux-design-tokens 2.0.0-alpha.1 → 2.0.0-alpha.3

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 (4) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/assets/scss/blackbaud.css +26 -15
  3. package/assets/scss/modern.css +11 -1
  4. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,33 @@
2
2
 
3
3
  - Added `neutral-medium-dark` token in modern. [#64](https://github.com/blackbaud/skyux-design-tokens/pull/64)
4
4
 
5
+ ## [2.0.0-alpha.3](https://github.com/blackbaud/skyux-design-tokens/compare/2.0.0-alpha.2...2.0.0-alpha.3) (2025-07-16)
6
+
7
+
8
+ ### ⚠ BREAKING CHANGES
9
+
10
+ * change heading-1 style from semibold to regular ([#225](https://github.com/blackbaud/skyux-design-tokens/issues/225))
11
+ * add blue-250 and change border references ([#230](https://github.com/blackbaud/skyux-design-tokens/issues/230))
12
+ * layout fit list inset space reduction ([#231](https://github.com/blackbaud/skyux-design-tokens/issues/231))
13
+
14
+ ### Features
15
+
16
+ * add blue-250 and change border references ([#230](https://github.com/blackbaud/skyux-design-tokens/issues/230)) ([1ad9628](https://github.com/blackbaud/skyux-design-tokens/commit/1ad9628028f548215fc21de5e1d91af93a956b92))
17
+ * layout fit list inset space reduction ([#231](https://github.com/blackbaud/skyux-design-tokens/issues/231)) ([98ecefd](https://github.com/blackbaud/skyux-design-tokens/commit/98ecefd02cf502114dd5ff82f66700fb6299c546))
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * change heading-1 style from semibold to regular ([#225](https://github.com/blackbaud/skyux-design-tokens/issues/225)) ([61fcb40](https://github.com/blackbaud/skyux-design-tokens/commit/61fcb40a89d723257e15f5aabfd6815b7574c950))
23
+
24
+ ## [2.0.0-alpha.2](https://github.com/blackbaud/skyux-design-tokens/compare/2.0.0-alpha.1...2.0.0-alpha.2) (2025-07-16)
25
+
26
+
27
+ ### Features
28
+
29
+ * add brand name ([#234](https://github.com/blackbaud/skyux-design-tokens/issues/234)) ([85a03c6](https://github.com/blackbaud/skyux-design-tokens/commit/85a03c6c17639f26a9f339972e1a1a3b1569684a))
30
+ * add split view drawer spacing ([#219](https://github.com/blackbaud/skyux-design-tokens/issues/219)) ([1d47046](https://github.com/blackbaud/skyux-design-tokens/commit/1d47046766fd9d1f9a93d021c942f3b462e58fc4))
31
+
5
32
  ## [2.0.0-alpha.1](https://github.com/blackbaud/skyux-design-tokens/compare/2.0.0-alpha.0...2.0.0-alpha.1) (2025-07-10)
6
33
 
7
34
 
package/assets/scss/blackbaud.css CHANGED
@@ -13,12 +13,14 @@
13
13
  --bb-border-radius-round: 50%;
14
14
  --bb-border-style-dotted: dotted;
15
15
  --bb-border-style-solid: solid;
16
+ --bb-brand-name: Blackbaud;
16
17
  --bb-color-black: #000000;
17
18
  --bb-color-blocking: rgba(255, 255, 255, 0.7);
18
19
  --bb-color-blue-100: #eef3fc;
19
20
  --bb-color-blue-1000: #09152b;
20
- --bb-color-blue-200: #d0e1f7;
21
+ --bb-color-blue-200: #d5e1f7;
21
22
  --bb-color-blue-25: #fbfcfe;
23
+ --bb-color-blue-250: #bfd3f2;
22
24
  --bb-color-blue-300: #aac4ee;
23
25
  --bb-color-blue-400: #80a6e6;
24
26
  --bb-color-blue-50: #f4f8fd;
@@ -149,7 +151,7 @@
149
151
  --bb-font-weight-light: 300;
150
152
  --bb-font-weight-regular: 400;
151
153
  --bb-font-weight-semibold: 600;
152
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.1/assets/images/bb-logo.png');
154
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.3/assets/images/bb-logo.png');
153
155
  --bb-letter_spacing-normal: normal;
154
156
  --bb-letter_spacing-wider: 0.16px;
155
157
  --bb-line_height-300: calc(18/13);
@@ -412,6 +414,7 @@
412
414
  --sky-elevation-raised-100: var(--bb-shadow-blue-100);
413
415
  }
414
416
  .sky-theme-modern.sky-theme-brand-base {
417
+ --sky-brand-name: var(--bb-brand-name);
415
418
  --sky-color-background-action-danger-active: var(--bb-color-red-800);
416
419
  --sky-color-background-action-danger-base: var(--bb-color-red-600);
417
420
  --sky-color-background-action-danger-disabled: var(--bb-color-gray-50);
@@ -489,7 +492,7 @@
489
492
  --sky-color-border-action-danger-focus: var(--bb-color-red-1000);
490
493
  --sky-color-border-action-danger-hover: var(--bb-color-red-1000);
491
494
  --sky-color-border-action-input-active: var(--bb-color-blue-600);
492
- --sky-color-border-action-input-base: var(--bb-color-blue-200);
495
+ --sky-color-border-action-input-base: var(--bb-color-blue-250);
493
496
  --sky-color-border-action-input-disabled: var(--bb-color-gray-200);
494
497
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
495
498
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
@@ -520,7 +523,7 @@
520
523
  --sky-color-border-elevation: var(--bb-color-blue-200);
521
524
  --sky-color-border-info: var(--bb-color-blue-600);
522
525
  --sky-color-border-input-active: var(--bb-color-blue-600);
523
- --sky-color-border-input-base: var(--bb-color-blue-200);
526
+ --sky-color-border-input-base: var(--bb-color-blue-250);
524
527
  --sky-color-border-input-disabled: var(--bb-color-gray-200);
525
528
  --sky-color-border-input-error: var(--bb-color-red-600);
526
529
  --sky-color-border-input-focus: var(--bb-color-blue-600);
@@ -533,8 +536,8 @@
533
536
  --sky-color-border-progress_step: var(--bb-color-gray-400);
534
537
  --sky-color-border-selected: var(--bb-color-blue-600);
535
538
  --sky-color-border-selected_soft: var(--bb-color-blue-300);
536
- --sky-color-border-separator-light: var(--bb-color-blue-200);
537
- --sky-color-border-separator-row: var(--bb-color-blue-200);
539
+ --sky-color-border-separator-light: var(--bb-color-blue-250);
540
+ --sky-color-border-separator-row: var(--bb-color-blue-250);
538
541
  --sky-color-border-success: var(--bb-color-green-700);
539
542
  --sky-color-border-switch-active: var(--bb-color-blue-600);
540
543
  --sky-color-border-switch-base: var(--bb-color-blue-500);
@@ -843,20 +846,20 @@
843
846
  --sky-comp-page-content-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
844
847
  --sky-comp-page-content-blocks-space-inset-xs-top: var(--bb-size-fluid-50);
845
848
  --sky-comp-page-content-fit-space-inset-sm-bottom: var(--bb-size-0);
846
- --sky-comp-page-content-fit-space-inset-sm-left: var(--bb-size-fluid-150);
847
- --sky-comp-page-content-fit-space-inset-sm-right: var(--bb-size-fluid-150);
849
+ --sky-comp-page-content-fit-space-inset-sm-left: var(--bb-size-0);
850
+ --sky-comp-page-content-fit-space-inset-sm-right: var(--bb-size-0);
848
851
  --sky-comp-page-content-fit-space-inset-sm-top: var(--bb-size-0);
849
852
  --sky-comp-page-content-fit-space-inset-xs-bottom: var(--bb-size-0);
850
- --sky-comp-page-content-fit-space-inset-xs-left: var(--bb-size-fluid-50);
851
- --sky-comp-page-content-fit-space-inset-xs-right: var(--bb-size-fluid-50);
853
+ --sky-comp-page-content-fit-space-inset-xs-left: var(--bb-size-0);
854
+ --sky-comp-page-content-fit-space-inset-xs-right: var(--bb-size-0);
852
855
  --sky-comp-page-content-fit-space-inset-xs-top: var(--bb-size-0);
853
856
  --sky-comp-page-content-list-space-inset-sm-bottom: var(--bb-size-0);
854
- --sky-comp-page-content-list-space-inset-sm-left: var(--bb-size-fluid-150);
855
- --sky-comp-page-content-list-space-inset-sm-right: var(--bb-size-fluid-150);
857
+ --sky-comp-page-content-list-space-inset-sm-left: var(--bb-size-0);
858
+ --sky-comp-page-content-list-space-inset-sm-right: var(--bb-size-0);
856
859
  --sky-comp-page-content-list-space-inset-sm-top: var(--bb-size-0);
857
860
  --sky-comp-page-content-list-space-inset-xs-bottom: var(--bb-size-0);
858
- --sky-comp-page-content-list-space-inset-xs-left: var(--bb-size-fluid-50);
859
- --sky-comp-page-content-list-space-inset-xs-right: var(--bb-size-fluid-50);
861
+ --sky-comp-page-content-list-space-inset-xs-left: var(--bb-size-0);
862
+ --sky-comp-page-content-list-space-inset-xs-right: var(--bb-size-0);
860
863
  --sky-comp-page-content-list-space-inset-xs-top: var(--bb-size-0);
861
864
  --sky-comp-page-content-tabs-space-inset-sm-bottom: var(--bb-size-0);
862
865
  --sky-comp-page-content-tabs-space-inset-sm-left: var(--bb-size-0);
@@ -978,6 +981,14 @@
978
981
  --sky-comp-selection_box-expanded-space-inset-left: var(--bb-size-fluid-150);
979
982
  --sky-comp-selection_box-expanded-space-inset-right: var(--bb-size-fluid-150);
980
983
  --sky-comp-selection_box-expanded-space-inset-top: var(--bb-size-fluid-150);
984
+ --sky-comp-split_view-drawer-space-inset-sm-bottom: var(--bb-size-fluid-75);
985
+ --sky-comp-split_view-drawer-space-inset-sm-left: var(--bb-size-fluid-75);
986
+ --sky-comp-split_view-drawer-space-inset-sm-right: var(--bb-size-0);
987
+ --sky-comp-split_view-drawer-space-inset-sm-top: var(--bb-size-fluid-75);
988
+ --sky-comp-split_view-drawer-space-inset-xs-bottom: var(--bb-size-fluid-50);
989
+ --sky-comp-split_view-drawer-space-inset-xs-left: var(--bb-size-fluid-50);
990
+ --sky-comp-split_view-drawer-space-inset-xs-right: var(--bb-size-0);
991
+ --sky-comp-split_view-drawer-space-inset-xs-top: var(--bb-size-fluid-50);
981
992
  --sky-comp-split_view-footer-space-inset-bottom: var(--bb-size-fluid-50);
982
993
  --sky-comp-split_view-footer-space-inset-left: var(--bb-size-fluid-50);
983
994
  --sky-comp-split_view-footer-space-inset-right: var(--bb-size-fluid-50);
@@ -1129,7 +1140,7 @@
1129
1140
  --sky-font-style-display-3: var(--bb-font-style-regular);
1130
1141
  --sky-font-style-display-4: var(--bb-font-style-regular);
1131
1142
  --sky-font-style-emphasized: var(--bb-font-style-semibold);
1132
- --sky-font-style-heading-1: var(--bb-font-style-semibold);
1143
+ --sky-font-style-heading-1: var(--bb-font-style-regular);
1133
1144
  --sky-font-style-heading-2: var(--bb-font-style-semibold);
1134
1145
  --sky-font-style-heading-3: var(--bb-font-style-semibold);
1135
1146
  --sky-font-style-heading-4: var(--bb-font-style-semibold);
package/assets/scss/modern.css CHANGED
@@ -11,6 +11,7 @@
11
11
  --modern-border-radius-round: 50%;
12
12
  --modern-border-style-dotted: dotted;
13
13
  --modern-border-style-solid: solid;
14
+ --modern-brand-name: Blackbaud;
14
15
  --modern-color-black: #000000;
15
16
  --modern-color-blocking: rgba(255, 255, 255, 0.7);
16
17
  --modern-color-blue-05: #ebfbff;
@@ -73,7 +74,7 @@
73
74
  --modern-font-weight-light: 300;
74
75
  --modern-font-weight-regular: 400;
75
76
  --modern-font-weight-semibold: 600;
76
- --modern-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.1/assets/images/bb-logo.png');
77
+ --modern-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.3/assets/images/bb-logo.png');
77
78
  --modern-letter_spacing-normal: normal;
78
79
  --modern-line_height-110: 1.1;
79
80
  --modern-line_height-115: 1.15;
@@ -136,6 +137,7 @@
136
137
  --modern-shadow-size-8: 0 2px 15px 2px var(--modern-color-shadow_color);
137
138
  }
138
139
  .sky-theme-modern {
140
+ --sky-brand-name: var(--modern-brand-name);
139
141
  --sky-color-background-action-danger-active: var(--modern-color-red-70);
140
142
  --sky-color-background-action-danger-base: var(--modern-color-red-70);
141
143
  --sky-color-background-action-danger-disabled: var(--modern-color-gray-07);
@@ -702,6 +704,14 @@
702
704
  --sky-comp-selection_box-expanded-space-inset-left: var(--modern-space-xl);
703
705
  --sky-comp-selection_box-expanded-space-inset-right: var(--modern-space-xl);
704
706
  --sky-comp-selection_box-expanded-space-inset-top: var(--modern-space-xl);
707
+ --sky-comp-split_view-drawer-space-inset-sm-bottom: var(--modern-size-0);
708
+ --sky-comp-split_view-drawer-space-inset-sm-left: var(--modern-size-0);
709
+ --sky-comp-split_view-drawer-space-inset-sm-right: var(--modern-size-0);
710
+ --sky-comp-split_view-drawer-space-inset-sm-top: var(--modern-size-0);
711
+ --sky-comp-split_view-drawer-space-inset-xs-bottom: var(--modern-size-0);
712
+ --sky-comp-split_view-drawer-space-inset-xs-left: var(--modern-size-0);
713
+ --sky-comp-split_view-drawer-space-inset-xs-right: var(--modern-size-0);
714
+ --sky-comp-split_view-drawer-space-inset-xs-top: var(--modern-size-0);
705
715
  --sky-comp-split_view-footer-space-inset-bottom: var(--modern-space-s);
706
716
  --sky-comp-split_view-footer-space-inset-left: var(--modern-space-s);
707
717
  --sky-comp-split_view-footer-space-inset-right: var(--modern-space-s);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blackbaud/skyux-design-tokens",
3
- "version": "2.0.0-alpha.1",
3
+ "version": "2.0.0-alpha.3",
4
4
  "description": "Design tokens for SKY UX",
5
5
  "homepage": "https://github.com/blackbaud/skyux-design-tokens",
6
6
  "license": "MIT",