@pantheon-systems/pds-design-tokens 1.0.0-dev.43 → 1.0.0-dev.44

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 (9) hide show
  1. package/README.md +2 -3
  2. package/build/css/pds-design-tokens.css +21 -0
  3. package/build/json/pds-design-tokens-dark-mode.json +1 -1
  4. package/build/json/pds-design-tokens-light-mode.json +1 -1
  5. package/build/json/pds-design-tokens.json +150 -18
  6. package/package.json +1 -1
  7. package/build/scss/_pds-design-tokens-dark-mode.scss +0 -120
  8. package/build/scss/_pds-design-tokens-light-mode.scss +0 -124
  9. package/build/scss/_pds-design-tokens.scss +0 -18
package/README.md CHANGED
@@ -11,7 +11,6 @@ Compiled tokens can be found in the `build` directory.
11
11
  PDS Design Tokens are provided in the following formats:
12
12
 
13
13
  - CSS Custom Properties
14
- - SASS Variables
15
14
  - JSON
16
15
  - Figma (formatted to sync to Figma styles)
17
16
 
@@ -21,11 +20,11 @@ Design tokens are specifically intended for the purpose of design and will be tr
21
20
 
22
21
  By default, tokens values should be unitless unless that unit is universal (such as percentages). Many PDS design tokens will be assigned a default unit type under the hood, but those unit designations will only be provided for the output formats where appropriate.
23
22
 
24
- For example, CSS and SCSS variable tokens will be output with unit-specific values. While JSON output tokens will always be unitless. However, if a default unit is assigned it will be available via the `defaultUnit` key for any token object.
23
+ For example, CSS variable tokens will be output with unit-specific values. While JSON output tokens will always be unitless. However, if a default unit is assigned it will be available via the `defaultUnit` key for any token object.
25
24
 
26
25
  ## Public and Private Tokens
27
26
 
28
- All tokens are considered private unless specifically designated as public. All tokens may be accessed via JSON token files, but only public tokens will be output to CSS and SCSS stylesheets.
27
+ All tokens are considered private unless specifically designated as public. All tokens may be accessed via JSON token files, but only public tokens will be output to CSS stylesheets.
29
28
 
30
29
  We typically only designate tokens as public when they need to be available to override for theming purposes such as switching between light and dark mode or for other custom themes.
31
30
 
package/build/css/pds-design-tokens.css CHANGED
@@ -17,5 +17,26 @@
17
17
  --pds-border-radius-container: 0.375rem;
18
18
  --pds-border-radius-default: 0.1875rem;
19
19
  --pds-border-width-default: 1px;
20
+ --pds-grid-marketing-column-medium-large: 5.125%;
21
+ --pds-grid-marketing-column-small: 21.34375%;
22
+ --pds-grid-marketing-gap-medium-large: 3.5%;
23
+ --pds-grid-marketing-gap-small: 4.875%;
24
+ --pds-spacing-2xl: 1.953rem;
25
+ --pds-spacing-2xs: 0.512rem;
26
+ --pds-spacing-3xl: 2.441rem;
27
+ --pds-spacing-3xs: 0.41rem;
28
+ --pds-spacing-4xl: 3.052rem;
29
+ --pds-spacing-4xs: 0.328rem;
30
+ --pds-spacing-5xl: 3.815rem;
31
+ --pds-spacing-5xs: 0.25rem;
32
+ --pds-spacing-6xl: 4.678rem;
33
+ --pds-spacing-6xs: 0.125rem;
34
+ --pds-spacing-7xl: 5.96rem;
35
+ --pds-spacing-8xl: 7.451rem;
36
+ --pds-spacing-l: 1.25rem;
37
+ --pds-spacing-m: 1rem;
38
+ --pds-spacing-s: 0.8rem;
39
+ --pds-spacing-xl: 1.563rem;
40
+ --pds-spacing-xs: 0.64rem;
20
41
  --pds-typography-font-default: 'Poppins', sans-serif;
21
42
  }
package/build/json/pds-design-tokens-dark-mode.json CHANGED
@@ -4443,4 +4443,4 @@
4443
4443
  }
4444
4444
  }
4445
4445
  }
4446
- }
4446
+ }
package/build/json/pds-design-tokens-light-mode.json CHANGED
@@ -4408,4 +4408,4 @@
4408
4408
  }
4409
4409
  }
4410
4410
  }
4411
- }
4411
+ }
package/build/json/pds-design-tokens.json CHANGED
@@ -357,17 +357,117 @@
357
357
  "gap"
358
358
  ]
359
359
  }
360
+ },
361
+ "marketing": {
362
+ "column": {
363
+ "small": {
364
+ "value": "21.34375%",
365
+ "public": true,
366
+ "filePath": "tokens/grid/base.json",
367
+ "isSource": true,
368
+ "original": {
369
+ "value": "21.34375%",
370
+ "public": true
371
+ },
372
+ "name": "grid-marketing-column-small",
373
+ "attributes": {
374
+ "category": "grid",
375
+ "type": "marketing",
376
+ "item": "column",
377
+ "subitem": "small"
378
+ },
379
+ "path": [
380
+ "grid",
381
+ "marketing",
382
+ "column",
383
+ "small"
384
+ ]
385
+ },
386
+ "medium-large": {
387
+ "value": "5.125%",
388
+ "public": true,
389
+ "filePath": "tokens/grid/base.json",
390
+ "isSource": true,
391
+ "original": {
392
+ "value": "5.125%",
393
+ "public": true
394
+ },
395
+ "name": "grid-marketing-column-medium-large",
396
+ "attributes": {
397
+ "category": "grid",
398
+ "type": "marketing",
399
+ "item": "column",
400
+ "subitem": "medium-large"
401
+ },
402
+ "path": [
403
+ "grid",
404
+ "marketing",
405
+ "column",
406
+ "medium-large"
407
+ ]
408
+ }
409
+ },
410
+ "gap": {
411
+ "small": {
412
+ "value": "4.875%",
413
+ "public": true,
414
+ "filePath": "tokens/grid/base.json",
415
+ "isSource": true,
416
+ "original": {
417
+ "value": "4.875%",
418
+ "public": true
419
+ },
420
+ "name": "grid-marketing-gap-small",
421
+ "attributes": {
422
+ "category": "grid",
423
+ "type": "marketing",
424
+ "item": "gap",
425
+ "subitem": "small"
426
+ },
427
+ "path": [
428
+ "grid",
429
+ "marketing",
430
+ "gap",
431
+ "small"
432
+ ]
433
+ },
434
+ "medium-large": {
435
+ "value": "3.5%",
436
+ "public": true,
437
+ "filePath": "tokens/grid/base.json",
438
+ "isSource": true,
439
+ "original": {
440
+ "value": "3.5%",
441
+ "public": true
442
+ },
443
+ "name": "grid-marketing-gap-medium-large",
444
+ "attributes": {
445
+ "category": "grid",
446
+ "type": "marketing",
447
+ "item": "gap",
448
+ "subitem": "medium-large"
449
+ },
450
+ "path": [
451
+ "grid",
452
+ "marketing",
453
+ "gap",
454
+ "medium-large"
455
+ ]
456
+ }
457
+ }
360
458
  }
361
459
  },
362
460
  "spacing": {
363
461
  "8XL": {
364
462
  "value": "7.451",
365
463
  "defaultUnit": "rem",
464
+ "public": true,
366
465
  "filePath": "tokens/spacing/base.json",
367
466
  "isSource": true,
368
467
  "original": {
369
468
  "value": "7.451",
370
- "defaultUnit": "rem"
469
+ "defaultUnit": "rem",
470
+ "public": true
371
471
  },
372
472
  "name": "spacing-8-xl",
373
473
  "attributes": {
@@ -382,11 +482,13 @@
382
482
  "7XL": {
383
483
  "value": "5.96",
384
484
  "defaultUnit": "rem",
485
+ "public": true,
385
486
  "filePath": "tokens/spacing/base.json",
386
487
  "isSource": true,
387
488
  "original": {
388
489
  "value": "5.96",
389
- "defaultUnit": "rem"
490
+ "defaultUnit": "rem",
491
+ "public": true
390
492
  },
391
493
  "name": "spacing-7-xl",
392
494
  "attributes": {
@@ -401,11 +503,13 @@
401
503
  "6XL": {
402
504
  "value": "4.678",
403
505
  "defaultUnit": "rem",
506
+ "public": true,
404
507
  "filePath": "tokens/spacing/base.json",
405
508
  "isSource": true,
406
509
  "original": {
407
510
  "value": "4.678",
408
- "defaultUnit": "rem"
511
+ "defaultUnit": "rem",
512
+ "public": true
409
513
  },
410
514
  "name": "spacing-6-xl",
411
515
  "attributes": {
@@ -420,11 +524,13 @@
420
524
  "5XL": {
421
525
  "value": "3.815",
422
526
  "defaultUnit": "rem",
527
+ "public": true,
423
528
  "filePath": "tokens/spacing/base.json",
424
529
  "isSource": true,
425
530
  "original": {
426
531
  "value": "3.815",
427
- "defaultUnit": "rem"
532
+ "defaultUnit": "rem",
533
+ "public": true
428
534
  },
429
535
  "name": "spacing-5-xl",
430
536
  "attributes": {
@@ -439,11 +545,13 @@
439
545
  "4XL": {
440
546
  "value": "3.052",
441
547
  "defaultUnit": "rem",
548
+ "public": true,
442
549
  "filePath": "tokens/spacing/base.json",
443
550
  "isSource": true,
444
551
  "original": {
445
552
  "value": "3.052",
446
- "defaultUnit": "rem"
553
+ "defaultUnit": "rem",
554
+ "public": true
447
555
  },
448
556
  "name": "spacing-4-xl",
449
557
  "attributes": {
@@ -458,11 +566,13 @@
458
566
  "3XL": {
459
567
  "value": "2.441",
460
568
  "defaultUnit": "rem",
569
+ "public": true,
461
570
  "filePath": "tokens/spacing/base.json",
462
571
  "isSource": true,
463
572
  "original": {
464
573
  "value": "2.441",
465
- "defaultUnit": "rem"
574
+ "defaultUnit": "rem",
575
+ "public": true
466
576
  },
467
577
  "name": "spacing-3-xl",
468
578
  "attributes": {
@@ -477,11 +587,13 @@
477
587
  "2XL": {
478
588
  "value": "1.953",
479
589
  "defaultUnit": "rem",
590
+ "public": true,
480
591
  "filePath": "tokens/spacing/base.json",
481
592
  "isSource": true,
482
593
  "original": {
483
594
  "value": "1.953",
484
- "defaultUnit": "rem"
595
+ "defaultUnit": "rem",
596
+ "public": true
485
597
  },
486
598
  "name": "spacing-2-xl",
487
599
  "attributes": {
@@ -496,11 +608,13 @@
496
608
  "XL": {
497
609
  "value": "1.563",
498
610
  "defaultUnit": "rem",
611
+ "public": true,
499
612
  "filePath": "tokens/spacing/base.json",
500
613
  "isSource": true,
501
614
  "original": {
502
615
  "value": "1.563",
503
- "defaultUnit": "rem"
616
+ "defaultUnit": "rem",
617
+ "public": true
504
618
  },
505
619
  "name": "spacing-xl",
506
620
  "attributes": {
@@ -515,11 +629,13 @@
515
629
  "L": {
516
630
  "value": "1.25",
517
631
  "defaultUnit": "rem",
632
+ "public": true,
518
633
  "filePath": "tokens/spacing/base.json",
519
634
  "isSource": true,
520
635
  "original": {
521
636
  "value": "1.25",
522
- "defaultUnit": "rem"
637
+ "defaultUnit": "rem",
638
+ "public": true
523
639
  },
524
640
  "name": "spacing-l",
525
641
  "attributes": {
@@ -534,11 +650,13 @@
534
650
  "M": {
535
651
  "value": "1",
536
652
  "defaultUnit": "rem",
653
+ "public": true,
537
654
  "filePath": "tokens/spacing/base.json",
538
655
  "isSource": true,
539
656
  "original": {
540
657
  "value": "1",
541
- "defaultUnit": "rem"
658
+ "defaultUnit": "rem",
659
+ "public": true
542
660
  },
543
661
  "name": "spacing-m",
544
662
  "attributes": {
@@ -553,11 +671,13 @@
553
671
  "S": {
554
672
  "value": "0.8",
555
673
  "defaultUnit": "rem",
674
+ "public": true,
556
675
  "filePath": "tokens/spacing/base.json",
557
676
  "isSource": true,
558
677
  "original": {
559
678
  "value": "0.8",
560
- "defaultUnit": "rem"
679
+ "defaultUnit": "rem",
680
+ "public": true
561
681
  },
562
682
  "name": "spacing-s",
563
683
  "attributes": {
@@ -572,11 +692,13 @@
572
692
  "XS": {
573
693
  "value": "0.64",
574
694
  "defaultUnit": "rem",
695
+ "public": true,
575
696
  "filePath": "tokens/spacing/base.json",
576
697
  "isSource": true,
577
698
  "original": {
578
699
  "value": "0.64",
579
- "defaultUnit": "rem"
700
+ "defaultUnit": "rem",
701
+ "public": true
580
702
  },
581
703
  "name": "spacing-xs",
582
704
  "attributes": {
@@ -591,11 +713,13 @@
591
713
  "2XS": {
592
714
  "value": "0.512",
593
715
  "defaultUnit": "rem",
716
+ "public": true,
594
717
  "filePath": "tokens/spacing/base.json",
595
718
  "isSource": true,
596
719
  "original": {
597
720
  "value": "0.512",
598
- "defaultUnit": "rem"
721
+ "defaultUnit": "rem",
722
+ "public": true
599
723
  },
600
724
  "name": "spacing-2-xs",
601
725
  "attributes": {
@@ -610,11 +734,13 @@
610
734
  "3XS": {
611
735
  "value": "0.41",
612
736
  "defaultUnit": "rem",
737
+ "public": true,
613
738
  "filePath": "tokens/spacing/base.json",
614
739
  "isSource": true,
615
740
  "original": {
616
741
  "value": "0.41",
617
- "defaultUnit": "rem"
742
+ "defaultUnit": "rem",
743
+ "public": true
618
744
  },
619
745
  "name": "spacing-3-xs",
620
746
  "attributes": {
@@ -629,11 +755,13 @@
629
755
  "4XS": {
630
756
  "value": "0.328",
631
757
  "defaultUnit": "rem",
758
+ "public": true,
632
759
  "filePath": "tokens/spacing/base.json",
633
760
  "isSource": true,
634
761
  "original": {
635
762
  "value": "0.328",
636
- "defaultUnit": "rem"
763
+ "defaultUnit": "rem",
764
+ "public": true
637
765
  },
638
766
  "name": "spacing-4-xs",
639
767
  "attributes": {
@@ -648,11 +776,13 @@
648
776
  "5XS": {
649
777
  "value": "0.25",
650
778
  "defaultUnit": "rem",
779
+ "public": true,
651
780
  "filePath": "tokens/spacing/base.json",
652
781
  "isSource": true,
653
782
  "original": {
654
783
  "value": "0.25",
655
- "defaultUnit": "rem"
784
+ "defaultUnit": "rem",
785
+ "public": true
656
786
  },
657
787
  "name": "spacing-5-xs",
658
788
  "attributes": {
@@ -667,11 +797,13 @@
667
797
  "6XS": {
668
798
  "value": "0.125",
669
799
  "defaultUnit": "rem",
800
+ "public": true,
670
801
  "filePath": "tokens/spacing/base.json",
671
802
  "isSource": true,
672
803
  "original": {
673
804
  "value": "0.125",
674
- "defaultUnit": "rem"
805
+ "defaultUnit": "rem",
806
+ "public": true
675
807
  },
676
808
  "name": "spacing-6-xs",
677
809
  "attributes": {
@@ -1270,4 +1402,4 @@
1270
1402
  }
1271
1403
  }
1272
1404
  }
1273
- }
1405
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "1.0.0-dev.43",
3
+ "version": "1.0.0-dev.44",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [
package/build/scss/_pds-design-tokens-dark-mode.scss DELETED
@@ -1,120 +0,0 @@
1
-
2
- //
3
- // Pantheon Systems
4
- //
5
- // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
6
- // !! DO NOT EDIT THIS FILE DIRECTLY !!
7
- // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
8
- //
9
- // This file has been generated automatically.
10
-
11
- $pds-color-background-default: #1d1d29;
12
- $pds-color-border-default: #504e62;
13
- $pds-color-brand-accent-default: #de0093;
14
- $pds-color-brand-primary-default: #ffdc28;
15
- $pds-color-brand-secondary-default: #8a70ff;
16
- $pds-color-button-brand-background-active: #ddbd16;
17
- $pds-color-button-brand-background-default: #ffdc28;
18
- $pds-color-button-brand-background-hover: #ffe668;
19
- $pds-color-button-brand-border-active: #ddbd16;
20
- $pds-color-button-brand-border-default: #ffdc28;
21
- $pds-color-button-brand-border-hover: #ffe668;
22
- $pds-color-button-brand-foreground-active: #121219;
23
- $pds-color-button-brand-foreground-default: #121219;
24
- $pds-color-button-brand-foreground-hover: #121219;
25
- $pds-color-button-brand-secondary-background-active: #282839;
26
- $pds-color-button-brand-secondary-background-default: rgba(0, 0, 0, 0);
27
- $pds-color-button-brand-secondary-background-hover: #504e62;
28
- $pds-color-button-brand-secondary-border-active: #504e62;
29
- $pds-color-button-brand-secondary-border-default: #a6a3b4;
30
- $pds-color-button-brand-secondary-border-hover: #ffffff;
31
- $pds-color-button-brand-secondary-foreground-active: #e7e7eb;
32
- $pds-color-button-brand-secondary-foreground-default: #e7e7eb;
33
- $pds-color-button-brand-secondary-foreground-hover: #ffffff;
34
- $pds-color-button-critical-background-active: #9c2f2f;
35
- $pds-color-button-critical-background-default: #e05757;
36
- $pds-color-button-critical-background-hover: #be4242;
37
- $pds-color-button-critical-border-active: #9c2f2f;
38
- $pds-color-button-critical-border-default: #e05757;
39
- $pds-color-button-critical-border-hover: #be4242;
40
- $pds-color-button-critical-foreground-active: #ffffff;
41
- $pds-color-button-critical-foreground-default: #ffffff;
42
- $pds-color-button-critical-foreground-hover: #ffffff;
43
- $pds-color-button-primary-background-active: #4e39a8;
44
- $pds-color-button-primary-background-default: #8a70ff;
45
- $pds-color-button-primary-background-hover: #ad9bff;
46
- $pds-color-button-primary-border-active: #4e39a8;
47
- $pds-color-button-primary-border-default: #8a70ff;
48
- $pds-color-button-primary-border-hover: #ad9bff;
49
- $pds-color-button-primary-foreground-active: #ffffff;
50
- $pds-color-button-primary-foreground-default: #ffffff;
51
- $pds-color-button-primary-foreground-hover: #ffffff;
52
- $pds-color-button-secondary-background-active: #282839;
53
- $pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
54
- $pds-color-button-secondary-background-hover: #504e62;
55
- $pds-color-button-secondary-border-active: #504e62;
56
- $pds-color-button-secondary-border-default: #a6a3b4;
57
- $pds-color-button-secondary-border-hover: #ffffff;
58
- $pds-color-button-secondary-foreground-active: #e7e7eb;
59
- $pds-color-button-secondary-foreground-default: #e7e7eb;
60
- $pds-color-button-secondary-foreground-hover: #ffffff;
61
- $pds-color-button-subtle-background-active: #282839;
62
- $pds-color-button-subtle-background-default: rgba(0, 0, 0, 0);
63
- $pds-color-button-subtle-background-hover: #504e62;
64
- $pds-color-button-subtle-border-default: rgba(0, 0, 0, 0);
65
- $pds-color-button-subtle-foreground-active: #e7e7eb;
66
- $pds-color-button-subtle-foreground-default: #e7e7eb;
67
- $pds-color-button-subtle-foreground-hover: #ffffff;
68
- $pds-color-card-border: #504e62;
69
- $pds-color-foreground-default: #ffffff;
70
- $pds-color-gradient-after-hours: linear-gradient(228.64deg, #2B017B 41.87%, #29B2FF 100%);
71
- $pds-color-gradient-midnight: linear-gradient(228.64deg, #3017A1 46.34%, #00E0C3 100%);
72
- $pds-color-gradient-sunrise: linear-gradient(227.79deg, #300068 38.28%, #E65F35 100%);
73
- $pds-color-gradient-sunset: linear-gradient(48.24deg, #EF13AD 0%, #300068 66.25%);
74
- $pds-color-input-action-background-hover: #504e62;
75
- $pds-color-input-background-critical: #1d1d29;
76
- $pds-color-input-background-default: #1d1d29;
77
- $pds-color-input-background-hover: #282839;
78
- $pds-color-input-border-critical: #e05757;
79
- $pds-color-input-border-default: #858299;
80
- $pds-color-input-border-hover: #ad9bff;
81
- $pds-color-input-border-success: #3cb683;
82
- $pds-color-input-checked-background: $pds-color-interactive-focus;
83
- $pds-color-input-checked-foreground: #ffffff;
84
- $pds-color-input-foreground-critical: #e05757;
85
- $pds-color-input-foreground-default: #ffffff;
86
- $pds-color-input-foreground-success: #3cb683;
87
- $pds-color-input-placeholder-text: #a6a3b4;
88
- $pds-color-input-toggle-switch-icon: #ffffff;
89
- $pds-color-input-toggle-switch-off: #504e62;
90
- $pds-color-input-toggle-switch-on: $pds-color-interactive-focus;
91
- $pds-color-interactive-focus: #36a3ff;
92
- $pds-color-link-active: #6f54e8;
93
- $pds-color-link-cta-active: #d0c6ff;
94
- $pds-color-link-cta-default: #8a70ff;
95
- $pds-color-link-cta-hover: #ad9bff;
96
- $pds-color-link-default: #36a3ff;
97
- $pds-color-link-hover: #6f54e8;
98
- $pds-color-link-visited: #6f54e8;
99
- $pds-color-menu-background: #282839;
100
- $pds-color-menu-item-background-active: #858299;
101
- $pds-color-menu-item-background-default: #282839;
102
- $pds-color-menu-item-background-hover: #504e62;
103
- $pds-color-menu-item-description-text: #a6a3b4;
104
- $pds-color-menu-item-foreground: #ffffff;
105
- $pds-color-menu-item-heading-text: #a6a3b4;
106
- $pds-color-panel-default-background: $pds-color-background-default;
107
- $pds-color-panel-default-border: $pds-color-border-default;
108
- $pds-color-panel-overlay-background: #282839;
109
- $pds-color-panel-raised-background: #282839;
110
- $pds-color-panel-raised-border: $pds-color-border-default;
111
- $pds-color-panel-sunken-background: #121219;
112
- $pds-color-text-default: #ffffff;
113
- $pds-color-text-default-secondary: #a6a3b4;
114
- $pds-color-tile-background-active: #858299;
115
- $pds-color-tile-background-hover: #504e62;
116
- $pds-color-tile-separator: #504e62;
117
- $pds-color-toggle-button-background-off: #504e62;
118
- $pds-color-toggle-button-foreground-off: #c7c5d0;
119
- $pds-elevation-overlay: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
120
- $pds-elevation-raised: 0px 1px 1px 0px rgba(18, 18, 25, 0.95);
package/build/scss/_pds-design-tokens-light-mode.scss DELETED
@@ -1,124 +0,0 @@
1
-
2
- //
3
- // Pantheon Systems
4
- //
5
- // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
6
- // !! DO NOT EDIT THIS FILE DIRECTLY !!
7
- // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
8
- //
9
- // This file has been generated automatically.
10
-
11
- $pds-color-expansion-panel-hover: #f1f1f1;
12
- $pds-color-expansion-panel-open: #f1f1f1;
13
- $pds-color-background-default: #ffffff;
14
- $pds-color-border-default: #cfcfd3;
15
- $pds-color-brand-accent-default: #de0093;
16
- $pds-color-brand-primary-default: #ffdc28;
17
- $pds-color-brand-secondary-default: #3017a1;
18
- $pds-color-button-brand-background-active: #ddbd16;
19
- $pds-color-button-brand-background-default: #ffdc28;
20
- $pds-color-button-brand-background-hover: #ffe668;
21
- $pds-color-button-brand-border-active: #ddbd16;
22
- $pds-color-button-brand-border-default: #ffdc28;
23
- $pds-color-button-brand-border-hover: #ffe668;
24
- $pds-color-button-brand-foreground-active: #23232d;
25
- $pds-color-button-brand-foreground-default: #23232d;
26
- $pds-color-button-brand-foreground-hover: #23232d;
27
- $pds-color-button-brand-secondary-background-active: #f1f1f1;
28
- $pds-color-button-brand-secondary-background-default: rgba(0, 0, 0, 0);
29
- $pds-color-button-brand-secondary-background-hover: #f8f8f8;
30
- $pds-color-button-brand-secondary-border-active: #23232d;
31
- $pds-color-button-brand-secondary-border-default: #6d6d78;
32
- $pds-color-button-brand-secondary-border-hover: #23232d;
33
- $pds-color-button-brand-secondary-foreground-active: #23232d;
34
- $pds-color-button-brand-secondary-foreground-default: #23232d;
35
- $pds-color-button-brand-secondary-foreground-hover: #23232d;
36
- $pds-color-button-critical-background-active: #700000;
37
- $pds-color-button-critical-background-default: #d61f1f;
38
- $pds-color-button-critical-background-hover: #f83333;
39
- $pds-color-button-critical-border-active: #700000;
40
- $pds-color-button-critical-border-default: #d61f1f;
41
- $pds-color-button-critical-border-hover: #f83333;
42
- $pds-color-button-critical-foreground-active: #ffffff;
43
- $pds-color-button-critical-foreground-default: #ffffff;
44
- $pds-color-button-critical-foreground-hover: #ffffff;
45
- $pds-color-button-primary-background-active: #11005d;
46
- $pds-color-button-primary-background-default: #3017a1;
47
- $pds-color-button-primary-background-hover: #5f41e5;
48
- $pds-color-button-primary-border-active: #11005d;
49
- $pds-color-button-primary-border-default: #3017a1;
50
- $pds-color-button-primary-border-hover: #5f41e5;
51
- $pds-color-button-primary-foreground-active: #ffffff;
52
- $pds-color-button-primary-foreground-default: #ffffff;
53
- $pds-color-button-primary-foreground-hover: #ffffff;
54
- $pds-color-button-secondary-background-active: #e5dbff;
55
- $pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
56
- $pds-color-button-secondary-background-hover: #f0ecff;
57
- $pds-color-button-secondary-border-active: #11005d;
58
- $pds-color-button-secondary-border-default: #3017a1;
59
- $pds-color-button-secondary-border-hover: #5f41e5;
60
- $pds-color-button-secondary-foreground-active: #11005d;
61
- $pds-color-button-secondary-foreground-default: #3017a1;
62
- $pds-color-button-secondary-foreground-hover: #3017a1;
63
- $pds-color-button-subtle-background-active: #e5dbff;
64
- $pds-color-button-subtle-background-default: rgba(0, 0, 0, 0);
65
- $pds-color-button-subtle-background-hover: #f0ecff;
66
- $pds-color-button-subtle-border-default: rgba(0, 0, 0, 0);
67
- $pds-color-button-subtle-foreground-active: #11005d;
68
- $pds-color-button-subtle-foreground-default: #3017a1;
69
- $pds-color-button-subtle-foreground-hover: #3017a1;
70
- $pds-color-card-border: $pds-color-border-default;
71
- $pds-color-foreground-default: #23232d;
72
- $pds-color-gradient-after-hours: linear-gradient(228.64deg, #2B017B 41.87%, #29B2FF 100%);
73
- $pds-color-gradient-midnight: linear-gradient(228.64deg, #3017A1 46.34%, #00E0C3 100%);
74
- $pds-color-gradient-sunrise: linear-gradient(227.79deg, #300068 38.28%, #E65F35 100%);
75
- $pds-color-gradient-sunset: linear-gradient(48.24deg, #EF13AD 0%, #300068 66.25%);
76
- $pds-color-input-action-background-hover: #f8f8f8;
77
- $pds-color-input-background-critical: #ffebeb;
78
- $pds-color-input-background-default: #ffffff;
79
- $pds-color-input-background-hover: #f0ecff;
80
- $pds-color-input-border-critical: #d61f1f;
81
- $pds-color-input-border-default: #cfcfd3;
82
- $pds-color-input-border-hover: #5f41e5;
83
- $pds-color-input-border-success: #1f845a;
84
- $pds-color-input-checked-background: $pds-color-interactive-focus;
85
- $pds-color-input-checked-foreground: #ffffff;
86
- $pds-color-input-foreground-critical: #d61f1f;
87
- $pds-color-input-foreground-default: #23232d;
88
- $pds-color-input-foreground-success: #1f845a;
89
- $pds-color-input-placeholder-text: #6d6d78;
90
- $pds-color-input-toggle-switch-icon: #ffffff;
91
- $pds-color-input-toggle-switch-off: #6d6d78;
92
- $pds-color-input-toggle-switch-on: $pds-color-interactive-focus;
93
- $pds-color-interactive-focus: #0f62fe;
94
- $pds-color-link-active: #6f54e8;
95
- $pds-color-link-cta-active: #11005d;
96
- $pds-color-link-cta-default: #3017a1;
97
- $pds-color-link-cta-hover: #5f41e5;
98
- $pds-color-link-default: #0f62fe;
99
- $pds-color-link-hover: #6f54e8;
100
- $pds-color-link-visited: #6f54e8;
101
- $pds-color-menu-background: #ffffff;
102
- $pds-color-menu-item-background-active: #f1f1f1;
103
- $pds-color-menu-item-background-default: #ffffff;
104
- $pds-color-menu-item-background-hover: #f8f8f8;
105
- $pds-color-menu-item-description-text: #6d6d78;
106
- $pds-color-menu-item-foreground: #23232d;
107
- $pds-color-menu-item-heading-text: #6d6d78;
108
- $pds-color-pager-background-active: #f0ecff;
109
- $pds-color-pager-background-hover: #f1f1f1;
110
- $pds-color-pager-foreground-active: #5f41e5;
111
- $pds-color-panel-default-background: $pds-color-background-default;
112
- $pds-color-panel-default-border: $pds-color-border-default;
113
- $pds-color-panel-overlay-background: $pds-color-background-default;
114
- $pds-color-panel-raised-background: $pds-color-background-default;
115
- $pds-color-panel-sunken-background: #f1f1f1;
116
- $pds-color-text-default: #23232d;
117
- $pds-color-text-default-secondary: #6d6d78;
118
- $pds-color-tile-background-active: #f1f1f1;
119
- $pds-color-tile-background-hover: #f8f8f8;
120
- $pds-color-tile-separator: #cfcfd3;
121
- $pds-color-toggle-button-background-off: #f1f1f1;
122
- $pds-color-toggle-button-foreground-off: #6d6d78;
123
- $pds-elevation-overlay: 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 8px 12px 0px rgba(0, 0, 0, 0.15);
124
- $pds-elevation-raised: 0px 1px 2px 0px rgba(0, 0, 0, 0.2), 0px 3px 8px 0px rgba(0, 0, 0, 0.15);
package/build/scss/_pds-design-tokens.scss DELETED
@@ -1,18 +0,0 @@
1
-
2
- //
3
- // Pantheon Systems
4
- //
5
- // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
6
- // !! DO NOT EDIT THIS FILE DIRECTLY !!
7
- // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
8
- //
9
- // This file has been generated automatically.
10
-
11
- $pds-animation-transition-default-delay: 0s;
12
- $pds-animation-transition-default-duration: 200ms;
13
- $pds-animation-transition-default-timing-function: ease-in-out;
14
- $pds-animation-transition-dropdown-duration: 300ms;
15
- $pds-border-radius-container: 0.375rem;
16
- $pds-border-radius-default: 0.1875rem;
17
- $pds-border-width-default: 1px;
18
- $pds-typography-font-default: 'Poppins', sans-serif;