@blackbaud/skyux-design-tokens 0.0.69 → 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 +24 -0
  2. package/assets/scss/blackbaud.css +254 -281
  3. package/assets/scss/modern.css +192 -227
  4. package/bundles/design-tokens.global.min.js +2 -2
  5. package/package.json +1 -1
package/assets/scss/modern.css CHANGED
@@ -73,7 +73,7 @@
73
73
  --modern-font-weight-light: 300;
74
74
  --modern-font-weight-regular: 400;
75
75
  --modern-font-weight-semibold: 600;
76
- --modern-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/0.0.69/assets/images/bb-logo.png');
76
+ --modern-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/1.0.0/assets/images/bb-logo.png');
77
77
  --modern-letter_spacing-normal: normal;
78
78
  --modern-line_height-110: 1.1;
79
79
  --modern-line_height-115: 1.15;
@@ -161,6 +161,11 @@
161
161
  --sky-color-background-action-tertiary-disabled: var(--modern-color-gray-07);
162
162
  --sky-color-background-action-tertiary-focus: var(--modern-color-transparent);
163
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);
164
169
  --sky-color-background-blocking: var(--modern-color-blocking);
165
170
  --sky-color-background-container-base: var(--modern-color-white);
166
171
  --sky-color-background-container-danger: var(--modern-color-red-30);
@@ -222,6 +227,11 @@
222
227
  --sky-color-border-action-tertiary-disabled: var(--modern-color-gray-15);
223
228
  --sky-color-border-action-tertiary-focus: var(--modern-color-blue-74);
224
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);
225
235
  --sky-color-border-column_divider: var(--modern-color-gray-70);
226
236
  --sky-color-border-container-base: var(--modern-color-gray-15);
227
237
  --sky-color-border-danger: var(--modern-color-red-50);
@@ -265,17 +275,18 @@
265
275
  --sky-color-icon-deemphasized: var(--modern-color-gray-70);
266
276
  --sky-color-icon-default: var(--modern-color-gray-105);
267
277
  --sky-color-icon-info: var(--modern-color-blue-50);
278
+ --sky-color-icon-input-action: var(--modern-color-gray-70);
268
279
  --sky-color-icon-inverse: var(--modern-color-white);
269
280
  --sky-color-icon-selected: var(--modern-color-blue-74);
270
281
  --sky-color-icon-success: var(--modern-color-green-50);
271
282
  --sky-color-icon-warning: var(--modern-color-yellow-50);
272
283
  --sky-color-text-action: var(--modern-color-blue-74);
284
+ --sky-color-text-action_contrast: var(--modern-color-blue-80);
273
285
  --sky-color-text-danger: var(--modern-color-red-70);
274
286
  --sky-color-text-deemphasized: var(--modern-color-gray-70);
275
287
  --sky-color-text-default: var(--modern-color-gray-105);
276
288
  --sky-color-text-heading: var(--modern-color-gray-105);
277
289
  --sky-color-text-inverse: var(--modern-color-white);
278
- --sky-color-text-link_highlight: var(--modern-color-blue-80);
279
290
  --sky-color-text-selected: var(--modern-color-blue-74);
280
291
  --sky-elevation-action-danger-active: var(--modern-shadow-size-0);
281
292
  --sky-elevation-action-danger-base: var(--modern-shadow-size-0);
@@ -297,6 +308,10 @@
297
308
  --sky-elevation-action-tertiary-base: var(--modern-shadow-size-0);
298
309
  --sky-elevation-action-tertiary-disabled: var(--modern-shadow-size-0);
299
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);
300
315
  --sky-elevation-input-base: var(--modern-shadow-size-0);
301
316
  --sky-elevation-input-disabled: var(--modern-shadow-size-0);
302
317
  --sky-elevation-none: var(--modern-shadow-size-0);
@@ -307,6 +322,7 @@
307
322
  --sky-elevation-action-primary-focus: var(--modern-shadow-size-3);
308
323
  --sky-elevation-action-secondary-focus: var(--modern-shadow-size-3);
309
324
  --sky-elevation-action-tertiary-focus: var(--modern-shadow-size-3);
325
+ --sky-elevation-action-toolbar-focus: var(--modern-shadow-size-3);
310
326
  --sky-elevation-focus: var(--modern-shadow-size-3);
311
327
  --sky-elevation-overflow: var(--modern-shadow-size-3);
312
328
  --sky-elevation-overlay-100: var(--modern-shadow-size-4);
@@ -315,7 +331,7 @@
315
331
  --sky-elevation-overlay-400: var(--modern-shadow-size-24);
316
332
  --sky-elevation-raised-100: var(--modern-shadow-size-1);
317
333
  }
318
- .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 {
319
335
  --sky-font-style-deemphasized-style: italic;
320
336
  --sky-font-style-deemphasized-weight: 400;
321
337
  --sky-font-style-hint-m-style: italic;
@@ -415,6 +431,30 @@
415
431
  --sky-comp-button-toolbar-space-inset-left: var(--modern-size-10);
416
432
  --sky-comp-button-toolbar-space-inset-right: var(--modern-size-10);
417
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);
418
458
  --sky-comp-colorpicker-content-space-inset-bottom: var(--modern-size-15);
419
459
  --sky-comp-colorpicker-content-space-inset-left: var(--modern-size-30);
420
460
  --sky-comp-colorpicker-content-space-inset-right: var(--modern-size-30);
@@ -479,70 +519,126 @@
479
519
  --sky-comp-modal-footer-space-inset-left: var(--modern-size-30);
480
520
  --sky-comp-modal-footer-space-inset-right: var(--modern-size-30);
481
521
  --sky-comp-modal-footer-space-inset-top: var(--modern-size-20);
482
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-10);
483
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-10);
484
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-10);
485
- --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);
486
530
  --sky-comp-modal-header-space-inset-bottom: var(--modern-size-15);
487
531
  --sky-comp-modal-header-space-inset-left: var(--modern-size-30);
488
532
  --sky-comp-modal-header-space-inset-right: var(--modern-size-30);
489
533
  --sky-comp-modal-header-space-inset-top: var(--modern-size-15);
490
- --sky-comp-modal-space-offset-bottom: var(--modern-size-10);
491
- --sky-comp-modal-space-offset-left: var(--modern-size-10);
492
- --sky-comp-modal-space-offset-right: var(--modern-size-10);
493
- --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);
494
542
  --sky-comp-navbar_item-space-inset-bottom: var(--modern-space-md);
495
543
  --sky-comp-navbar_item-space-inset-left: var(--modern-space-s);
496
544
  --sky-comp-navbar_item-space-inset-right: var(--modern-space-s);
497
545
  --sky-comp-navbar_item-space-inset-top: var(--modern-space-md);
498
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-s);
499
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-s);
500
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-s);
501
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-s);
502
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
503
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-s);
504
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-s);
505
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
506
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
507
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-s);
508
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-s);
509
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
510
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
511
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
512
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
513
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
514
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-space-lg);
515
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-s);
516
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-s);
517
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-lg);
518
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
519
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-s);
520
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-s);
521
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-lg);
522
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
523
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-s);
524
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-s);
525
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-lg);
526
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
527
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-s);
528
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-s);
529
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-lg);
530
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
531
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-s);
532
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-s);
533
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
534
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
535
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-s);
536
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-s);
537
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
538
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
539
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-s);
540
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-s);
541
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
542
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
543
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-md);
544
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
545
- --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);
546
642
  --sky-comp-paging_button-space-inset-bottom: var(--modern-size-4);
547
643
  --sky-comp-paging_button-space-inset-left: var(--modern-size-15);
548
644
  --sky-comp-paging_button-space-inset-right: var(--modern-size-15);
@@ -555,6 +651,10 @@
555
651
  --sky-comp-popover-header-space-inset-left: var(--modern-space-lg);
556
652
  --sky-comp-popover-header-space-inset-right: var(--modern-space-lg);
557
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);
558
658
  --sky-comp-repeater_item-space-inset-bottom: var(--modern-space-md);
559
659
  --sky-comp-repeater_item-space-inset-left: var(--modern-space-s);
560
660
  --sky-comp-repeater_item-space-inset-right: var(--modern-space-s);
@@ -571,10 +671,14 @@
571
671
  --sky-comp-sab-summary-inline-space-inset-left: var(--modern-size-30);
572
672
  --sky-comp-sab-summary-inline-space-inset-right: var(--modern-size-30);
573
673
  --sky-comp-sab-summary-inline-space-inset-top: var(--modern-size-10);
574
- --sky-comp-search-space-inset-bottom: var(--modern-size-10);
575
- --sky-comp-search-space-inset-left: var(--modern-size-10);
576
- --sky-comp-search-space-inset-right: var(--modern-size-10);
577
- --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);
578
682
  --sky-comp-search-space-offset-bottom: var(--modern-size-5);
579
683
  --sky-comp-search-space-offset-left: var(--modern-size-5);
580
684
  --sky-comp-search-space-offset-right: var(--modern-size-5);
@@ -595,10 +699,14 @@
595
699
  --sky-comp-tab-horizontal-space-inset-left: var(--modern-size-15);
596
700
  --sky-comp-tab-horizontal-space-inset-right: var(--modern-size-15);
597
701
  --sky-comp-tab-horizontal-space-inset-top: var(--modern-size-10);
598
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-15);
599
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
600
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
601
- --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);
602
710
  --sky-comp-tab-vertical-group-button-space-inset-bottom: var(--modern-space-s);
603
711
  --sky-comp-tab-vertical-group-button-space-inset-left: var(--modern-space-s);
604
712
  --sky-comp-tab-vertical-group-button-space-inset-right: var(--modern-space-s);
@@ -623,14 +731,22 @@
623
731
  --sky-comp-text_editor-space-inset-left: var(--modern-space-md);
624
732
  --sky-comp-text_editor-space-inset-right: var(--modern-space-md);
625
733
  --sky-comp-text_editor-space-inset-top: var(--modern-space-md);
626
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
627
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-size-0);
628
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-size-0);
629
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
630
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
631
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-size-0);
632
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-size-0);
633
- --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);
634
750
  --sky-comp-tile-section-space-inset-bottom: var(--modern-space-md);
635
751
  --sky-comp-tile-section-space-inset-left: var(--modern-size-0);
636
752
  --sky-comp-tile-section-space-inset-right: var(--modern-size-0);
@@ -797,6 +913,7 @@
797
913
  --sky-space-gap-stacked_supplemental-m: var(--modern-size-10);
798
914
  --sky-space-gap-stacked_supplemental-s: var(--modern-size-5);
799
915
  --sky-space-gap-stacked_supplemental-xl: var(--modern-size-20);
916
+ --sky-space-gap-stacked_supplemental-xs: var(--modern-size-5);
800
917
  --sky-space-gap-text_action-l: var(--modern-space-lg);
801
918
  --sky-space-gap-text_action-m: var(--modern-space-md);
802
919
  --sky-space-gap-text_action-s: var(--modern-space-s);
@@ -874,155 +991,3 @@
874
991
  --sky-font-family-primary: var(--modern-font-blkb_sans-family);
875
992
  --sky-space-inset-switch: calc(var(--sky-size-switch) + var(--sky-space-gap-label-s));
876
993
  }
877
-
878
- @media (min-width: 768px) {
879
- .sky-theme-modern {
880
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
881
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
882
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
883
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
884
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
885
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
886
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
887
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
888
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
889
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
890
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
891
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
892
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
893
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
894
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
895
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
896
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
897
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
898
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
899
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
900
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
901
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
902
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
903
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
904
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
905
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
906
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
907
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
908
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
909
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
910
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
911
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
912
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
913
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
914
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
915
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
916
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
917
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
918
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
919
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
920
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
921
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
922
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
923
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
924
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
925
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
926
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
927
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
928
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
929
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
930
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
931
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
932
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
933
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
934
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
935
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
936
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
937
- --sky-comp-search-space-inset-left: var(--modern-space-s);
938
- --sky-comp-search-space-inset-right: var(--modern-space-s);
939
- --sky-comp-search-space-inset-top: var(--modern-space-s);
940
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
941
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
942
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
943
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
944
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
945
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
946
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
947
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
948
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
949
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
950
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
951
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
952
- }
953
- }
954
- .sky-theme-modern .sky-responsive-container-sm, .sky-theme-modern .sky-responsive-container-md, .sky-theme-modern .sky-responsive-container-lg {
955
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
956
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
957
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
958
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
959
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
960
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
961
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
962
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
963
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
964
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
965
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
966
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
967
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
968
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
969
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
970
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
971
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
972
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
973
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
974
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
975
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
976
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
977
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
978
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
979
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
980
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
981
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
982
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
983
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
984
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
985
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
986
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
987
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
988
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
989
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
990
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
991
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
992
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
993
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
994
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
995
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
996
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
997
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
998
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
999
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
1000
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
1001
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
1002
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
1003
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
1004
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
1005
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
1006
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
1007
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
1008
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
1009
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
1010
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
1011
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
1012
- --sky-comp-search-space-inset-left: var(--modern-space-s);
1013
- --sky-comp-search-space-inset-right: var(--modern-space-s);
1014
- --sky-comp-search-space-inset-top: var(--modern-space-s);
1015
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
1016
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
1017
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
1018
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
1019
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
1020
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
1021
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
1022
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
1023
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
1024
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
1025
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
1026
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
1027
- }
1028
-
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.69",
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",