@blackbaud/skyux-design-tokens 0.0.64 → 0.0.66

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 (6) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/assets/assets.json +3 -0
  3. package/assets/images/bb-logo.png +0 -0
  4. package/assets/scss/blackbaud.css +164 -215
  5. package/assets/scss/modern.css +39 -85
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,21 @@
2
2
 
3
3
  - Added `neutral-medium-dark` token in modern. [#64](https://github.com/blackbaud/skyux-design-tokens/pull/64)
4
4
 
5
+ ## [0.0.66](https://github.com/blackbaud/skyux-design-tokens/compare/0.0.65...0.0.66) (2025-06-26)
6
+
7
+
8
+ ### Features
9
+
10
+ * add assets logic and logo ([#197](https://github.com/blackbaud/skyux-design-tokens/issues/197)) ([290ebb6](https://github.com/blackbaud/skyux-design-tokens/commit/290ebb6a6873e7e1fd50ab5e5a65b9ac92ee1dfb))
11
+ * remove spacing tokens ([#195](https://github.com/blackbaud/skyux-design-tokens/issues/195)) ([2be2a10](https://github.com/blackbaud/skyux-design-tokens/commit/2be2a102aae176b19fda3cec902a0677c45cbca0))
12
+
13
+ ## [0.0.65](https://github.com/blackbaud/skyux-design-tokens/compare/0.0.64...0.0.65) (2025-06-24)
14
+
15
+
16
+ ### Features
17
+
18
+ * visual updates for v13 ([#194](https://github.com/blackbaud/skyux-design-tokens/issues/194)) ([72d9ef4](https://github.com/blackbaud/skyux-design-tokens/commit/72d9ef4626a51fae2205d4b09e6c15284c505bf8))
19
+
5
20
  ## [0.0.64](https://github.com/blackbaud/skyux-design-tokens/compare/0.0.63...0.0.64) (2025-06-17)
6
21
 
7
22
 
package/assets/assets.json ADDED
@@ -0,0 +1,3 @@
1
+ {
2
+ "fonts": []
3
+ }
package/assets/images/bb-logo.png ADDED
Binary file
package/assets/scss/blackbaud.css CHANGED
@@ -1,3 +1,9 @@
1
+ @property --bb-image-logo-primary-src {
2
+ syntax: '<url>';
3
+ inherits: true;
4
+ initial-value: url();
5
+ }
6
+
1
7
  .sky-theme-modern.sky-theme-brand-base {
2
8
  --bb-border-radius-0: 0rem;
3
9
  --bb-border-radius-012: .125rem;
@@ -12,9 +18,10 @@
12
18
  --bb-color-blue-100: #eef3fc;
13
19
  --bb-color-blue-1000: #09152b;
14
20
  --bb-color-blue-200: #d0e1f7;
15
- --bb-color-blue-25: #fbfcfe;
21
+ --bb-color-blue-25: #f1f5fa;
16
22
  --bb-color-blue-300: #aac4ee;
17
23
  --bb-color-blue-400: #80a6e6;
24
+ --bb-color-blue-50: #f4f8fd;
18
25
  --bb-color-blue-500: #5589dd;
19
26
  --bb-color-blue-600: #2b6bd5;
20
27
  --bb-color-blue-700: #2256aa;
@@ -120,16 +127,12 @@
120
127
  --bb-font-blkb_sans-fallback: Helvetica Neue, Arial, sans-serif;
121
128
  --bb-font-blkb_sans-name: BLKB Sans;
122
129
  --bb-font-monospaced-family: Menlo, Monaco, Consolas, Courier New, monospace;
123
- --bb-font-size-100: 0.75rem;
124
- --bb-font-size-1000: 3.25rem;
125
- --bb-font-size-200: 0.875rem;
126
- --bb-font-size-300: 1rem;
127
- --bb-font-size-400: 1.25rem;
128
- --bb-font-size-500: 1.5rem;
129
- --bb-font-size-600: 1.75rem;
130
- --bb-font-size-700: 2rem;
131
- --bb-font-size-800: 2.25rem;
132
- --bb-font-size-900: 2.625rem;
130
+ --bb-font-size-300: 0.8125rem;
131
+ --bb-font-size-400: 0.9375rem;
132
+ --bb-font-size-500: 1.0625rem;
133
+ --bb-font-size-600: 1.1875rem;
134
+ --bb-font-size-700: 1.5rem;
135
+ --bb-font-size-800: 1.6875rem;
133
136
  --bb-font-style-italic-style: italic;
134
137
  --bb-font-style-italic-weight: 400;
135
138
  --bb-font-style-light: 300;
@@ -145,26 +148,25 @@
145
148
  --bb-font-weight-light: 300;
146
149
  --bb-font-weight-regular: 400;
147
150
  --bb-font-weight-semibold: 600;
151
+ --bb-image-logo-primary-src: url('../images/bb-logo.png');
148
152
  --bb-letter_spacing-normal: normal;
149
- --bb-letter_spacing-wider: 0.32px;
150
- --bb-line_height-100: calc(16/12);
151
- --bb-line_height-1000: calc(64/52);
152
- --bb-line_height-200: calc(20/14);
153
- --bb-line_height-300: calc(24/16);
154
- --bb-line_height-400: calc(28/20);
155
- --bb-line_height-500: calc(32/24);
156
- --bb-line_height-600: calc(36/28);
157
- --bb-line_height-700: calc(40/32);
158
- --bb-line_height-800: calc(40/36);
159
- --bb-line_height-900: calc(48/42);
153
+ --bb-letter_spacing-wider: 0.16px;
154
+ --bb-line_height-300: calc(18/13);
155
+ --bb-line_height-400: calc(20/15);
156
+ --bb-line_height-500: calc(24/17);
157
+ --bb-line_height-600: calc(28/19);
158
+ --bb-line_height-700: calc(32/24);
159
+ --bb-line_height-800: calc(36/26);
160
160
  --bb-opacity-600: .6;
161
161
  --bb-shadow-gray-0: 0 0 0 0 #000000;
162
- --bb-shadow-gray-1: 0 1px 3px 0 rgba(0,0,0,0.2), 0 2px 1px -1px rgba(0,0,0,0.12), 0 1px 1px 0 rgba(0,0,0,0.14);
163
- --bb-shadow-gray-16: 0 8px 10px -5px rgba(0,0,0,0.2), 0 6px 30px 5px rgba(0,0,0,0.12), 0 16px 24px 2px rgba(0,0,0,0.14);
164
- --bb-shadow-gray-2: 0 1px 8px 0 rgba(0,0,0,0.2), 0 3px 3px -2px rgba(0,0,0,0.12), 0 3px 4px 0 rgba(0,0,0,0.14);
165
- --bb-shadow-gray-24: 0 11px 15px -7px rgba(0,0,0,0.2), 0 9px 46px 8px rgba(0,0,0,0.12), 0 24px 38px 3px rgba(0,0,0,0.14);
166
- --bb-shadow-gray-4: 0 2px 4px -1px rgba(0,0,0,0.2), 0 1px 10px 0 rgba(0,0,0,0.12), 0 4px 5px 0 rgba(0,0,0,0.14);
167
- --bb-shadow-gray-8: 0 5px 5px -3px rgba(0,0,0,0.2), 0 3px 14px 2px rgba(0,0,0,0.12), 0 8px 10px 1px rgba(0,0,0,0.14);
162
+ --bb-shadow-gray-100: 0 1px 3px 0 rgba(13,62,130,0.2), 0 2px 1px -1px rgba(13,62,130,0.12), 0 1px 1px 0 rgba(13,62,130,0.14);
163
+ --bb-shadow-gray-1600: 0 8px 10px -5px rgba(13,62,130,0.2), 0 6px 30px 5px rgba(13,62,130,0.12), 0 16px 24px 2px rgba(13,62,130,0.14);
164
+ --bb-shadow-gray-200: 0 1px 8px 0 rgba(13,62,130,0.2), 0 3px 3px -2px rgba(13,62,130,0.12), 0 3px 4px 0 rgba(13,62,130,0.14);
165
+ --bb-shadow-gray-2400: 0 11px 15px -7px rgba(13,62,130,0.2), 0 9px 46px 8px rgba(13,62,130,0.12), 0 24px 38px 3px rgba(13,62,130,0.14);
166
+ --bb-shadow-gray-25: 0 1px 1px 0 rgba(13,62,130,0.05);
167
+ --bb-shadow-gray-400: 0 2px 4px -1px rgba(13,62,130,0.2), 0 1px 10px 0 rgba(13,62,130,0.12), 0 4px 5px 0 rgba(13,62,130,0.14);
168
+ --bb-shadow-gray-50: 0 1px 1px 0 rgba(13,62,130,0.12), 0 1.5px 1px -1px rgba(13,62,130,0.12);
169
+ --bb-shadow-gray-800: 0 5px 5px -3px rgba(13,62,130,0.2), 0 3px 14px 2px rgba(13,62,130,0.12), 0 8px 10px 1px rgba(13,62,130,0.14);
168
170
  --bb-size-0: 0rem;
169
171
  --bb-size-fixed-100: 16px;
170
172
  --bb-size-fixed-12: 2px;
@@ -234,7 +236,7 @@
234
236
  --sky-space-inset-letterbox-top-l: var(--bb-size-fluid-125);
235
237
  --sky-space-inset-letterbox-top-m: var(--bb-size-fluid-75);
236
238
  --sky-space-inset-letterbox-top-s: var(--bb-size-fluid-25);
237
- --sky-type-body-m: var(--bb-font-size-100) sans-serif;
239
+ --sky-type-body-m: var(--bb-font-size-300) sans-serif;
238
240
  }
239
241
  .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
240
242
  --sky-color-background-action-danger-active: var(--bb-color-red-600);
@@ -372,50 +374,50 @@
372
374
  --sky-color-text-inverse: var(--bb-color-gray-1100);
373
375
  --sky-color-text-link_highlighted: var(--bb-color-blue-300);
374
376
  --sky-color-text-selected: var(--bb-color-blue-400);
375
- --sky-elevation-focus: var(--bb-shadow-gray-2);
377
+ --sky-elevation-focus: var(--bb-shadow-gray-200);
376
378
  --sky-elevation-none: var(--bb-shadow-gray-0);
377
- --sky-elevation-overflow: var(--bb-shadow-gray-2);
378
- --sky-elevation-overlay-100: var(--bb-shadow-gray-4);
379
- --sky-elevation-overlay-200: var(--bb-shadow-gray-8);
380
- --sky-elevation-overlay-300: var(--bb-shadow-gray-16);
381
- --sky-elevation-overlay-400: var(--bb-shadow-gray-24);
382
- --sky-elevation-raised-100: var(--bb-shadow-gray-1);
379
+ --sky-elevation-overflow: var(--bb-shadow-gray-200);
380
+ --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
381
+ --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
382
+ --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
383
+ --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
384
+ --sky-elevation-raised-100: var(--bb-shadow-gray-100);
383
385
  --sky-opacity-wait: var(--bb-opacity-600);
384
386
  }
385
387
  .sky-theme-modern.sky-theme-brand-base {
386
- --sky-color-background-action-danger-active: var(--bb-color-red-600);
388
+ --sky-color-background-action-danger-active: var(--bb-color-red-800);
387
389
  --sky-color-background-action-danger-base: var(--bb-color-red-600);
388
390
  --sky-color-background-action-danger-disabled: var(--bb-color-gray-50);
389
391
  --sky-color-background-action-danger-focus: var(--bb-color-red-600);
390
- --sky-color-background-action-danger-hover: var(--bb-color-red-600);
391
- --sky-color-background-action-input-active: var(--bb-color-transparent);
392
+ --sky-color-background-action-danger-hover: var(--bb-color-red-700);
393
+ --sky-color-background-action-input-active: var(--bb-color-blue-100);
392
394
  --sky-color-background-action-input-base: var(--bb-color-transparent);
393
395
  --sky-color-background-action-input-disabled: var(--bb-color-gray-50);
394
396
  --sky-color-background-action-input-focus: var(--bb-color-transparent);
395
- --sky-color-background-action-input-hover: var(--bb-color-transparent);
396
- --sky-color-background-action-primary-active: var(--bb-color-blue-600);
397
+ --sky-color-background-action-input-hover: var(--bb-color-blue-50);
398
+ --sky-color-background-action-primary-active: var(--bb-color-blue-800);
397
399
  --sky-color-background-action-primary-base: var(--bb-color-blue-600);
398
400
  --sky-color-background-action-primary-disabled: var(--bb-color-gray-50);
399
401
  --sky-color-background-action-primary-focus: var(--bb-color-blue-600);
400
- --sky-color-background-action-primary-hover: var(--bb-color-blue-600);
401
- --sky-color-background-action-secondary-active: var(--bb-color-white);
402
+ --sky-color-background-action-primary-hover: var(--bb-color-blue-700);
403
+ --sky-color-background-action-secondary-active: var(--bb-color-blue-100);
402
404
  --sky-color-background-action-secondary-base: var(--bb-color-white);
403
405
  --sky-color-background-action-secondary-disabled: var(--bb-color-gray-50);
404
406
  --sky-color-background-action-secondary-focus: var(--bb-color-white);
405
- --sky-color-background-action-secondary-hover: var(--bb-color-white);
406
- --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
407
+ --sky-color-background-action-secondary-hover: var(--bb-color-blue-50);
408
+ --sky-color-background-action-tertiary-active: var(--bb-color-blue-100);
407
409
  --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
408
410
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-50);
409
411
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
410
- --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
412
+ --sky-color-background-action-tertiary-hover: var(--bb-color-blue-50);
411
413
  --sky-color-background-blocking: var(--bb-color-blocking);
412
414
  --sky-color-background-container-base: var(--bb-color-white);
413
415
  --sky-color-background-container-danger: var(--bb-color-red-300);
414
- --sky-color-background-container-info: var(--bb-color-blue-100);
416
+ --sky-color-background-container-info: var(--bb-color-blue-200);
415
417
  --sky-color-background-container-menu: var(--bb-color-white);
416
418
  --sky-color-background-container-success: var(--bb-color-green-300);
417
419
  --sky-color-background-container-warning: var(--bb-color-yellow-300);
418
- --sky-color-background-file_drop: var(--bb-color-gray-25);
420
+ --sky-color-background-file_drop: var(--bb-color-blue-25);
419
421
  --sky-color-background-icon_matte-action-heavy: var(--bb-color-blue-600);
420
422
  --sky-color-background-icon_matte-action-soft: var(--bb-color-blue-100);
421
423
  --sky-color-background-icon_matte-danger: var(--bb-color-red-600);
@@ -423,17 +425,17 @@
423
425
  --sky-color-background-icon_matte-warning: var(--bb-color-yellow-600);
424
426
  --sky-color-background-input-base: var(--bb-color-blue-25);
425
427
  --sky-color-background-input-disabled: var(--bb-color-gray-50);
426
- --sky-color-background-list-active: var(--bb-color-transparent);
428
+ --sky-color-background-list-active: var(--bb-color-blue-100);
427
429
  --sky-color-background-list-base: var(--bb-color-transparent);
428
430
  --sky-color-background-list-disabled: var(--bb-color-gray-50);
429
431
  --sky-color-background-list-focus: var(--bb-color-transparent);
430
- --sky-color-background-list-hover: var(--bb-color-transparent);
431
- --sky-color-background-nav-active: var(--bb-color-transparent);
432
+ --sky-color-background-list-hover: var(--bb-color-blue-50);
433
+ --sky-color-background-nav-active: var(--bb-color-blue-100);
432
434
  --sky-color-background-nav-base: var(--bb-color-transparent);
433
435
  --sky-color-background-nav-disabled: var(--bb-color-gray-50);
434
436
  --sky-color-background-nav-focus: var(--bb-color-transparent);
435
- --sky-color-background-nav-hover: var(--bb-color-transparent);
436
- --sky-color-background-page: var(--bb-color-gray-25);
437
+ --sky-color-background-nav-hover: var(--bb-color-blue-50);
438
+ --sky-color-background-page: var(--bb-color-blue-25);
437
439
  --sky-color-background-scrim: var(--bb-color-scrim);
438
440
  --sky-color-background-selected-danger: var(--bb-color-red-300);
439
441
  --sky-color-background-selected-heavy: var(--bb-color-blue-600);
@@ -444,58 +446,58 @@
444
446
  --sky-color-background-thumb-base: var(--bb-color-white);
445
447
  --sky-color-background-thumb-disabled: var(--bb-color-gray-50);
446
448
  --sky-color-background-thumbnail_matte: var(--bb-color-white);
447
- --sky-color-border-action-danger-active: var(--bb-color-red-200);
449
+ --sky-color-border-action-danger-active: var(--bb-color-red-1000);
448
450
  --sky-color-border-action-danger-base: var(--bb-color-red-600);
449
- --sky-color-border-action-danger-disabled: var(--bb-color-gray-100);
450
- --sky-color-border-action-danger-focus: var(--bb-color-red-200);
451
- --sky-color-border-action-danger-hover: var(--bb-color-red-200);
451
+ --sky-color-border-action-danger-disabled: var(--bb-color-gray-200);
452
+ --sky-color-border-action-danger-focus: var(--bb-color-red-1000);
453
+ --sky-color-border-action-danger-hover: var(--bb-color-red-1000);
452
454
  --sky-color-border-action-input-active: var(--bb-color-blue-600);
453
455
  --sky-color-border-action-input-base: var(--bb-color-blue-200);
454
- --sky-color-border-action-input-disabled: var(--bb-color-gray-400);
456
+ --sky-color-border-action-input-disabled: var(--bb-color-gray-200);
455
457
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
456
458
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
457
- --sky-color-border-action-primary-active: var(--bb-color-blue-200);
459
+ --sky-color-border-action-primary-active: var(--bb-color-blue-1000);
458
460
  --sky-color-border-action-primary-base: var(--bb-color-blue-600);
459
- --sky-color-border-action-primary-disabled: var(--bb-color-gray-100);
460
- --sky-color-border-action-primary-focus: var(--bb-color-blue-200);
461
- --sky-color-border-action-primary-hover: var(--bb-color-blue-200);
461
+ --sky-color-border-action-primary-disabled: var(--bb-color-gray-200);
462
+ --sky-color-border-action-primary-focus: var(--bb-color-blue-1000);
463
+ --sky-color-border-action-primary-hover: var(--bb-color-blue-1000);
462
464
  --sky-color-border-action-secondary-active: var(--bb-color-blue-600);
463
- --sky-color-border-action-secondary-base: var(--bb-color-gray-100);
464
- --sky-color-border-action-secondary-disabled: var(--bb-color-gray-100);
465
+ --sky-color-border-action-secondary-base: var(--bb-color-blue-300);
466
+ --sky-color-border-action-secondary-disabled: var(--bb-color-gray-200);
465
467
  --sky-color-border-action-secondary-focus: var(--bb-color-blue-600);
466
468
  --sky-color-border-action-secondary-hover: var(--bb-color-blue-600);
467
469
  --sky-color-border-action-tertiary-active: var(--bb-color-blue-600);
468
470
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
469
- --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-100);
471
+ --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-200);
470
472
  --sky-color-border-action-tertiary-focus: var(--bb-color-blue-600);
471
473
  --sky-color-border-action-tertiary-hover: var(--bb-color-blue-600);
472
474
  --sky-color-border-column_divider: var(--bb-color-blue-600);
473
- --sky-color-border-container-base: var(--bb-color-gray-100);
475
+ --sky-color-border-container-base: var(--bb-color-blue-200);
474
476
  --sky-color-border-danger: var(--bb-color-red-600);
475
- --sky-color-border-divider: var(--bb-color-gray-100);
476
- --sky-color-border-elevation: var(--bb-color-gray-100);
477
+ --sky-color-border-divider: var(--bb-color-blue-300);
478
+ --sky-color-border-elevation: var(--bb-color-blue-200);
477
479
  --sky-color-border-info: var(--bb-color-blue-600);
478
480
  --sky-color-border-input-active: var(--bb-color-blue-600);
479
481
  --sky-color-border-input-base: var(--bb-color-blue-200);
480
- --sky-color-border-input-disabled: var(--bb-color-gray-400);
482
+ --sky-color-border-input-disabled: var(--bb-color-gray-200);
481
483
  --sky-color-border-input-error: var(--bb-color-red-600);
482
484
  --sky-color-border-input-focus: var(--bb-color-blue-600);
483
485
  --sky-color-border-input-hover: var(--bb-color-blue-600);
484
486
  --sky-color-border-progress_step: var(--bb-color-gray-400);
485
487
  --sky-color-border-selected: var(--bb-color-blue-600);
486
488
  --sky-color-border-selected_soft: var(--bb-color-blue-300);
487
- --sky-color-border-separator-light: var(--bb-color-gray-50);
488
- --sky-color-border-separator-row: var(--bb-color-gray-50);
489
+ --sky-color-border-separator-light: var(--bb-color-blue-200);
490
+ --sky-color-border-separator-row: var(--bb-color-blue-200);
489
491
  --sky-color-border-success: var(--bb-color-green-700);
490
492
  --sky-color-border-switch-active: var(--bb-color-blue-600);
491
493
  --sky-color-border-switch-base: var(--bb-color-blue-500);
492
- --sky-color-border-switch-disabled: var(--bb-color-gray-400);
494
+ --sky-color-border-switch-disabled: var(--bb-color-gray-200);
493
495
  --sky-color-border-switch-error: var(--bb-color-red-600);
494
496
  --sky-color-border-switch-focus: var(--bb-color-blue-600);
495
497
  --sky-color-border-switch-hover: var(--bb-color-blue-600);
496
498
  --sky-color-border-switch-selected-active: var(--bb-color-blue-1000);
497
499
  --sky-color-border-switch-selected-base: var(--bb-color-transparent);
498
- --sky-color-border-switch-selected-disabled: var(--bb-color-gray-400);
500
+ --sky-color-border-switch-selected-disabled: var(--bb-color-gray-200);
499
501
  --sky-color-border-switch-selected-focus: var(--bb-color-blue-1000);
500
502
  --sky-color-border-switch-selected-hover: var(--bb-color-blue-1000);
501
503
  --sky-color-border-text_highlight: var(--bb-color-yellow-800);
@@ -520,18 +522,46 @@
520
522
  --sky-color-text-danger: var(--bb-color-red-600);
521
523
  --sky-color-text-deemphasized: var(--bb-color-gray-600);
522
524
  --sky-color-text-default: var(--bb-color-gray-900);
523
- --sky-color-text-heading: var(--bb-color-blue-800);
525
+ --sky-color-text-heading: var(--bb-color-blue-900);
524
526
  --sky-color-text-inverse: var(--bb-color-white);
525
- --sky-color-text-link_highlighted: var(--bb-color-blue-800);
527
+ --sky-color-text-link_highlighted: var(--bb-color-blue-700);
526
528
  --sky-color-text-selected: var(--bb-color-blue-600);
527
- --sky-elevation-focus: var(--bb-shadow-gray-2);
529
+ --sky-elevation-action-danger-active: var(--bb-shadow-gray-0);
530
+ --sky-elevation-action-danger-base: var(--bb-shadow-gray-50);
531
+ --sky-elevation-action-danger-disabled: var(--bb-shadow-gray-0);
532
+ --sky-elevation-action-danger-focus: var(--bb-shadow-gray-50);
533
+ --sky-elevation-action-danger-hover: var(--bb-shadow-gray-50);
534
+ --sky-elevation-action-input-active: var(--bb-shadow-gray-25);
535
+ --sky-elevation-action-input-base: var(--bb-shadow-gray-25);
536
+ --sky-elevation-action-input-disabled: var(--bb-shadow-gray-0);
537
+ --sky-elevation-action-input-focus: var(--bb-shadow-gray-25);
538
+ --sky-elevation-action-input-hover: var(--bb-shadow-gray-25);
539
+ --sky-elevation-action-primary-active: var(--bb-shadow-gray-0);
540
+ --sky-elevation-action-primary-base: var(--bb-shadow-gray-50);
541
+ --sky-elevation-action-primary-disabled: var(--bb-shadow-gray-0);
542
+ --sky-elevation-action-primary-focus: var(--bb-shadow-gray-50);
543
+ --sky-elevation-action-primary-hover: var(--bb-shadow-gray-50);
544
+ --sky-elevation-action-secondary-active: var(--bb-shadow-gray-0);
545
+ --sky-elevation-action-secondary-base: var(--bb-shadow-gray-50);
546
+ --sky-elevation-action-secondary-disabled: var(--bb-shadow-gray-0);
547
+ --sky-elevation-action-secondary-focus: var(--bb-shadow-gray-50);
548
+ --sky-elevation-action-secondary-hover: var(--bb-shadow-gray-50);
549
+ --sky-elevation-action-tertiary-active: var(--bb-shadow-gray-0);
550
+ --sky-elevation-action-tertiary-base: var(--bb-shadow-gray-0);
551
+ --sky-elevation-action-tertiary-disabled: var(--bb-shadow-gray-0);
552
+ --sky-elevation-action-tertiary-focus: var(--bb-shadow-gray-0);
553
+ --sky-elevation-action-tertiary-hover: var(--bb-shadow-gray-50);
554
+ --sky-elevation-focus: var(--bb-shadow-gray-200);
555
+ --sky-elevation-input-base: var(--bb-shadow-gray-25);
556
+ --sky-elevation-input-disabled: var(--bb-shadow-gray-0);
528
557
  --sky-elevation-none: var(--bb-shadow-gray-0);
529
- --sky-elevation-overflow: var(--bb-shadow-gray-2);
530
- --sky-elevation-overlay-100: var(--bb-shadow-gray-4);
531
- --sky-elevation-overlay-200: var(--bb-shadow-gray-8);
532
- --sky-elevation-overlay-300: var(--bb-shadow-gray-16);
533
- --sky-elevation-overlay-400: var(--bb-shadow-gray-24);
534
- --sky-elevation-raised-100: var(--bb-shadow-gray-1);
558
+ --sky-elevation-overflow: var(--bb-shadow-gray-200);
559
+ --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
560
+ --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
561
+ --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
562
+ --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
563
+ --sky-elevation-raised-100: var(--bb-shadow-gray-100);
564
+ --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
535
565
  --sky-opacity-wait: var(--bb-opacity-600);
536
566
  }
537
567
  .sky-theme-modern.sky-theme-brand-base, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-xs, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-sm, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-md, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-lg {
@@ -554,7 +584,6 @@
554
584
  --sky-space-gap-stacked_supplemental-0: 0rem;
555
585
  --sky-space-gap-text_action-0: 0rem;
556
586
  --sky-space-inset-balanced-none: 0rem;
557
- --sky-space-inset-floated-top-0: 0rem;
558
587
  --sky-border-radius-0: var(--bb-border-radius-0);
559
588
  --sky-border-radius-m: var(--bb-border-radius-050);
560
589
  --sky-border-radius-pill: var(--bb-border-radius-pill);
@@ -567,7 +596,7 @@
567
596
  --sky-border-style-elevation: var(--bb-border-style-solid);
568
597
  --sky-border-style-separator-dark: var(--bb-border-style-solid);
569
598
  --sky-border-style-separator-light: var(--bb-border-style-solid);
570
- --sky-border-style-separator-row: var(--bb-border-style-dotted);
599
+ --sky-border-style-separator-row: var(--bb-border-style-solid);
571
600
  --sky-border-width-accent: var(--bb-size-fixed-37);
572
601
  --sky-border-width-action-active: var(--bb-size-fixed-12);
573
602
  --sky-border-width-action-base: var(--bb-size-fixed-6);
@@ -647,6 +676,10 @@
647
676
  --sky-comp-datepicker-header-space-inset-left: var(--bb-size-fluid-75);
648
677
  --sky-comp-datepicker-header-space-inset-right: var(--bb-size-fluid-75);
649
678
  --sky-comp-datepicker-header-space-inset-top: var(--bb-size-fluid-75);
679
+ --sky-comp-datepicker-m_y_button-space-inset-bottom: var(--bb-size-fluid-50);
680
+ --sky-comp-datepicker-m_y_button-space-inset-left: var(--bb-size-fluid-50);
681
+ --sky-comp-datepicker-m_y_button-space-inset-right: var(--bb-size-fluid-50);
682
+ --sky-comp-datepicker-m_y_button-space-inset-top: var(--bb-size-fluid-50);
650
683
  --sky-comp-dropdown-menu-space-inset-bottom: var(--bb-size-fluid-50);
651
684
  --sky-comp-dropdown-menu-space-inset-left: var(--bb-size-fluid-50);
652
685
  --sky-comp-dropdown-menu-space-inset-right: var(--bb-size-fluid-50);
@@ -900,65 +933,65 @@
900
933
  --sky-comp-wizard-tabset-tabs-space-inset-right: var(--bb-size-fluid-150);
901
934
  --sky-comp-wizard-tabset-tabs-space-inset-top: var(--bb-size-0);
902
935
  --sky-font-family-monospaced: var(--bb-font-monospaced-family);
903
- --sky-font-letter_spacing-hint-s: var(--bb-letter_spacing-normal);
936
+ --sky-font-letter_spacing-hint-s: var(--bb-letter_spacing-wider);
904
937
  --sky-font-letter_spacing-input-label: var(--bb-letter_spacing-wider);
905
- --sky-font-line_height-body-l: var(--bb-line_height-300);
906
- --sky-font-line_height-body-m: var(--bb-line_height-200);
907
- --sky-font-line_height-body-s: var(--bb-line_height-100);
908
- --sky-font-line_height-display-1: var(--bb-line_height-800);
909
- --sky-font-line_height-display-2: var(--bb-line_height-500);
910
- --sky-font-line_height-display-3: var(--bb-line_height-300);
911
- --sky-font-line_height-display-4: var(--bb-line_height-200);
912
- --sky-font-line_height-heading-1: var(--bb-line_height-500);
913
- --sky-font-line_height-heading-2: var(--bb-line_height-400);
914
- --sky-font-line_height-heading-3: var(--bb-line_height-300);
915
- --sky-font-line_height-heading-4: var(--bb-line_height-200);
916
- --sky-font-line_height-heading-5: var(--bb-line_height-200);
917
- --sky-font-line_height-hint-m: var(--bb-line_height-200);
918
- --sky-font-line_height-hint-s: var(--bb-line_height-100);
919
- --sky-font-line_height-input-label: var(--bb-line_height-100);
920
- --sky-font-line_height-input-val: var(--bb-line_height-200);
921
- --sky-font-size-body-l: var(--bb-font-size-300);
922
- --sky-font-size-body-m: var(--bb-font-size-200);
923
- --sky-font-size-body-s: var(--bb-font-size-100);
924
- --sky-font-size-display-1: var(--bb-font-size-800);
925
- --sky-font-size-display-2: var(--bb-font-size-500);
926
- --sky-font-size-display-3: var(--bb-font-size-300);
927
- --sky-font-size-display-4: var(--bb-font-size-200);
928
- --sky-font-size-heading-1: var(--bb-font-size-500);
929
- --sky-font-size-heading-2: var(--bb-font-size-400);
930
- --sky-font-size-heading-3: var(--bb-font-size-300);
931
- --sky-font-size-heading-4: var(--bb-font-size-200);
932
- --sky-font-size-heading-5: var(--bb-font-size-200);
933
- --sky-font-size-hint-m: var(--bb-font-size-200);
934
- --sky-font-size-hint-s: var(--bb-font-size-100);
935
- --sky-font-size-input-label: var(--bb-font-size-100);
936
- --sky-font-size-input-val: var(--bb-font-size-200);
938
+ --sky-font-line_height-body-l: var(--bb-line_height-500);
939
+ --sky-font-line_height-body-m: var(--bb-line_height-400);
940
+ --sky-font-line_height-body-s: var(--bb-line_height-300);
941
+ --sky-font-line_height-display-1: var(--bb-line_height-700);
942
+ --sky-font-line_height-display-2: var(--bb-line_height-600);
943
+ --sky-font-line_height-display-3: var(--bb-line_height-500);
944
+ --sky-font-line_height-display-4: var(--bb-line_height-400);
945
+ --sky-font-line_height-heading-1: var(--bb-line_height-800);
946
+ --sky-font-line_height-heading-2: var(--bb-line_height-600);
947
+ --sky-font-line_height-heading-3: var(--bb-line_height-500);
948
+ --sky-font-line_height-heading-4: var(--bb-line_height-400);
949
+ --sky-font-line_height-heading-5: var(--bb-line_height-400);
950
+ --sky-font-line_height-hint-m: var(--bb-line_height-400);
951
+ --sky-font-line_height-hint-s: var(--bb-line_height-300);
952
+ --sky-font-line_height-input-label: var(--bb-line_height-300);
953
+ --sky-font-line_height-input-val: var(--bb-line_height-400);
954
+ --sky-font-size-body-l: var(--bb-font-size-500);
955
+ --sky-font-size-body-m: var(--bb-font-size-400);
956
+ --sky-font-size-body-s: var(--bb-font-size-300);
957
+ --sky-font-size-display-1: var(--bb-font-size-700);
958
+ --sky-font-size-display-2: var(--bb-font-size-600);
959
+ --sky-font-size-display-3: var(--bb-font-size-500);
960
+ --sky-font-size-display-4: var(--bb-font-size-400);
961
+ --sky-font-size-heading-1: var(--bb-font-size-800);
962
+ --sky-font-size-heading-2: var(--bb-font-size-600);
963
+ --sky-font-size-heading-3: var(--bb-font-size-500);
964
+ --sky-font-size-heading-4: var(--bb-font-size-400);
965
+ --sky-font-size-heading-5: var(--bb-font-size-400);
966
+ --sky-font-size-hint-m: var(--bb-font-size-400);
967
+ --sky-font-size-hint-s: var(--bb-font-size-300);
968
+ --sky-font-size-input-label: var(--bb-font-size-300);
969
+ --sky-font-size-input-val: var(--bb-font-size-400);
937
970
  --sky-font-style-body-l: var(--bb-font-style-regular);
938
971
  --sky-font-style-body-m: var(--bb-font-style-regular);
939
972
  --sky-font-style-body-s: var(--bb-font-style-regular);
940
- --sky-font-style-display-1: var(--bb-font-style-light);
941
- --sky-font-style-display-2: var(--bb-font-style-light);
942
- --sky-font-style-display-3: var(--bb-font-style-light);
943
- --sky-font-style-display-4: var(--bb-font-style-light);
973
+ --sky-font-style-display-1: var(--bb-font-style-regular);
974
+ --sky-font-style-display-2: var(--bb-font-style-regular);
975
+ --sky-font-style-display-3: var(--bb-font-style-regular);
976
+ --sky-font-style-display-4: var(--bb-font-style-regular);
944
977
  --sky-font-style-emphasized: var(--bb-font-style-semibold);
945
- --sky-font-style-heading-1: var(--bb-font-style-regular);
946
- --sky-font-style-heading-2: var(--bb-font-style-regular);
947
- --sky-font-style-heading-3: var(--bb-font-style-regular);
978
+ --sky-font-style-heading-1: var(--bb-font-style-semibold);
979
+ --sky-font-style-heading-2: var(--bb-font-style-semibold);
980
+ --sky-font-style-heading-3: var(--bb-font-style-semibold);
948
981
  --sky-font-style-heading-4: var(--bb-font-style-semibold);
949
982
  --sky-font-style-heading-5: var(--bb-font-style-semibold);
950
983
  --sky-font-style-input-label: var(--bb-font-style-regular);
951
984
  --sky-font-weight-body-l: var(--bb-font-weight-regular);
952
985
  --sky-font-weight-body-m: var(--bb-font-weight-regular);
953
- --sky-font-weight-body-s: var(--bb-font-weight-regular);
954
- --sky-font-weight-display-1: var(--bb-font-weight-light);
955
- --sky-font-weight-display-2: var(--bb-font-weight-light);
956
- --sky-font-weight-display-3: var(--bb-font-weight-light);
957
- --sky-font-weight-display-4: var(--bb-font-weight-light);
986
+ --sky-font-weight-body-s: var(--bb-font-weight-semibold);
987
+ --sky-font-weight-display-1: var(--bb-font-weight-regular);
988
+ --sky-font-weight-display-2: var(--bb-font-weight-regular);
989
+ --sky-font-weight-display-3: var(--bb-font-weight-semibold);
990
+ --sky-font-weight-display-4: var(--bb-font-weight-semibold);
958
991
  --sky-font-weight-emphasized: var(--bb-font-weight-semibold);
959
992
  --sky-font-weight-heading-1: var(--bb-font-weight-regular);
960
- --sky-font-weight-heading-2: var(--bb-font-weight-regular);
961
- --sky-font-weight-heading-3: var(--bb-font-weight-regular);
993
+ --sky-font-weight-heading-2: var(--bb-font-weight-semibold);
994
+ --sky-font-weight-heading-3: var(--bb-font-weight-semibold);
962
995
  --sky-font-weight-heading-4: var(--bb-font-weight-semibold);
963
996
  --sky-font-weight-heading-5: var(--bb-font-weight-semibold);
964
997
  --sky-font-weight-hint-m: var(--bb-font-weight-regular);
@@ -1025,36 +1058,12 @@
1025
1058
  --sky-space-inline-xs: var(--bb-size-fluid-25);
1026
1059
  --sky-space-inline-xxl: var(--bb-size-fluid-300);
1027
1060
  --sky-space-inline-xxs: var(--bb-size-fluid-12);
1028
- --sky-space-inset-balanced-fixed-l: var(--bb-size-fixed-100);
1029
- --sky-space-inset-balanced-fixed-m: var(--bb-size-fixed-75);
1030
- --sky-space-inset-balanced-fixed-s: var(--bb-size-fixed-50);
1031
- --sky-space-inset-balanced-fixed-xl: var(--bb-size-fixed-150);
1032
1061
  --sky-space-inset-balanced-l: var(--bb-size-fluid-100);
1033
1062
  --sky-space-inset-balanced-m: var(--bb-size-fluid-75);
1034
1063
  --sky-space-inset-balanced-s: var(--bb-size-fluid-50);
1035
1064
  --sky-space-inset-balanced-xl: var(--bb-size-fluid-150);
1036
1065
  --sky-space-inset-balanced-xs: var(--bb-size-fluid-25);
1037
1066
  --sky-space-inset-balanced-xxs: var(--bb-size-fluid-12);
1038
- --sky-space-inset-bottomless-bottom-l: var(--bb-size-0);
1039
- --sky-space-inset-bottomless-bottom-m: var(--bb-size-0);
1040
- --sky-space-inset-bottomless-bottom-xl: var(--bb-size-0);
1041
- --sky-space-inset-bottomless-left-l: var(--bb-size-fluid-100);
1042
- --sky-space-inset-bottomless-left-m: var(--bb-size-fluid-75);
1043
- --sky-space-inset-bottomless-left-xl: var(--bb-size-fluid-150);
1044
- --sky-space-inset-bottomless-right-l: var(--bb-size-fluid-100);
1045
- --sky-space-inset-bottomless-right-m: var(--bb-size-fluid-75);
1046
- --sky-space-inset-bottomless-right-xl: var(--bb-size-fluid-150);
1047
- --sky-space-inset-bottomless-top-l: var(--bb-size-fluid-100);
1048
- --sky-space-inset-bottomless-top-m: var(--bb-size-fluid-75);
1049
- --sky-space-inset-bottomless-top-xl: var(--bb-size-fluid-150);
1050
- --sky-space-inset-floated-bottom-m: var(--bb-size-fluid-150);
1051
- --sky-space-inset-floated-bottom-s: var(--bb-size-fluid-100);
1052
- --sky-space-inset-floated-left-m: var(--bb-size-fluid-150);
1053
- --sky-space-inset-floated-left-s: var(--bb-size-fluid-100);
1054
- --sky-space-inset-floated-right-m: var(--bb-size-fluid-150);
1055
- --sky-space-inset-floated-right-s: var(--bb-size-fluid-100);
1056
- --sky-space-inset-floated-top-m: var(--bb-size-fluid-50);
1057
- --sky-space-inset-floated-top-s: var(--bb-size-fluid-25);
1058
1067
  --sky-space-inset-horizontal-bottom-0: var(--bb-size-0);
1059
1068
  --sky-space-inset-horizontal-bottom-l: var(--bb-size-0);
1060
1069
  --sky-space-inset-horizontal-bottom-m: var(--bb-size-0);
@@ -1075,68 +1084,10 @@
1075
1084
  --sky-space-inset-horizontal-top-m: var(--bb-size-0);
1076
1085
  --sky-space-inset-horizontal-top-s: var(--bb-size-0);
1077
1086
  --sky-space-inset-horizontal-top-xl: var(--bb-size-0);
1078
- --sky-space-inset-input-bottom-m: var(--bb-size-fluid-50);
1079
- --sky-space-inset-input-left-m: var(--bb-size-fluid-100);
1080
- --sky-space-inset-input-right-m: var(--bb-size-fluid-100);
1081
- --sky-space-inset-input-top-m: var(--bb-size-fluid-50);
1082
- --sky-space-inset-input_label-bottom-m: var(--bb-size-fluid-12);
1083
- --sky-space-inset-input_label-top-m: var(--bb-size-fluid-37);
1084
- --sky-space-inset-letterbox-1_2-bottom-m: var(--bb-size-fluid-100);
1085
- --sky-space-inset-letterbox-1_2-left-m: var(--bb-size-fluid-50);
1086
- --sky-space-inset-letterbox-1_2-right-m: var(--bb-size-fluid-50);
1087
- --sky-space-inset-letterbox-1_2-top-m: var(--bb-size-fluid-100);
1088
- --sky-space-inset-letterbox-1_3-bottom-m: var(--bb-size-fluid-150);
1089
- --sky-space-inset-letterbox-1_3-left-m: var(--bb-size-fluid-50);
1090
- --sky-space-inset-letterbox-1_3-right-m: var(--bb-size-fluid-50);
1091
- --sky-space-inset-letterbox-1_3-top-m: var(--bb-size-fluid-150);
1092
1087
  --sky-space-inset-letterbox-2_3-bottom-m: var(--bb-size-fluid-75);
1093
1088
  --sky-space-inset-letterbox-2_3-left-m: var(--bb-size-fluid-50);
1094
1089
  --sky-space-inset-letterbox-2_3-right-m: var(--bb-size-fluid-50);
1095
1090
  --sky-space-inset-letterbox-2_3-top-m: var(--bb-size-fluid-75);
1096
- --sky-space-inset-pillarbox-1_2-bottom-l: var(--bb-size-fluid-75);
1097
- --sky-space-inset-pillarbox-1_2-bottom-m: var(--bb-size-fluid-50);
1098
- --sky-space-inset-pillarbox-1_2-bottom-s: var(--bb-size-fluid-25);
1099
- --sky-space-inset-pillarbox-1_2-left-l: var(--bb-size-fluid-150);
1100
- --sky-space-inset-pillarbox-1_2-left-m: var(--bb-size-fluid-100);
1101
- --sky-space-inset-pillarbox-1_2-left-s: var(--bb-size-fluid-50);
1102
- --sky-space-inset-pillarbox-1_2-right-l: var(--bb-size-fluid-150);
1103
- --sky-space-inset-pillarbox-1_2-right-m: var(--bb-size-fluid-100);
1104
- --sky-space-inset-pillarbox-1_2-right-s: var(--bb-size-fluid-50);
1105
- --sky-space-inset-pillarbox-1_2-top-l: var(--bb-size-fluid-75);
1106
- --sky-space-inset-pillarbox-1_2-top-m: var(--bb-size-fluid-50);
1107
- --sky-space-inset-pillarbox-1_2-top-s: var(--bb-size-fluid-25);
1108
- --sky-space-inset-pillarbox-1_3-bottom-m: var(--bb-size-fluid-50);
1109
- --sky-space-inset-pillarbox-1_3-left-m: var(--bb-size-fluid-150);
1110
- --sky-space-inset-pillarbox-1_3-right-m: var(--bb-size-fluid-150);
1111
- --sky-space-inset-pillarbox-1_3-top-m: var(--bb-size-fluid-50);
1112
- --sky-space-inset-pillarbox-1_4-bottom-s: var(--bb-size-fluid-12);
1113
- --sky-space-inset-pillarbox-1_4-bottom-xs: var(--bb-size-fluid-6);
1114
- --sky-space-inset-pillarbox-1_4-left-s: var(--bb-size-fluid-50);
1115
- --sky-space-inset-pillarbox-1_4-left-xs: var(--bb-size-fluid-25);
1116
- --sky-space-inset-pillarbox-1_4-right-s: var(--bb-size-fluid-50);
1117
- --sky-space-inset-pillarbox-1_4-right-xs: var(--bb-size-fluid-25);
1118
- --sky-space-inset-pillarbox-1_4-top-s: var(--bb-size-fluid-12);
1119
- --sky-space-inset-pillarbox-1_4-top-xs: var(--bb-size-fluid-6);
1120
- --sky-space-inset-pillarbox-2_3-bottom-l: var(--bb-size-fluid-100);
1121
- --sky-space-inset-pillarbox-2_3-bottom-m: var(--bb-size-fluid-50);
1122
- --sky-space-inset-pillarbox-2_3-left-l: var(--bb-size-fluid-150);
1123
- --sky-space-inset-pillarbox-2_3-left-m: var(--bb-size-fluid-75);
1124
- --sky-space-inset-pillarbox-2_3-right-l: var(--bb-size-fluid-150);
1125
- --sky-space-inset-pillarbox-2_3-right-m: var(--bb-size-fluid-75);
1126
- --sky-space-inset-pillarbox-2_3-top-l: var(--bb-size-fluid-100);
1127
- --sky-space-inset-pillarbox-2_3-top-m: var(--bb-size-fluid-50);
1128
- --sky-space-inset-sunk-bottom-l: var(--bb-size-fluid-100);
1129
- --sky-space-inset-sunk-left-l: var(--bb-size-fluid-150);
1130
- --sky-space-inset-sunk-right-l: var(--bb-size-fluid-150);
1131
- --sky-space-inset-sunk-top-l: var(--bb-size-fluid-150);
1132
- --sky-space-inset-switch_icon-bottom: var(--bb-size-fluid-50);
1133
- --sky-space-inset-switch_icon-left: var(--bb-size-fluid-50);
1134
- --sky-space-inset-switch_icon-right: var(--bb-size-fluid-50);
1135
- --sky-space-inset-switch_icon-top: var(--bb-size-fluid-50);
1136
- --sky-space-inset-tabs-l: var(--bb-size-fluid-100);
1137
- --sky-space-inset-tabs-m: var(--bb-size-fluid-75);
1138
- --sky-space-inset-tabs-s: var(--bb-size-fluid-50);
1139
- --sky-space-inset-tabs-xl: var(--bb-size-fluid-150);
1140
1091
  --sky-space-inset-thumb: var(--bb-size-fixed-6);
1141
1092
  --sky-space-inset-thumbnail_matte-l: var(--bb-size-fluid-25);
1142
1093
  --sky-space-inset-thumbnail_matte-m: var(--bb-size-fluid-18);
@@ -1147,8 +1098,6 @@
1147
1098
  --sky-space-inset-vertical-bottom-m: var(--bb-size-fluid-75);
1148
1099
  --sky-space-inset-vertical-bottom-s: var(--bb-size-fluid-50);
1149
1100
  --sky-space-inset-vertical-bottom-xl: var(--bb-size-fluid-150);
1150
- --sky-space-inset-vertical-fixed-bottom-l: var(--bb-size-fixed-100);
1151
- --sky-space-inset-vertical-fixed-top-l: var(--bb-size-fixed-100);
1152
1101
  --sky-space-inset-vertical-left-0: var(--bb-size-0);
1153
1102
  --sky-space-inset-vertical-left-l: var(--bb-size-0);
1154
1103
  --sky-space-inset-vertical-left-m: var(--bb-size-0);
package/assets/scss/modern.css CHANGED
@@ -1,3 +1,9 @@
1
+ @property --modern-image-logo-primary-src {
2
+ syntax: '<url>';
3
+ inherits: true;
4
+ initial-value: url();
5
+ }
6
+
1
7
  .sky-theme-modern {
2
8
  --modern-border-radius-0: 0rem;
3
9
  --modern-border-radius-md: 6px;
@@ -67,6 +73,7 @@
67
73
  --modern-font-weight-light: 300;
68
74
  --modern-font-weight-regular: 400;
69
75
  --modern-font-weight-semibold: 600;
76
+ --modern-image-logo-primary-src: url('../images/bb-logo.png');
70
77
  --modern-letter_spacing-normal: normal;
71
78
  --modern-line_height-110: 1.1;
72
79
  --modern-line_height-115: 1.15;
@@ -270,8 +277,36 @@
270
277
  --sky-color-text-inverse: var(--modern-color-white);
271
278
  --sky-color-text-link_highlight: var(--modern-color-blue-80);
272
279
  --sky-color-text-selected: var(--modern-color-blue-74);
280
+ --sky-elevation-action-danger-active: var(--modern-shadow-size-0);
281
+ --sky-elevation-action-danger-base: var(--modern-shadow-size-0);
282
+ --sky-elevation-action-danger-disabled: var(--modern-shadow-size-0);
283
+ --sky-elevation-action-danger-hover: var(--modern-shadow-size-0);
284
+ --sky-elevation-action-input-active: var(--modern-shadow-size-0);
285
+ --sky-elevation-action-input-base: var(--modern-shadow-size-0);
286
+ --sky-elevation-action-input-disabled: var(--modern-shadow-size-0);
287
+ --sky-elevation-action-input-hover: var(--modern-shadow-size-0);
288
+ --sky-elevation-action-primary-active: var(--modern-shadow-size-0);
289
+ --sky-elevation-action-primary-base: var(--modern-shadow-size-0);
290
+ --sky-elevation-action-primary-disabled: var(--modern-shadow-size-0);
291
+ --sky-elevation-action-primary-hover: var(--modern-shadow-size-0);
292
+ --sky-elevation-action-secondary-active: var(--modern-shadow-size-0);
293
+ --sky-elevation-action-secondary-base: var(--modern-shadow-size-0);
294
+ --sky-elevation-action-secondary-disabled: var(--modern-shadow-size-0);
295
+ --sky-elevation-action-secondary-hover: var(--modern-shadow-size-0);
296
+ --sky-elevation-action-tertiary-active: var(--modern-shadow-size-0);
297
+ --sky-elevation-action-tertiary-base: var(--modern-shadow-size-0);
298
+ --sky-elevation-action-tertiary-disabled: var(--modern-shadow-size-0);
299
+ --sky-elevation-action-tertiary-hover: var(--modern-shadow-size-0);
300
+ --sky-elevation-input-base: var(--modern-shadow-size-0);
301
+ --sky-elevation-input-disabled: var(--modern-shadow-size-0);
273
302
  --sky-elevation-none: var(--modern-shadow-size-0);
303
+ --sky-image-logo-primary-src: var(--modern-image-logo-primary-src);
274
304
  --sky-opacity-wait: var(--modern-opacity-600);
305
+ --sky-elevation-action-danger-focus: var(--modern-shadow-size-3);
306
+ --sky-elevation-action-input-focus: var(--modern-shadow-size-3);
307
+ --sky-elevation-action-primary-focus: var(--modern-shadow-size-3);
308
+ --sky-elevation-action-secondary-focus: var(--modern-shadow-size-3);
309
+ --sky-elevation-action-tertiary-focus: var(--modern-shadow-size-3);
275
310
  --sky-elevation-focus: var(--modern-shadow-size-3);
276
311
  --sky-elevation-overflow: var(--modern-shadow-size-3);
277
312
  --sky-elevation-overlay-100: var(--modern-shadow-size-4);
@@ -392,6 +427,10 @@
392
427
  --sky-comp-datepicker-header-space-inset-left: var(--modern-size-15);
393
428
  --sky-comp-datepicker-header-space-inset-right: var(--modern-size-15);
394
429
  --sky-comp-datepicker-header-space-inset-top: var(--modern-size-15);
430
+ --sky-comp-datepicker-m_y_button-space-inset-bottom: var(--modern-size-5);
431
+ --sky-comp-datepicker-m_y_button-space-inset-left: var(--modern-size-10);
432
+ --sky-comp-datepicker-m_y_button-space-inset-right: var(--modern-size-10);
433
+ --sky-comp-datepicker-m_y_button-space-inset-top: var(--modern-size-5);
395
434
  --sky-comp-dropdown-menu-space-inset-bottom: var(--modern-size-10);
396
435
  --sky-comp-dropdown-menu-space-inset-left: var(--modern-size-0);
397
436
  --sky-comp-dropdown-menu-space-inset-right: var(--modern-size-0);
@@ -770,37 +809,12 @@
770
809
  --sky-space-inline-xs: var(--modern-space-xs);
771
810
  --sky-space-inline-xxl: var(--modern-space-xxl);
772
811
  --sky-space-inline-xxs: var(--modern-size-2);
773
- --sky-space-inset-balanced-fixed-l: var(--modern-size-20);
774
- --sky-space-inset-balanced-fixed-m: var(--modern-size-15);
775
- --sky-space-inset-balanced-fixed-s: var(--modern-size-10);
776
- --sky-space-inset-balanced-fixed-xl: var(--modern-size-30);
777
812
  --sky-space-inset-balanced-l: var(--modern-space-lg);
778
813
  --sky-space-inset-balanced-m: var(--modern-space-md);
779
814
  --sky-space-inset-balanced-s: var(--modern-space-s);
780
815
  --sky-space-inset-balanced-xl: var(--modern-space-xl);
781
816
  --sky-space-inset-balanced-xs: var(--modern-space-xs);
782
817
  --sky-space-inset-balanced-xxs: var(--modern-size-2);
783
- --sky-space-inset-bottomless-bottom-l: var(--modern-space-none);
784
- --sky-space-inset-bottomless-bottom-m: var(--modern-space-none);
785
- --sky-space-inset-bottomless-bottom-xl: var(--modern-space-none);
786
- --sky-space-inset-bottomless-left-l: var(--modern-space-lg);
787
- --sky-space-inset-bottomless-left-m: var(--modern-size-15);
788
- --sky-space-inset-bottomless-left-xl: var(--modern-space-xl);
789
- --sky-space-inset-bottomless-right-l: var(--modern-space-lg);
790
- --sky-space-inset-bottomless-right-m: var(--modern-size-15);
791
- --sky-space-inset-bottomless-right-xl: var(--modern-space-xl);
792
- --sky-space-inset-bottomless-top-l: var(--modern-space-lg);
793
- --sky-space-inset-bottomless-top-m: var(--modern-size-15);
794
- --sky-space-inset-bottomless-top-xl: var(--modern-space-xl);
795
- --sky-space-inset-floated-bottom-m: var(--modern-space-xl);
796
- --sky-space-inset-floated-bottom-s: var(--modern-space-lg);
797
- --sky-space-inset-floated-left-m: var(--modern-space-xl);
798
- --sky-space-inset-floated-left-s: var(--modern-space-lg);
799
- --sky-space-inset-floated-right-m: var(--modern-space-xl);
800
- --sky-space-inset-floated-right-s: var(--modern-space-lg);
801
- --sky-space-inset-floated-top-0: var(--modern-space-none);
802
- --sky-space-inset-floated-top-m: var(--modern-space-s);
803
- --sky-space-inset-floated-top-s: var(--modern-space-xs);
804
818
  --sky-space-inset-horizontal-bottom-0: var(--modern-space-none);
805
819
  --sky-space-inset-horizontal-bottom-l: var(--modern-size-0);
806
820
  --sky-space-inset-horizontal-bottom-m: var(--modern-size-0);
@@ -821,68 +835,10 @@
821
835
  --sky-space-inset-horizontal-top-m: var(--modern-size-0);
822
836
  --sky-space-inset-horizontal-top-s: var(--modern-size-0);
823
837
  --sky-space-inset-horizontal-top-xl: var(--modern-size-0);
824
- --sky-space-inset-input-bottom-m: var(--modern-size-9);
825
- --sky-space-inset-input-left-m: var(--modern-size-15);
826
- --sky-space-inset-input-right-m: var(--modern-size-15);
827
- --sky-space-inset-input-top-m: var(--modern-size-10);
828
- --sky-space-inset-input_label-bottom-m: var(--modern-size-2);
829
- --sky-space-inset-input_label-top-m: var(--modern-size-6);
830
- --sky-space-inset-letterbox-1_2-bottom-m: var(--modern-space-lg);
831
- --sky-space-inset-letterbox-1_2-left-m: var(--modern-space-s);
832
- --sky-space-inset-letterbox-1_2-right-m: var(--modern-space-s);
833
- --sky-space-inset-letterbox-1_2-top-m: var(--modern-space-lg);
834
- --sky-space-inset-letterbox-1_3-bottom-m: var(--modern-space-xl);
835
- --sky-space-inset-letterbox-1_3-left-m: var(--modern-space-s);
836
- --sky-space-inset-letterbox-1_3-right-m: var(--modern-space-s);
837
- --sky-space-inset-letterbox-1_3-top-m: var(--modern-space-xl);
838
838
  --sky-space-inset-letterbox-2_3-bottom-m: var(--modern-space-md);
839
839
  --sky-space-inset-letterbox-2_3-left-m: var(--modern-space-s);
840
840
  --sky-space-inset-letterbox-2_3-right-m: var(--modern-space-s);
841
841
  --sky-space-inset-letterbox-2_3-top-m: var(--modern-space-md);
842
- --sky-space-inset-pillarbox-1_2-bottom-l: var(--modern-size-15);
843
- --sky-space-inset-pillarbox-1_2-bottom-m: var(--modern-size-10);
844
- --sky-space-inset-pillarbox-1_2-bottom-s: var(--modern-size-5);
845
- --sky-space-inset-pillarbox-1_2-left-l: var(--modern-size-30);
846
- --sky-space-inset-pillarbox-1_2-left-m: var(--modern-size-20);
847
- --sky-space-inset-pillarbox-1_2-left-s: var(--modern-size-10);
848
- --sky-space-inset-pillarbox-1_2-right-l: var(--modern-size-30);
849
- --sky-space-inset-pillarbox-1_2-right-m: var(--modern-size-20);
850
- --sky-space-inset-pillarbox-1_2-right-s: var(--modern-size-10);
851
- --sky-space-inset-pillarbox-1_2-top-l: var(--modern-size-15);
852
- --sky-space-inset-pillarbox-1_2-top-m: var(--modern-size-10);
853
- --sky-space-inset-pillarbox-1_2-top-s: var(--modern-size-5);
854
- --sky-space-inset-pillarbox-1_3-bottom-m: var(--modern-size-10);
855
- --sky-space-inset-pillarbox-1_3-left-m: var(--modern-size-30);
856
- --sky-space-inset-pillarbox-1_3-right-m: var(--modern-size-30);
857
- --sky-space-inset-pillarbox-1_3-top-m: var(--modern-size-10);
858
- --sky-space-inset-pillarbox-1_4-bottom-s: var(--modern-size-4);
859
- --sky-space-inset-pillarbox-1_4-bottom-xs: var(--modern-size-1);
860
- --sky-space-inset-pillarbox-1_4-left-s: var(--modern-size-15);
861
- --sky-space-inset-pillarbox-1_4-left-xs: var(--modern-size-5);
862
- --sky-space-inset-pillarbox-1_4-right-s: var(--modern-size-15);
863
- --sky-space-inset-pillarbox-1_4-right-xs: var(--modern-size-5);
864
- --sky-space-inset-pillarbox-1_4-top-s: var(--modern-size-4);
865
- --sky-space-inset-pillarbox-1_4-top-xs: var(--modern-size-1);
866
- --sky-space-inset-pillarbox-2_3-bottom-l: var(--modern-size-20);
867
- --sky-space-inset-pillarbox-2_3-bottom-m: var(--modern-size-10);
868
- --sky-space-inset-pillarbox-2_3-left-l: var(--modern-size-30);
869
- --sky-space-inset-pillarbox-2_3-left-m: var(--modern-size-15);
870
- --sky-space-inset-pillarbox-2_3-right-l: var(--modern-size-30);
871
- --sky-space-inset-pillarbox-2_3-right-m: var(--modern-size-15);
872
- --sky-space-inset-pillarbox-2_3-top-l: var(--modern-size-20);
873
- --sky-space-inset-pillarbox-2_3-top-m: var(--modern-size-10);
874
- --sky-space-inset-sunk-bottom-l: var(--modern-space-lg);
875
- --sky-space-inset-sunk-left-l: var(--modern-space-xl);
876
- --sky-space-inset-sunk-right-l: var(--modern-space-xl);
877
- --sky-space-inset-sunk-top-l: var(--modern-space-xl);
878
- --sky-space-inset-switch_icon-bottom: var(--modern-space-s);
879
- --sky-space-inset-switch_icon-left: var(--modern-space-s);
880
- --sky-space-inset-switch_icon-right: var(--modern-space-s);
881
- --sky-space-inset-switch_icon-top: var(--modern-space-s);
882
- --sky-space-inset-tabs-l: var(--modern-space-lg);
883
- --sky-space-inset-tabs-m: var(--modern-space-md);
884
- --sky-space-inset-tabs-s: var(--modern-space-s);
885
- --sky-space-inset-tabs-xl: var(--modern-space-xl);
886
842
  --sky-space-inset-thumb: var(--modern-size-1);
887
843
  --sky-space-inset-thumbnail_matte-l: var(--modern-size-5);
888
844
  --sky-space-inset-thumbnail_matte-m: var(--modern-size-3);
@@ -893,8 +849,6 @@
893
849
  --sky-space-inset-vertical-bottom-m: var(--modern-space-md);
894
850
  --sky-space-inset-vertical-bottom-s: var(--modern-space-s);
895
851
  --sky-space-inset-vertical-bottom-xl: var(--modern-space-xl);
896
- --sky-space-inset-vertical-fixed-bottom-l: var(--modern-size-20);
897
- --sky-space-inset-vertical-fixed-top-l: var(--modern-size-20);
898
852
  --sky-space-inset-vertical-left-0: var(--modern-space-none);
899
853
  --sky-space-inset-vertical-left-l: var(--modern-size-0);
900
854
  --sky-space-inset-vertical-left-m: var(--modern-size-0);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blackbaud/skyux-design-tokens",
3
- "version": "0.0.64",
3
+ "version": "0.0.66",
4
4
  "description": "Design tokens for SKY UX",
5
5
  "homepage": "https://github.com/blackbaud/skyux-design-tokens",
6
6
  "license": "MIT",