@pantheon-systems/pds-design-tokens 1.0.0-dev.122 → 1.0.0-dev.124

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/build/css/pds-design-tokens-light-mode.css +7 -7
  2. package/build/css/pds-design-tokens.css +1 -1
  3. package/build/figma/pds-design-tokens-figma.json +60 -56
  4. package/build/json/pds-design-tokens-light-mode.json +60 -56
  5. package/build/json/pds-design-tokens.json +2 -2
  6. package/package.json +1 -1
package/build/css/pds-design-tokens-light-mode.css CHANGED
@@ -14,18 +14,18 @@
14
14
  --pds-color-background-default: #ffffff;
15
15
  --pds-color-background-default-secondary: #f8f8f8;
16
16
  --pds-color-background-reverse: #23232d;
17
- --pds-color-badge-indicator-diamond-background: #f0fdff;
18
- --pds-color-badge-indicator-diamond-foreground: #1d7afc;
19
- --pds-color-badge-indicator-gold-background: #fff1a9;
17
+ --pds-color-badge-indicator-diamond-background: #cfe1fc;
18
+ --pds-color-badge-indicator-diamond-foreground: #035ad3;
19
+ --pds-color-badge-indicator-gold-background: #ffe668;
20
20
  --pds-color-badge-indicator-gold-foreground: #705e00;
21
21
  --pds-color-badge-indicator-info-background: #1d7afc;
22
22
  --pds-color-badge-indicator-info-foreground: #ffffff;
23
23
  --pds-color-badge-indicator-neutral-background: #6d6d78;
24
24
  --pds-color-badge-indicator-neutral-foreground: #ffffff;
25
- --pds-color-badge-indicator-platinum-background: #f0edfb;
25
+ --pds-color-badge-indicator-platinum-background: #dfd8f5;
26
26
  --pds-color-badge-indicator-platinum-foreground: #3017a1;
27
- --pds-color-badge-indicator-silver-background: #f1f1f1;
28
- --pds-color-badge-indicator-silver-foreground: var(--pds-color-text-default-secondary);
27
+ --pds-color-badge-indicator-silver-background: #cfcfd3;
28
+ --pds-color-badge-indicator-silver-foreground: #23232d;
29
29
  --pds-color-badge-indicator-success-background: #218c5f;
30
30
  --pds-color-badge-indicator-success-foreground: #ffffff;
31
31
  --pds-color-badge-status-dot-critical: var(--pds-color-semantic-critical-foreground);
@@ -115,7 +115,7 @@
115
115
  --pds-color-code-inline-background: #f0edfb;
116
116
  --pds-color-code-inline-border: #dfd8f5;
117
117
  --pds-color-code-inline-text: #000000;
118
- --pds-color-dashboard-background: var(--pds-color-background-default-secondary);
118
+ --pds-color-dashboard-nav-background: var(--pds-color-background-default-secondary);
119
119
  --pds-color-dashboard-nav-item-background-active: var(--pds-color-background-reverse);
120
120
  --pds-color-dashboard-nav-item-background-default: rgba(0, 0, 0, 0);
121
121
  --pds-color-dashboard-nav-item-background-hover: #e8e8e9;
package/build/css/pds-design-tokens.css CHANGED
@@ -34,7 +34,7 @@
34
34
  --pds-container-modal-width-large: 44rem;
35
35
  --pds-container-modal-width-medium: 36rem;
36
36
  --pds-container-modal-width-small: 25rem;
37
- --pds-container-padding-base: 6%;
37
+ --pds-container-padding-base: var(--pds-spacing-xl);
38
38
  --pds-container-padding-narrow-bp-lg: 20%;
39
39
  --pds-container-padding-narrow-bp-md: 12%;
40
40
  --pds-container-padding-standard-bp-lg: 8%;
package/build/figma/pds-design-tokens-figma.json CHANGED
@@ -10113,13 +10113,13 @@
10113
10113
  "indicator": {
10114
10114
  "silver": {
10115
10115
  "background": {
10116
- "value": "#f1f1f1",
10116
+ "value": "#cfcfd3",
10117
10117
  "public": true,
10118
10118
  "isReferenceToInternal": true,
10119
10119
  "filePath": "tokens/color/alias/badge.light.json",
10120
10120
  "isSource": true,
10121
10121
  "original": {
10122
- "value": "{color.light-mode.neutral.200.value}",
10122
+ "value": "{color.light-mode.neutral.300.value}",
10123
10123
  "public": true,
10124
10124
  "isReferenceToInternal": true
10125
10125
  },
@@ -10141,13 +10141,15 @@
10141
10141
  ]
10142
10142
  },
10143
10143
  "foreground": {
10144
- "value": "#6d6d78",
10144
+ "value": "#23232d",
10145
10145
  "public": true,
10146
+ "isReferenceToInternal": true,
10146
10147
  "filePath": "tokens/color/alias/badge.light.json",
10147
10148
  "isSource": true,
10148
10149
  "original": {
10149
- "value": "{color.light-mode.text.default-secondary.value}",
10150
- "public": true
10150
+ "value": "{color.light-mode.neutral.500.value}",
10151
+ "public": true,
10152
+ "isReferenceToInternal": true
10151
10153
  },
10152
10154
  "name": "color-light-mode-badge-indicator-silver-foreground",
10153
10155
  "attributes": {
@@ -10169,13 +10171,13 @@
10169
10171
  },
10170
10172
  "gold": {
10171
10173
  "background": {
10172
- "value": "#fff1a9",
10174
+ "value": "#ffe668",
10173
10175
  "public": true,
10174
10176
  "isReferenceToInternal": true,
10175
10177
  "filePath": "tokens/color/alias/badge.light.json",
10176
10178
  "isSource": true,
10177
10179
  "original": {
10178
- "value": "{color.light-mode.brand.primary.200.value}",
10180
+ "value": "{color.light-mode.brand.primary.300.value}",
10179
10181
  "public": true,
10180
10182
  "isReferenceToInternal": true
10181
10183
  },
@@ -10225,116 +10227,116 @@
10225
10227
  ]
10226
10228
  }
10227
10229
  },
10228
- "platinum": {
10230
+ "diamond": {
10229
10231
  "background": {
10230
- "value": "#f0edfb",
10232
+ "value": "#cfe1fc",
10231
10233
  "public": true,
10232
- "isReferenceToInternal": true,
10233
10234
  "filePath": "tokens/color/alias/badge.light.json",
10234
10235
  "isSource": true,
10235
10236
  "original": {
10236
- "value": "{color.light-mode.brand.secondary.100.value}",
10237
- "public": true,
10238
- "isReferenceToInternal": true
10237
+ "value": "#CFE1FC",
10238
+ "public": true
10239
10239
  },
10240
- "name": "color-light-mode-badge-indicator-platinum-background",
10240
+ "name": "color-light-mode-badge-indicator-diamond-background",
10241
10241
  "attributes": {
10242
10242
  "category": "color",
10243
10243
  "type": "light-mode",
10244
10244
  "item": "badge",
10245
10245
  "subitem": "indicator",
10246
- "state": "platinum"
10246
+ "state": "diamond"
10247
10247
  },
10248
10248
  "path": [
10249
10249
  "color",
10250
10250
  "light-mode",
10251
10251
  "badge",
10252
10252
  "indicator",
10253
- "platinum",
10253
+ "diamond",
10254
10254
  "background"
10255
10255
  ]
10256
10256
  },
10257
10257
  "foreground": {
10258
- "value": "#3017a1",
10258
+ "value": "#035ad3",
10259
10259
  "public": true,
10260
10260
  "isReferenceToInternal": true,
10261
10261
  "filePath": "tokens/color/alias/badge.light.json",
10262
10262
  "isSource": true,
10263
10263
  "original": {
10264
- "value": "{color.light-mode.brand.secondary.400.value}",
10264
+ "value": "#035AD3",
10265
10265
  "public": true,
10266
10266
  "isReferenceToInternal": true
10267
10267
  },
10268
- "name": "color-light-mode-badge-indicator-platinum-foreground",
10268
+ "name": "color-light-mode-badge-indicator-diamond-foreground",
10269
10269
  "attributes": {
10270
10270
  "category": "color",
10271
10271
  "type": "light-mode",
10272
10272
  "item": "badge",
10273
10273
  "subitem": "indicator",
10274
- "state": "platinum"
10274
+ "state": "diamond"
10275
10275
  },
10276
10276
  "path": [
10277
10277
  "color",
10278
10278
  "light-mode",
10279
10279
  "badge",
10280
10280
  "indicator",
10281
- "platinum",
10281
+ "diamond",
10282
10282
  "foreground"
10283
10283
  ]
10284
10284
  }
10285
10285
  },
10286
- "diamond": {
10286
+ "platinum": {
10287
10287
  "background": {
10288
- "value": "#f0fdff",
10288
+ "value": "#dfd8f5",
10289
10289
  "public": true,
10290
+ "isReferenceToInternal": true,
10290
10291
  "filePath": "tokens/color/alias/badge.light.json",
10291
10292
  "isSource": true,
10292
10293
  "original": {
10293
- "value": "#f0fdff",
10294
- "public": true
10294
+ "value": "{color.light-mode.brand.secondary.200.value}",
10295
+ "public": true,
10296
+ "isReferenceToInternal": true
10295
10297
  },
10296
- "name": "color-light-mode-badge-indicator-diamond-background",
10298
+ "name": "color-light-mode-badge-indicator-platinum-background",
10297
10299
  "attributes": {
10298
10300
  "category": "color",
10299
10301
  "type": "light-mode",
10300
10302
  "item": "badge",
10301
10303
  "subitem": "indicator",
10302
- "state": "diamond"
10304
+ "state": "platinum"
10303
10305
  },
10304
10306
  "path": [
10305
10307
  "color",
10306
10308
  "light-mode",
10307
10309
  "badge",
10308
10310
  "indicator",
10309
- "diamond",
10311
+ "platinum",
10310
10312
  "background"
10311
10313
  ]
10312
10314
  },
10313
10315
  "foreground": {
10314
- "value": "#1d7afc",
10316
+ "value": "#3017a1",
10315
10317
  "public": true,
10316
10318
  "isReferenceToInternal": true,
10317
10319
  "filePath": "tokens/color/alias/badge.light.json",
10318
10320
  "isSource": true,
10319
10321
  "original": {
10320
- "value": "{color.light-mode.semantic.info.foreground.value}",
10322
+ "value": "{color.light-mode.brand.secondary.400.value}",
10321
10323
  "public": true,
10322
10324
  "isReferenceToInternal": true
10323
10325
  },
10324
- "name": "color-light-mode-badge-indicator-diamond-foreground",
10326
+ "name": "color-light-mode-badge-indicator-platinum-foreground",
10325
10327
  "attributes": {
10326
10328
  "category": "color",
10327
10329
  "type": "light-mode",
10328
10330
  "item": "badge",
10329
10331
  "subitem": "indicator",
10330
- "state": "diamond"
10332
+ "state": "platinum"
10331
10333
  },
10332
10334
  "path": [
10333
10335
  "color",
10334
10336
  "light-mode",
10335
10337
  "badge",
10336
10338
  "indicator",
10337
- "diamond",
10339
+ "platinum",
10338
10340
  "foreground"
10339
10341
  ]
10340
10342
  }
@@ -12545,29 +12547,6 @@
12545
12547
  }
12546
12548
  },
12547
12549
  "dashboard": {
12548
- "background": {
12549
- "value": "#f8f8f8",
12550
- "public": true,
12551
- "filePath": "tokens/color/alias/dashboard.light.json",
12552
- "isSource": true,
12553
- "original": {
12554
- "value": "{color.light-mode.background.default-secondary.value}",
12555
- "public": true
12556
- },
12557
- "name": "color-light-mode-dashboard-background",
12558
- "attributes": {
12559
- "category": "color",
12560
- "type": "light-mode",
12561
- "item": "dashboard",
12562
- "subitem": "background"
12563
- },
12564
- "path": [
12565
- "color",
12566
- "light-mode",
12567
- "dashboard",
12568
- "background"
12569
- ]
12570
- },
12571
12550
  "toggle-button": {
12572
12551
  "background": {
12573
12552
  "value": "#23232d",
@@ -12621,6 +12600,31 @@
12621
12600
  }
12622
12601
  },
12623
12602
  "nav": {
12603
+ "background": {
12604
+ "value": "#f8f8f8",
12605
+ "public": true,
12606
+ "filePath": "tokens/color/alias/dashboard.light.json",
12607
+ "isSource": true,
12608
+ "original": {
12609
+ "value": "{color.light-mode.background.default-secondary.value}",
12610
+ "public": true
12611
+ },
12612
+ "name": "color-light-mode-dashboard-nav-background",
12613
+ "attributes": {
12614
+ "category": "color",
12615
+ "type": "light-mode",
12616
+ "item": "dashboard",
12617
+ "subitem": "nav",
12618
+ "state": "background"
12619
+ },
12620
+ "path": [
12621
+ "color",
12622
+ "light-mode",
12623
+ "dashboard",
12624
+ "nav",
12625
+ "background"
12626
+ ]
12627
+ },
12624
12628
  "item": {
12625
12629
  "background": {
12626
12630
  "default": {
package/build/json/pds-design-tokens-light-mode.json CHANGED
@@ -463,13 +463,13 @@
463
463
  "indicator": {
464
464
  "silver": {
465
465
  "background": {
466
- "value": "#f1f1f1",
466
+ "value": "#cfcfd3",
467
467
  "public": true,
468
468
  "isReferenceToInternal": true,
469
469
  "filePath": "tokens/color/alias/badge.light.json",
470
470
  "isSource": true,
471
471
  "original": {
472
- "value": "{color.light-mode.neutral.200.value}",
472
+ "value": "{color.light-mode.neutral.300.value}",
473
473
  "public": true,
474
474
  "isReferenceToInternal": true
475
475
  },
@@ -491,13 +491,15 @@
491
491
  ]
492
492
  },
493
493
  "foreground": {
494
- "value": "#6d6d78",
494
+ "value": "#23232d",
495
495
  "public": true,
496
+ "isReferenceToInternal": true,
496
497
  "filePath": "tokens/color/alias/badge.light.json",
497
498
  "isSource": true,
498
499
  "original": {
499
- "value": "{color.light-mode.text.default-secondary.value}",
500
- "public": true
500
+ "value": "{color.light-mode.neutral.500.value}",
501
+ "public": true,
502
+ "isReferenceToInternal": true
501
503
  },
502
504
  "name": "color-light-mode-badge-indicator-silver-foreground",
503
505
  "attributes": {
@@ -519,13 +521,13 @@
519
521
  },
520
522
  "gold": {
521
523
  "background": {
522
- "value": "#fff1a9",
524
+ "value": "#ffe668",
523
525
  "public": true,
524
526
  "isReferenceToInternal": true,
525
527
  "filePath": "tokens/color/alias/badge.light.json",
526
528
  "isSource": true,
527
529
  "original": {
528
- "value": "{color.light-mode.brand.primary.200.value}",
530
+ "value": "{color.light-mode.brand.primary.300.value}",
529
531
  "public": true,
530
532
  "isReferenceToInternal": true
531
533
  },
@@ -575,116 +577,116 @@
575
577
  ]
576
578
  }
577
579
  },
578
- "platinum": {
580
+ "diamond": {
579
581
  "background": {
580
- "value": "#f0edfb",
582
+ "value": "#cfe1fc",
581
583
  "public": true,
582
- "isReferenceToInternal": true,
583
584
  "filePath": "tokens/color/alias/badge.light.json",
584
585
  "isSource": true,
585
586
  "original": {
586
- "value": "{color.light-mode.brand.secondary.100.value}",
587
- "public": true,
588
- "isReferenceToInternal": true
587
+ "value": "#CFE1FC",
588
+ "public": true
589
589
  },
590
- "name": "color-light-mode-badge-indicator-platinum-background",
590
+ "name": "color-light-mode-badge-indicator-diamond-background",
591
591
  "attributes": {
592
592
  "category": "color",
593
593
  "type": "light-mode",
594
594
  "item": "badge",
595
595
  "subitem": "indicator",
596
- "state": "platinum"
596
+ "state": "diamond"
597
597
  },
598
598
  "path": [
599
599
  "color",
600
600
  "light-mode",
601
601
  "badge",
602
602
  "indicator",
603
- "platinum",
603
+ "diamond",
604
604
  "background"
605
605
  ]
606
606
  },
607
607
  "foreground": {
608
- "value": "#3017a1",
608
+ "value": "#035ad3",
609
609
  "public": true,
610
610
  "isReferenceToInternal": true,
611
611
  "filePath": "tokens/color/alias/badge.light.json",
612
612
  "isSource": true,
613
613
  "original": {
614
- "value": "{color.light-mode.brand.secondary.400.value}",
614
+ "value": "#035AD3",
615
615
  "public": true,
616
616
  "isReferenceToInternal": true
617
617
  },
618
- "name": "color-light-mode-badge-indicator-platinum-foreground",
618
+ "name": "color-light-mode-badge-indicator-diamond-foreground",
619
619
  "attributes": {
620
620
  "category": "color",
621
621
  "type": "light-mode",
622
622
  "item": "badge",
623
623
  "subitem": "indicator",
624
- "state": "platinum"
624
+ "state": "diamond"
625
625
  },
626
626
  "path": [
627
627
  "color",
628
628
  "light-mode",
629
629
  "badge",
630
630
  "indicator",
631
- "platinum",
631
+ "diamond",
632
632
  "foreground"
633
633
  ]
634
634
  }
635
635
  },
636
- "diamond": {
636
+ "platinum": {
637
637
  "background": {
638
- "value": "#f0fdff",
638
+ "value": "#dfd8f5",
639
639
  "public": true,
640
+ "isReferenceToInternal": true,
640
641
  "filePath": "tokens/color/alias/badge.light.json",
641
642
  "isSource": true,
642
643
  "original": {
643
- "value": "#f0fdff",
644
- "public": true
644
+ "value": "{color.light-mode.brand.secondary.200.value}",
645
+ "public": true,
646
+ "isReferenceToInternal": true
645
647
  },
646
- "name": "color-light-mode-badge-indicator-diamond-background",
648
+ "name": "color-light-mode-badge-indicator-platinum-background",
647
649
  "attributes": {
648
650
  "category": "color",
649
651
  "type": "light-mode",
650
652
  "item": "badge",
651
653
  "subitem": "indicator",
652
- "state": "diamond"
654
+ "state": "platinum"
653
655
  },
654
656
  "path": [
655
657
  "color",
656
658
  "light-mode",
657
659
  "badge",
658
660
  "indicator",
659
- "diamond",
661
+ "platinum",
660
662
  "background"
661
663
  ]
662
664
  },
663
665
  "foreground": {
664
- "value": "#1d7afc",
666
+ "value": "#3017a1",
665
667
  "public": true,
666
668
  "isReferenceToInternal": true,
667
669
  "filePath": "tokens/color/alias/badge.light.json",
668
670
  "isSource": true,
669
671
  "original": {
670
- "value": "{color.light-mode.semantic.info.foreground.value}",
672
+ "value": "{color.light-mode.brand.secondary.400.value}",
671
673
  "public": true,
672
674
  "isReferenceToInternal": true
673
675
  },
674
- "name": "color-light-mode-badge-indicator-diamond-foreground",
676
+ "name": "color-light-mode-badge-indicator-platinum-foreground",
675
677
  "attributes": {
676
678
  "category": "color",
677
679
  "type": "light-mode",
678
680
  "item": "badge",
679
681
  "subitem": "indicator",
680
- "state": "diamond"
682
+ "state": "platinum"
681
683
  },
682
684
  "path": [
683
685
  "color",
684
686
  "light-mode",
685
687
  "badge",
686
688
  "indicator",
687
- "diamond",
689
+ "platinum",
688
690
  "foreground"
689
691
  ]
690
692
  }
@@ -2895,29 +2897,6 @@
2895
2897
  }
2896
2898
  },
2897
2899
  "dashboard": {
2898
- "background": {
2899
- "value": "#f8f8f8",
2900
- "public": true,
2901
- "filePath": "tokens/color/alias/dashboard.light.json",
2902
- "isSource": true,
2903
- "original": {
2904
- "value": "{color.light-mode.background.default-secondary.value}",
2905
- "public": true
2906
- },
2907
- "name": "color-light-mode-dashboard-background",
2908
- "attributes": {
2909
- "category": "color",
2910
- "type": "light-mode",
2911
- "item": "dashboard",
2912
- "subitem": "background"
2913
- },
2914
- "path": [
2915
- "color",
2916
- "light-mode",
2917
- "dashboard",
2918
- "background"
2919
- ]
2920
- },
2921
2900
  "toggle-button": {
2922
2901
  "background": {
2923
2902
  "value": "#23232d",
@@ -2971,6 +2950,31 @@
2971
2950
  }
2972
2951
  },
2973
2952
  "nav": {
2953
+ "background": {
2954
+ "value": "#f8f8f8",
2955
+ "public": true,
2956
+ "filePath": "tokens/color/alias/dashboard.light.json",
2957
+ "isSource": true,
2958
+ "original": {
2959
+ "value": "{color.light-mode.background.default-secondary.value}",
2960
+ "public": true
2961
+ },
2962
+ "name": "color-light-mode-dashboard-nav-background",
2963
+ "attributes": {
2964
+ "category": "color",
2965
+ "type": "light-mode",
2966
+ "item": "dashboard",
2967
+ "subitem": "nav",
2968
+ "state": "background"
2969
+ },
2970
+ "path": [
2971
+ "color",
2972
+ "light-mode",
2973
+ "dashboard",
2974
+ "nav",
2975
+ "background"
2976
+ ]
2977
+ },
2974
2978
  "item": {
2975
2979
  "background": {
2976
2980
  "default": {
package/build/json/pds-design-tokens.json CHANGED
@@ -568,12 +568,12 @@
568
568
  },
569
569
  "padding": {
570
570
  "base": {
571
- "value": "6%",
571
+ "value": "1.563",
572
572
  "public": true,
573
573
  "filePath": "tokens/container/base.json",
574
574
  "isSource": true,
575
575
  "original": {
576
- "value": "6%",
576
+ "value": "{spacing.XL.value}",
577
577
  "public": true
578
578
  },
579
579
  "name": "container-padding-base",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "1.0.0-dev.122",
3
+ "version": "1.0.0-dev.124",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [