@blackbaud/skyux-design-tokens 0.0.68 → 1.0.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 (5) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/assets/scss/blackbaud.css +261 -280
  3. package/assets/scss/modern.css +199 -226
  4. package/bundles/design-tokens.global.min.js +2 -2
  5. package/package.json +1 -1
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('data:,');
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('https://sky.blackbaudcdn.net/static/skyux-design-tokens/1.0.0/assets/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;
@@ -154,6 +161,11 @@
154
161
  --sky-color-background-action-tertiary-disabled: var(--modern-color-gray-07);
155
162
  --sky-color-background-action-tertiary-focus: var(--modern-color-transparent);
156
163
  --sky-color-background-action-tertiary-hover: var(--modern-color-transparent);
164
+ --sky-color-background-action-toolbar-active: var(--modern-color-transparent);
165
+ --sky-color-background-action-toolbar-base: var(--modern-color-transparent);
166
+ --sky-color-background-action-toolbar-disabled: var(--modern-color-gray-07);
167
+ --sky-color-background-action-toolbar-focus: var(--modern-color-transparent);
168
+ --sky-color-background-action-toolbar-hover: var(--modern-color-transparent);
157
169
  --sky-color-background-blocking: var(--modern-color-blocking);
158
170
  --sky-color-background-container-base: var(--modern-color-white);
159
171
  --sky-color-background-container-danger: var(--modern-color-red-30);
@@ -215,6 +227,11 @@
215
227
  --sky-color-border-action-tertiary-disabled: var(--modern-color-gray-15);
216
228
  --sky-color-border-action-tertiary-focus: var(--modern-color-blue-74);
217
229
  --sky-color-border-action-tertiary-hover: var(--modern-color-blue-74);
230
+ --sky-color-border-action-toolbar-active: var(--modern-color-blue-74);
231
+ --sky-color-border-action-toolbar-base: var(--modern-color-transparent);
232
+ --sky-color-border-action-toolbar-disabled: var(--modern-color-gray-15);
233
+ --sky-color-border-action-toolbar-focus: var(--modern-color-blue-74);
234
+ --sky-color-border-action-toolbar-hover: var(--modern-color-blue-74);
218
235
  --sky-color-border-column_divider: var(--modern-color-gray-70);
219
236
  --sky-color-border-container-base: var(--modern-color-gray-15);
220
237
  --sky-color-border-danger: var(--modern-color-red-50);
@@ -258,17 +275,18 @@
258
275
  --sky-color-icon-deemphasized: var(--modern-color-gray-70);
259
276
  --sky-color-icon-default: var(--modern-color-gray-105);
260
277
  --sky-color-icon-info: var(--modern-color-blue-50);
278
+ --sky-color-icon-input-action: var(--modern-color-gray-70);
261
279
  --sky-color-icon-inverse: var(--modern-color-white);
262
280
  --sky-color-icon-selected: var(--modern-color-blue-74);
263
281
  --sky-color-icon-success: var(--modern-color-green-50);
264
282
  --sky-color-icon-warning: var(--modern-color-yellow-50);
265
283
  --sky-color-text-action: var(--modern-color-blue-74);
284
+ --sky-color-text-action_contrast: var(--modern-color-blue-80);
266
285
  --sky-color-text-danger: var(--modern-color-red-70);
267
286
  --sky-color-text-deemphasized: var(--modern-color-gray-70);
268
287
  --sky-color-text-default: var(--modern-color-gray-105);
269
288
  --sky-color-text-heading: var(--modern-color-gray-105);
270
289
  --sky-color-text-inverse: var(--modern-color-white);
271
- --sky-color-text-link_highlight: var(--modern-color-blue-80);
272
290
  --sky-color-text-selected: var(--modern-color-blue-74);
273
291
  --sky-elevation-action-danger-active: var(--modern-shadow-size-0);
274
292
  --sky-elevation-action-danger-base: var(--modern-shadow-size-0);
@@ -290,15 +308,21 @@
290
308
  --sky-elevation-action-tertiary-base: var(--modern-shadow-size-0);
291
309
  --sky-elevation-action-tertiary-disabled: var(--modern-shadow-size-0);
292
310
  --sky-elevation-action-tertiary-hover: var(--modern-shadow-size-0);
311
+ --sky-elevation-action-toolbar-active: var(--modern-shadow-size-0);
312
+ --sky-elevation-action-toolbar-base: var(--modern-shadow-size-0);
313
+ --sky-elevation-action-toolbar-disabled: var(--modern-shadow-size-0);
314
+ --sky-elevation-action-toolbar-hover: var(--modern-shadow-size-0);
293
315
  --sky-elevation-input-base: var(--modern-shadow-size-0);
294
316
  --sky-elevation-input-disabled: var(--modern-shadow-size-0);
295
317
  --sky-elevation-none: var(--modern-shadow-size-0);
318
+ --sky-image-logo-primary-src: var(--modern-image-logo-primary-src);
296
319
  --sky-opacity-wait: var(--modern-opacity-600);
297
320
  --sky-elevation-action-danger-focus: var(--modern-shadow-size-3);
298
321
  --sky-elevation-action-input-focus: var(--modern-shadow-size-3);
299
322
  --sky-elevation-action-primary-focus: var(--modern-shadow-size-3);
300
323
  --sky-elevation-action-secondary-focus: var(--modern-shadow-size-3);
301
324
  --sky-elevation-action-tertiary-focus: var(--modern-shadow-size-3);
325
+ --sky-elevation-action-toolbar-focus: var(--modern-shadow-size-3);
302
326
  --sky-elevation-focus: var(--modern-shadow-size-3);
303
327
  --sky-elevation-overflow: var(--modern-shadow-size-3);
304
328
  --sky-elevation-overlay-100: var(--modern-shadow-size-4);
@@ -307,7 +331,7 @@
307
331
  --sky-elevation-overlay-400: var(--modern-shadow-size-24);
308
332
  --sky-elevation-raised-100: var(--modern-shadow-size-1);
309
333
  }
310
- .sky-theme-modern, .sky-theme-modern .sky-responsive-container-xs, .sky-theme-modern .sky-responsive-container-sm, .sky-theme-modern .sky-responsive-container-md, .sky-theme-modern .sky-responsive-container-lg {
334
+ .sky-theme-modern {
311
335
  --sky-font-style-deemphasized-style: italic;
312
336
  --sky-font-style-deemphasized-weight: 400;
313
337
  --sky-font-style-hint-m-style: italic;
@@ -407,6 +431,30 @@
407
431
  --sky-comp-button-toolbar-space-inset-left: var(--modern-size-10);
408
432
  --sky-comp-button-toolbar-space-inset-right: var(--modern-size-10);
409
433
  --sky-comp-button-toolbar-space-inset-top: var(--modern-size-10);
434
+ --sky-comp-card-large-actions-space-inset-bottom: var(--modern-size-10);
435
+ --sky-comp-card-large-actions-space-inset-left: var(--modern-size-30);
436
+ --sky-comp-card-large-actions-space-inset-right: var(--modern-size-30);
437
+ --sky-comp-card-large-actions-space-inset-top: var(--modern-size-10);
438
+ --sky-comp-card-large-content-space-inset-bottom: var(--modern-size-30);
439
+ --sky-comp-card-large-content-space-inset-left: var(--modern-size-30);
440
+ --sky-comp-card-large-content-space-inset-right: var(--modern-size-30);
441
+ --sky-comp-card-large-content-space-inset-top: var(--modern-size-30);
442
+ --sky-comp-card-large-header-space-inset-bottom: var(--modern-size-0);
443
+ --sky-comp-card-large-header-space-inset-left: var(--modern-size-30);
444
+ --sky-comp-card-large-header-space-inset-right: var(--modern-size-30);
445
+ --sky-comp-card-large-header-space-inset-top: var(--modern-size-30);
446
+ --sky-comp-card-small-actions-space-inset-bottom: var(--modern-size-10);
447
+ --sky-comp-card-small-actions-space-inset-left: var(--modern-size-15);
448
+ --sky-comp-card-small-actions-space-inset-right: var(--modern-size-15);
449
+ --sky-comp-card-small-actions-space-inset-top: var(--modern-size-10);
450
+ --sky-comp-card-small-content-space-inset-bottom: var(--modern-size-15);
451
+ --sky-comp-card-small-content-space-inset-left: var(--modern-size-15);
452
+ --sky-comp-card-small-content-space-inset-right: var(--modern-size-15);
453
+ --sky-comp-card-small-content-space-inset-top: var(--modern-size-15);
454
+ --sky-comp-card-small-header-space-inset-bottom: var(--modern-size-0);
455
+ --sky-comp-card-small-header-space-inset-left: var(--modern-size-15);
456
+ --sky-comp-card-small-header-space-inset-right: var(--modern-size-15);
457
+ --sky-comp-card-small-header-space-inset-top: var(--modern-size-15);
410
458
  --sky-comp-colorpicker-content-space-inset-bottom: var(--modern-size-15);
411
459
  --sky-comp-colorpicker-content-space-inset-left: var(--modern-size-30);
412
460
  --sky-comp-colorpicker-content-space-inset-right: var(--modern-size-30);
@@ -471,70 +519,126 @@
471
519
  --sky-comp-modal-footer-space-inset-left: var(--modern-size-30);
472
520
  --sky-comp-modal-footer-space-inset-right: var(--modern-size-30);
473
521
  --sky-comp-modal-footer-space-inset-top: var(--modern-size-20);
474
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-10);
475
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-10);
476
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-10);
477
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-10);
522
+ --sky-comp-modal-fullscreen-space-offset-sm-bottom: var(--modern-size-15);
523
+ --sky-comp-modal-fullscreen-space-offset-sm-left: var(--modern-size-15);
524
+ --sky-comp-modal-fullscreen-space-offset-sm-right: var(--modern-size-15);
525
+ --sky-comp-modal-fullscreen-space-offset-sm-top: var(--modern-size-15);
526
+ --sky-comp-modal-fullscreen-space-offset-xs-bottom: var(--modern-size-10);
527
+ --sky-comp-modal-fullscreen-space-offset-xs-left: var(--modern-size-10);
528
+ --sky-comp-modal-fullscreen-space-offset-xs-right: var(--modern-size-10);
529
+ --sky-comp-modal-fullscreen-space-offset-xs-top: var(--modern-size-10);
478
530
  --sky-comp-modal-header-space-inset-bottom: var(--modern-size-15);
479
531
  --sky-comp-modal-header-space-inset-left: var(--modern-size-30);
480
532
  --sky-comp-modal-header-space-inset-right: var(--modern-size-30);
481
533
  --sky-comp-modal-header-space-inset-top: var(--modern-size-15);
482
- --sky-comp-modal-space-offset-bottom: var(--modern-size-10);
483
- --sky-comp-modal-space-offset-left: var(--modern-size-10);
484
- --sky-comp-modal-space-offset-right: var(--modern-size-10);
485
- --sky-comp-modal-space-offset-top: var(--modern-size-10);
534
+ --sky-comp-modal-space-offset-sm-bottom: var(--modern-size-20);
535
+ --sky-comp-modal-space-offset-sm-left: var(--modern-size-20);
536
+ --sky-comp-modal-space-offset-sm-right: var(--modern-size-20);
537
+ --sky-comp-modal-space-offset-sm-top: var(--modern-size-20);
538
+ --sky-comp-modal-space-offset-xs-bottom: var(--modern-size-10);
539
+ --sky-comp-modal-space-offset-xs-left: var(--modern-size-10);
540
+ --sky-comp-modal-space-offset-xs-right: var(--modern-size-10);
541
+ --sky-comp-modal-space-offset-xs-top: var(--modern-size-10);
486
542
  --sky-comp-navbar_item-space-inset-bottom: var(--modern-space-md);
487
543
  --sky-comp-navbar_item-space-inset-left: var(--modern-space-s);
488
544
  --sky-comp-navbar_item-space-inset-right: var(--modern-space-s);
489
545
  --sky-comp-navbar_item-space-inset-top: var(--modern-space-md);
490
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-s);
491
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-s);
492
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-s);
493
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-s);
494
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
495
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-s);
496
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-s);
497
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
498
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
499
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-s);
500
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-s);
501
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
502
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
503
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
504
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
505
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
506
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-space-lg);
507
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-s);
508
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-s);
509
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-lg);
510
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
511
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-s);
512
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-s);
513
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-lg);
514
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
515
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-s);
516
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-s);
517
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-lg);
518
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
519
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-s);
520
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-s);
521
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-lg);
522
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
523
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-s);
524
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-s);
525
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
526
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
527
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-s);
528
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-s);
529
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
530
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
531
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-s);
532
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-s);
533
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
534
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
535
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-md);
536
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
537
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
546
+ --sky-comp-page-content-blocks-space-inset-sm-bottom: var(--modern-space-xl);
547
+ --sky-comp-page-content-blocks-space-inset-sm-left: var(--modern-space-xl);
548
+ --sky-comp-page-content-blocks-space-inset-sm-right: var(--modern-space-xl);
549
+ --sky-comp-page-content-blocks-space-inset-sm-top: var(--modern-space-xl);
550
+ --sky-comp-page-content-blocks-space-inset-xs-bottom: var(--modern-space-s);
551
+ --sky-comp-page-content-blocks-space-inset-xs-left: var(--modern-space-s);
552
+ --sky-comp-page-content-blocks-space-inset-xs-right: var(--modern-space-s);
553
+ --sky-comp-page-content-blocks-space-inset-xs-top: var(--modern-space-s);
554
+ --sky-comp-page-content-fit-space-inset-sm-bottom: var(--modern-size-0);
555
+ --sky-comp-page-content-fit-space-inset-sm-left: var(--modern-space-xl);
556
+ --sky-comp-page-content-fit-space-inset-sm-right: var(--modern-space-xl);
557
+ --sky-comp-page-content-fit-space-inset-sm-top: var(--modern-size-0);
558
+ --sky-comp-page-content-fit-space-inset-xs-bottom: var(--modern-size-0);
559
+ --sky-comp-page-content-fit-space-inset-xs-left: var(--modern-space-s);
560
+ --sky-comp-page-content-fit-space-inset-xs-right: var(--modern-space-s);
561
+ --sky-comp-page-content-fit-space-inset-xs-top: var(--modern-size-0);
562
+ --sky-comp-page-content-list-space-inset-sm-bottom: var(--modern-size-0);
563
+ --sky-comp-page-content-list-space-inset-sm-left: var(--modern-space-xl);
564
+ --sky-comp-page-content-list-space-inset-sm-right: var(--modern-space-xl);
565
+ --sky-comp-page-content-list-space-inset-sm-top: var(--modern-size-0);
566
+ --sky-comp-page-content-list-space-inset-xs-bottom: var(--modern-size-0);
567
+ --sky-comp-page-content-list-space-inset-xs-left: var(--modern-space-s);
568
+ --sky-comp-page-content-list-space-inset-xs-right: var(--modern-space-s);
569
+ --sky-comp-page-content-list-space-inset-xs-top: var(--modern-size-0);
570
+ --sky-comp-page-content-tabs-space-inset-sm-bottom: var(--modern-size-0);
571
+ --sky-comp-page-content-tabs-space-inset-sm-left: var(--modern-size-0);
572
+ --sky-comp-page-content-tabs-space-inset-sm-right: var(--modern-size-0);
573
+ --sky-comp-page-content-tabs-space-inset-sm-top: var(--modern-size-0);
574
+ --sky-comp-page-content-tabs-space-inset-xs-bottom: var(--modern-size-0);
575
+ --sky-comp-page-content-tabs-space-inset-xs-left: var(--modern-size-0);
576
+ --sky-comp-page-content-tabs-space-inset-xs-right: var(--modern-size-0);
577
+ --sky-comp-page-content-tabs-space-inset-xs-top: var(--modern-size-0);
578
+ --sky-comp-page-header-blocks-space-inset-sm-bottom: var(--modern-size-0);
579
+ --sky-comp-page-header-blocks-space-inset-sm-left: var(--modern-space-xl);
580
+ --sky-comp-page-header-blocks-space-inset-sm-right: var(--modern-space-xl);
581
+ --sky-comp-page-header-blocks-space-inset-sm-top: var(--modern-space-xl);
582
+ --sky-comp-page-header-blocks-space-inset-xs-bottom: var(--modern-space-lg);
583
+ --sky-comp-page-header-blocks-space-inset-xs-left: var(--modern-space-s);
584
+ --sky-comp-page-header-blocks-space-inset-xs-right: var(--modern-space-s);
585
+ --sky-comp-page-header-blocks-space-inset-xs-top: var(--modern-space-lg);
586
+ --sky-comp-page-header-fit-space-inset-sm-bottom: var(--modern-space-lg);
587
+ --sky-comp-page-header-fit-space-inset-sm-left: var(--modern-space-xl);
588
+ --sky-comp-page-header-fit-space-inset-sm-right: var(--modern-space-xl);
589
+ --sky-comp-page-header-fit-space-inset-sm-top: var(--modern-space-xl);
590
+ --sky-comp-page-header-fit-space-inset-xs-bottom: var(--modern-space-lg);
591
+ --sky-comp-page-header-fit-space-inset-xs-left: var(--modern-space-s);
592
+ --sky-comp-page-header-fit-space-inset-xs-right: var(--modern-space-s);
593
+ --sky-comp-page-header-fit-space-inset-xs-top: var(--modern-space-lg);
594
+ --sky-comp-page-header-list-space-inset-sm-bottom: var(--modern-space-lg);
595
+ --sky-comp-page-header-list-space-inset-sm-left: var(--modern-space-xl);
596
+ --sky-comp-page-header-list-space-inset-sm-right: var(--modern-space-xl);
597
+ --sky-comp-page-header-list-space-inset-sm-top: var(--modern-space-xl);
598
+ --sky-comp-page-header-list-space-inset-xs-bottom: var(--modern-space-lg);
599
+ --sky-comp-page-header-list-space-inset-xs-left: var(--modern-space-s);
600
+ --sky-comp-page-header-list-space-inset-xs-right: var(--modern-space-s);
601
+ --sky-comp-page-header-list-space-inset-xs-top: var(--modern-space-lg);
602
+ --sky-comp-page-header-tabs-space-inset-sm-bottom: var(--modern-space-lg);
603
+ --sky-comp-page-header-tabs-space-inset-sm-left: var(--modern-space-xl);
604
+ --sky-comp-page-header-tabs-space-inset-sm-right: var(--modern-space-xl);
605
+ --sky-comp-page-header-tabs-space-inset-sm-top: var(--modern-space-xl);
606
+ --sky-comp-page-header-tabs-space-inset-xs-bottom: var(--modern-space-lg);
607
+ --sky-comp-page-header-tabs-space-inset-xs-left: var(--modern-space-s);
608
+ --sky-comp-page-header-tabs-space-inset-xs-right: var(--modern-space-s);
609
+ --sky-comp-page-header-tabs-space-inset-xs-top: var(--modern-space-lg);
610
+ --sky-comp-page-links-blocks-space-inset-sm-bottom: var(--modern-space-xl);
611
+ --sky-comp-page-links-blocks-space-inset-sm-left: var(--modern-space-xl);
612
+ --sky-comp-page-links-blocks-space-inset-sm-right: var(--modern-space-xl);
613
+ --sky-comp-page-links-blocks-space-inset-sm-top: var(--modern-space-xl);
614
+ --sky-comp-page-links-blocks-space-inset-xs-bottom: var(--modern-space-xl);
615
+ --sky-comp-page-links-blocks-space-inset-xs-left: var(--modern-space-s);
616
+ --sky-comp-page-links-blocks-space-inset-xs-right: var(--modern-space-s);
617
+ --sky-comp-page-links-blocks-space-inset-xs-top: var(--modern-space-xl);
618
+ --sky-comp-page-links-list-space-inset-sm-bottom: var(--modern-space-xl);
619
+ --sky-comp-page-links-list-space-inset-sm-left: var(--modern-space-xl);
620
+ --sky-comp-page-links-list-space-inset-sm-right: var(--modern-space-xl);
621
+ --sky-comp-page-links-list-space-inset-sm-top: var(--modern-space-xl);
622
+ --sky-comp-page-links-list-space-inset-xs-bottom: var(--modern-space-xl);
623
+ --sky-comp-page-links-list-space-inset-xs-left: var(--modern-space-s);
624
+ --sky-comp-page-links-list-space-inset-xs-right: var(--modern-space-s);
625
+ --sky-comp-page-links-list-space-inset-xs-top: var(--modern-space-xl);
626
+ --sky-comp-page-links-tabs-space-inset-sm-bottom: var(--modern-space-xl);
627
+ --sky-comp-page-links-tabs-space-inset-sm-left: var(--modern-space-xl);
628
+ --sky-comp-page-links-tabs-space-inset-sm-right: var(--modern-space-xl);
629
+ --sky-comp-page-links-tabs-space-inset-sm-top: var(--modern-space-xl);
630
+ --sky-comp-page-links-tabs-space-inset-xs-bottom: var(--modern-space-xl);
631
+ --sky-comp-page-links-tabs-space-inset-xs-left: var(--modern-space-s);
632
+ --sky-comp-page-links-tabs-space-inset-xs-right: var(--modern-space-s);
633
+ --sky-comp-page-links-tabs-space-inset-xs-top: var(--modern-space-xl);
634
+ --sky-comp-page-tabset-tabs-space-inset-sm-bottom: var(--modern-size-0);
635
+ --sky-comp-page-tabset-tabs-space-inset-sm-left: var(--modern-space-xl);
636
+ --sky-comp-page-tabset-tabs-space-inset-sm-right: var(--modern-size-0);
637
+ --sky-comp-page-tabset-tabs-space-inset-sm-top: var(--modern-size-0);
638
+ --sky-comp-page-tabset-tabs-space-inset-xs-bottom: var(--modern-size-0);
639
+ --sky-comp-page-tabset-tabs-space-inset-xs-left: var(--modern-space-md);
640
+ --sky-comp-page-tabset-tabs-space-inset-xs-right: var(--modern-size-0);
641
+ --sky-comp-page-tabset-tabs-space-inset-xs-top: var(--modern-size-0);
538
642
  --sky-comp-paging_button-space-inset-bottom: var(--modern-size-4);
539
643
  --sky-comp-paging_button-space-inset-left: var(--modern-size-15);
540
644
  --sky-comp-paging_button-space-inset-right: var(--modern-size-15);
@@ -547,6 +651,10 @@
547
651
  --sky-comp-popover-header-space-inset-left: var(--modern-space-lg);
548
652
  --sky-comp-popover-header-space-inset-right: var(--modern-space-lg);
549
653
  --sky-comp-popover-header-space-inset-top: var(--modern-space-lg);
654
+ --sky-comp-repeater_item-checkbox-space-offset-bottom: var(--modern-size-0);
655
+ --sky-comp-repeater_item-checkbox-space-offset-left: var(--modern-size-0);
656
+ --sky-comp-repeater_item-checkbox-space-offset-right: var(--modern-size-0);
657
+ --sky-comp-repeater_item-checkbox-space-offset-top: var(--modern-size-0);
550
658
  --sky-comp-repeater_item-space-inset-bottom: var(--modern-space-md);
551
659
  --sky-comp-repeater_item-space-inset-left: var(--modern-space-s);
552
660
  --sky-comp-repeater_item-space-inset-right: var(--modern-space-s);
@@ -563,10 +671,14 @@
563
671
  --sky-comp-sab-summary-inline-space-inset-left: var(--modern-size-30);
564
672
  --sky-comp-sab-summary-inline-space-inset-right: var(--modern-size-30);
565
673
  --sky-comp-sab-summary-inline-space-inset-top: var(--modern-size-10);
566
- --sky-comp-search-space-inset-bottom: var(--modern-size-10);
567
- --sky-comp-search-space-inset-left: var(--modern-size-10);
568
- --sky-comp-search-space-inset-right: var(--modern-size-10);
569
- --sky-comp-search-space-inset-top: var(--modern-size-10);
674
+ --sky-comp-search-space-inset-sm-bottom: var(--modern-space-s);
675
+ --sky-comp-search-space-inset-sm-left: var(--modern-space-s);
676
+ --sky-comp-search-space-inset-sm-right: var(--modern-space-s);
677
+ --sky-comp-search-space-inset-sm-top: var(--modern-space-s);
678
+ --sky-comp-search-space-inset-xs-bottom: var(--modern-size-10);
679
+ --sky-comp-search-space-inset-xs-left: var(--modern-size-10);
680
+ --sky-comp-search-space-inset-xs-right: var(--modern-size-10);
681
+ --sky-comp-search-space-inset-xs-top: var(--modern-size-10);
570
682
  --sky-comp-search-space-offset-bottom: var(--modern-size-5);
571
683
  --sky-comp-search-space-offset-left: var(--modern-size-5);
572
684
  --sky-comp-search-space-offset-right: var(--modern-size-5);
@@ -587,10 +699,14 @@
587
699
  --sky-comp-tab-horizontal-space-inset-left: var(--modern-size-15);
588
700
  --sky-comp-tab-horizontal-space-inset-right: var(--modern-size-15);
589
701
  --sky-comp-tab-horizontal-space-inset-top: var(--modern-size-10);
590
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-15);
591
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
592
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
593
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-15);
702
+ --sky-comp-tab-vertical-content-space-inset-sm-bottom: var(--modern-size-10);
703
+ --sky-comp-tab-vertical-content-space-inset-sm-left: var(--modern-size-15);
704
+ --sky-comp-tab-vertical-content-space-inset-sm-right: var(--modern-size-15);
705
+ --sky-comp-tab-vertical-content-space-inset-sm-top: var(--modern-size-10);
706
+ --sky-comp-tab-vertical-content-space-inset-xs-bottom: var(--modern-size-15);
707
+ --sky-comp-tab-vertical-content-space-inset-xs-left: var(--modern-size-15);
708
+ --sky-comp-tab-vertical-content-space-inset-xs-right: var(--modern-size-15);
709
+ --sky-comp-tab-vertical-content-space-inset-xs-top: var(--modern-size-15);
594
710
  --sky-comp-tab-vertical-group-button-space-inset-bottom: var(--modern-space-s);
595
711
  --sky-comp-tab-vertical-group-button-space-inset-left: var(--modern-space-s);
596
712
  --sky-comp-tab-vertical-group-button-space-inset-right: var(--modern-space-s);
@@ -615,14 +731,22 @@
615
731
  --sky-comp-text_editor-space-inset-left: var(--modern-space-md);
616
732
  --sky-comp-text_editor-space-inset-right: var(--modern-space-md);
617
733
  --sky-comp-text_editor-space-inset-top: var(--modern-space-md);
618
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
619
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-size-0);
620
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-size-0);
621
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
622
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
623
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-size-0);
624
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-size-0);
625
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
734
+ --sky-comp-tile-dashboard-column-space-inset-sm-bottom: var(--modern-size-0);
735
+ --sky-comp-tile-dashboard-column-space-inset-sm-left: var(--modern-space-md);
736
+ --sky-comp-tile-dashboard-column-space-inset-sm-right: var(--modern-space-md);
737
+ --sky-comp-tile-dashboard-column-space-inset-sm-top: var(--modern-size-0);
738
+ --sky-comp-tile-dashboard-column-space-inset-xs-bottom: var(--modern-size-0);
739
+ --sky-comp-tile-dashboard-column-space-inset-xs-left: var(--modern-size-0);
740
+ --sky-comp-tile-dashboard-column-space-inset-xs-right: var(--modern-size-0);
741
+ --sky-comp-tile-dashboard-column-space-inset-xs-top: var(--modern-size-0);
742
+ --sky-comp-tile-dashboard-space-inset-sm-bottom: var(--modern-size-0);
743
+ --sky-comp-tile-dashboard-space-inset-sm-left: var(--modern-space-s);
744
+ --sky-comp-tile-dashboard-space-inset-sm-right: var(--modern-space-s);
745
+ --sky-comp-tile-dashboard-space-inset-sm-top: var(--modern-size-0);
746
+ --sky-comp-tile-dashboard-space-inset-xs-bottom: var(--modern-size-0);
747
+ --sky-comp-tile-dashboard-space-inset-xs-left: var(--modern-size-0);
748
+ --sky-comp-tile-dashboard-space-inset-xs-right: var(--modern-size-0);
749
+ --sky-comp-tile-dashboard-space-inset-xs-top: var(--modern-size-0);
626
750
  --sky-comp-tile-section-space-inset-bottom: var(--modern-space-md);
627
751
  --sky-comp-tile-section-space-inset-left: var(--modern-size-0);
628
752
  --sky-comp-tile-section-space-inset-right: var(--modern-size-0);
@@ -789,6 +913,7 @@
789
913
  --sky-space-gap-stacked_supplemental-m: var(--modern-size-10);
790
914
  --sky-space-gap-stacked_supplemental-s: var(--modern-size-5);
791
915
  --sky-space-gap-stacked_supplemental-xl: var(--modern-size-20);
916
+ --sky-space-gap-stacked_supplemental-xs: var(--modern-size-5);
792
917
  --sky-space-gap-text_action-l: var(--modern-space-lg);
793
918
  --sky-space-gap-text_action-m: var(--modern-space-md);
794
919
  --sky-space-gap-text_action-s: var(--modern-space-s);
@@ -866,155 +991,3 @@
866
991
  --sky-font-family-primary: var(--modern-font-blkb_sans-family);
867
992
  --sky-space-inset-switch: calc(var(--sky-size-switch) + var(--sky-space-gap-label-s));
868
993
  }
869
-
870
- @media (min-width: 768px) {
871
- .sky-theme-modern {
872
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
873
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
874
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
875
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
876
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
877
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
878
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
879
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
880
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
881
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
882
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
883
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
884
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
885
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
886
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
887
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
888
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
889
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
890
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
891
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
892
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
893
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
894
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
895
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
896
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
897
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
898
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
899
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
900
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
901
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
902
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
903
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
904
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
905
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
906
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
907
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
908
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
909
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
910
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
911
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
912
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
913
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
914
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
915
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
916
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
917
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
918
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
919
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
920
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
921
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
922
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
923
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
924
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
925
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
926
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
927
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
928
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
929
- --sky-comp-search-space-inset-left: var(--modern-space-s);
930
- --sky-comp-search-space-inset-right: var(--modern-space-s);
931
- --sky-comp-search-space-inset-top: var(--modern-space-s);
932
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
933
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
934
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
935
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
936
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
937
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
938
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
939
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
940
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
941
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
942
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
943
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
944
- }
945
- }
946
- .sky-theme-modern .sky-responsive-container-sm, .sky-theme-modern .sky-responsive-container-md, .sky-theme-modern .sky-responsive-container-lg {
947
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
948
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
949
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
950
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
951
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
952
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
953
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
954
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
955
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
956
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
957
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
958
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
959
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
960
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
961
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
962
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
963
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
964
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
965
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
966
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
967
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
968
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
969
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
970
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
971
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
972
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
973
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
974
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
975
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
976
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
977
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
978
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
979
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
980
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
981
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
982
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
983
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
984
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
985
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
986
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
987
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
988
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
989
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
990
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
991
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
992
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
993
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
994
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
995
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
996
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
997
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
998
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
999
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
1000
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
1001
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
1002
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
1003
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
1004
- --sky-comp-search-space-inset-left: var(--modern-space-s);
1005
- --sky-comp-search-space-inset-right: var(--modern-space-s);
1006
- --sky-comp-search-space-inset-top: var(--modern-space-s);
1007
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
1008
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
1009
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
1010
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
1011
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
1012
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
1013
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
1014
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
1015
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
1016
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
1017
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
1018
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
1019
- }
1020
-
package/bundles/design-tokens.global.min.js CHANGED
@@ -1,7 +1,7 @@
1
1
  document.body.classList.add(
2
2
  "local-dev-tokens",
3
- "sky-theme-mode-dark",
3
+ "sky-theme-mode-light",
4
4
  "sky-theme-modern",
5
5
  "sky-theme-brand-base"
6
6
  );
7
- document.body.classList.remove("sky-theme-mode-light", "sky-theme-default");
7
+ document.body.classList.remove("sky-theme-mode-dark", "sky-theme-default");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blackbaud/skyux-design-tokens",
3
- "version": "0.0.68",
3
+ "version": "1.0.0",
4
4
  "description": "Design tokens for SKY UX",
5
5
  "homepage": "https://github.com/blackbaud/skyux-design-tokens",
6
6
  "license": "MIT",