@pantheon-systems/pds-design-tokens 1.0.0-dev.87 → 1.0.0-dev.88

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-dark-mode.css +1 -3
  2. package/build/css/pds-design-tokens-light-mode.css +1 -3
  3. package/build/figma/pds-design-tokens-figma.json +98 -164
  4. package/build/json/pds-design-tokens-dark-mode.json +32 -83
  5. package/build/json/pds-design-tokens-light-mode.json +40 -81
  6. package/package.json +1 -1
package/build/css/pds-design-tokens-dark-mode.css CHANGED
@@ -148,9 +148,6 @@
148
148
  --pds-color-overlay: rgba(9, 0, 48, 0.45);
149
149
  --pds-color-panel-default-background: var(--pds-color-background-default);
150
150
  --pds-color-panel-default-border: var(--pds-color-border-default);
151
- --pds-color-panel-overlay-background: #282839;
152
- --pds-color-panel-raised-background: #282839;
153
- --pds-color-panel-raised-border: var(--pds-color-border-default);
154
151
  --pds-color-panel-sunken-background: #121219;
155
152
  --pds-color-progress-complete: #2abb7f;
156
153
  --pds-color-progress-empty: #a6a3b4;
@@ -200,6 +197,7 @@
200
197
  --pds-color-tooltip-text: #121219;
201
198
  --pds-color-tooltip-trigger-icon-critical: #ca3521;
202
199
  --pds-color-tooltip-trigger-icon-default: #e7e7eb;
200
+ --pds-elevation-dropdown: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
203
201
  --pds-elevation-overlay: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
204
202
  --pds-elevation-raised: 0px 1px 1px 0px rgba(18, 18, 25, 0.95);
205
203
  }
package/build/css/pds-design-tokens-light-mode.css CHANGED
@@ -157,9 +157,6 @@
157
157
  --pds-color-pager-foreground-active: #5f41e5;
158
158
  --pds-color-panel-default-background: var(--pds-color-background-default);
159
159
  --pds-color-panel-default-border: rgba(0, 0, 0, 0.11);
160
- --pds-color-panel-overlay-background: var(--pds-color-background-default);
161
- --pds-color-panel-raised-background: var(--pds-color-background-default);
162
- --pds-color-panel-raised-border: #f1f1f1;
163
160
  --pds-color-panel-sunken-background: #f1f1f1;
164
161
  --pds-color-progress-complete: #218c5f;
165
162
  --pds-color-progress-empty: #cfcfd3;
@@ -210,6 +207,7 @@
210
207
  --pds-color-tooltip-trigger-icon-critical: #ca3521;
211
208
  --pds-color-tooltip-trigger-icon-default: #23232d;
212
209
  --pds-elevation-active: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 6px 14px 0px rgba(0, 0, 0, 0.08);
210
+ --pds-elevation-dropdown: 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 8px 12px 0px rgba(0, 0, 0, 0.15);
213
211
  --pds-elevation-overlay: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.02), 0px 8px 16px -4px rgba(0, 0, 0, 0.04), 0px 24px 32px -8px rgba(0, 0, 0, 0.06);
214
212
  --pds-elevation-raised: 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 2px 0px rgba(0, 0, 0, 0.04), 0px 8px 8px -8px rgba(0, 0, 0, 0.04);
215
213
  }
package/build/figma/pds-design-tokens-figma.json CHANGED
@@ -5722,89 +5722,6 @@
5722
5722
  "background"
5723
5723
  ]
5724
5724
  }
5725
- },
5726
- "raised": {
5727
- "background": {
5728
- "value": "#282839",
5729
- "public": true,
5730
- "isReferenceToInternal": true,
5731
- "filePath": "tokens/color/alias/panel.dark.json",
5732
- "isSource": true,
5733
- "original": {
5734
- "value": "{color.dark-mode.neutral.500.value}",
5735
- "public": true,
5736
- "isReferenceToInternal": true
5737
- },
5738
- "name": "color-dark-mode-panel-raised-background",
5739
- "attributes": {
5740
- "category": "color",
5741
- "type": "dark-mode",
5742
- "item": "panel",
5743
- "subitem": "raised",
5744
- "state": "background"
5745
- },
5746
- "path": [
5747
- "color",
5748
- "dark-mode",
5749
- "panel",
5750
- "raised",
5751
- "background"
5752
- ]
5753
- },
5754
- "border": {
5755
- "value": "#504e62",
5756
- "public": true,
5757
- "filePath": "tokens/color/alias/panel.dark.json",
5758
- "isSource": true,
5759
- "original": {
5760
- "value": "{color.dark-mode.border.default}",
5761
- "public": true
5762
- },
5763
- "name": "color-dark-mode-panel-raised-border",
5764
- "attributes": {
5765
- "category": "color",
5766
- "type": "dark-mode",
5767
- "item": "panel",
5768
- "subitem": "raised",
5769
- "state": "border"
5770
- },
5771
- "path": [
5772
- "color",
5773
- "dark-mode",
5774
- "panel",
5775
- "raised",
5776
- "border"
5777
- ]
5778
- }
5779
- },
5780
- "overlay": {
5781
- "background": {
5782
- "value": "#282839",
5783
- "public": true,
5784
- "isReferenceToInternal": true,
5785
- "filePath": "tokens/color/alias/panel.dark.json",
5786
- "isSource": true,
5787
- "original": {
5788
- "value": "{color.dark-mode.neutral.500.value}",
5789
- "public": true,
5790
- "isReferenceToInternal": true
5791
- },
5792
- "name": "color-dark-mode-panel-overlay-background",
5793
- "attributes": {
5794
- "category": "color",
5795
- "type": "dark-mode",
5796
- "item": "panel",
5797
- "subitem": "overlay",
5798
- "state": "background"
5799
- },
5800
- "path": [
5801
- "color",
5802
- "dark-mode",
5803
- "panel",
5804
- "overlay",
5805
- "background"
5806
- ]
5807
- }
5808
5725
  }
5809
5726
  },
5810
5727
  "expansion-panel": {
@@ -11840,87 +11757,6 @@
11840
11757
  "background"
11841
11758
  ]
11842
11759
  }
11843
- },
11844
- "raised": {
11845
- "background": {
11846
- "value": "#ffffff",
11847
- "public": true,
11848
- "filePath": "tokens/color/alias/panel.light.json",
11849
- "isSource": true,
11850
- "original": {
11851
- "value": "{color.light-mode.background.default}",
11852
- "public": true
11853
- },
11854
- "name": "color-light-mode-panel-raised-background",
11855
- "attributes": {
11856
- "category": "color",
11857
- "type": "light-mode",
11858
- "item": "panel",
11859
- "subitem": "raised",
11860
- "state": "background"
11861
- },
11862
- "path": [
11863
- "color",
11864
- "light-mode",
11865
- "panel",
11866
- "raised",
11867
- "background"
11868
- ]
11869
- },
11870
- "border": {
11871
- "value": "#f1f1f1",
11872
- "public": true,
11873
- "isReferenceToInternal": true,
11874
- "filePath": "tokens/color/alias/panel.light.json",
11875
- "isSource": true,
11876
- "original": {
11877
- "value": "{color.light-mode.neutral.200.value}",
11878
- "public": true,
11879
- "isReferenceToInternal": true
11880
- },
11881
- "name": "color-light-mode-panel-raised-border",
11882
- "attributes": {
11883
- "category": "color",
11884
- "type": "light-mode",
11885
- "item": "panel",
11886
- "subitem": "raised",
11887
- "state": "border"
11888
- },
11889
- "path": [
11890
- "color",
11891
- "light-mode",
11892
- "panel",
11893
- "raised",
11894
- "border"
11895
- ]
11896
- }
11897
- },
11898
- "overlay": {
11899
- "background": {
11900
- "value": "#ffffff",
11901
- "public": true,
11902
- "filePath": "tokens/color/alias/panel.light.json",
11903
- "isSource": true,
11904
- "original": {
11905
- "value": "{color.light-mode.background.default}",
11906
- "public": true
11907
- },
11908
- "name": "color-light-mode-panel-overlay-background",
11909
- "attributes": {
11910
- "category": "color",
11911
- "type": "light-mode",
11912
- "item": "panel",
11913
- "subitem": "overlay",
11914
- "state": "background"
11915
- },
11916
- "path": [
11917
- "color",
11918
- "light-mode",
11919
- "panel",
11920
- "overlay",
11921
- "background"
11922
- ]
11923
- }
11924
11760
  }
11925
11761
  },
11926
11762
  "expansion-panel": {
@@ -14188,6 +14024,47 @@
14188
14024
  "dark-mode",
14189
14025
  "overlay"
14190
14026
  ]
14027
+ },
14028
+ "dropdown": {
14029
+ "value": [
14030
+ {
14031
+ "x": "0",
14032
+ "y": "8",
14033
+ "blur": "12",
14034
+ "spread": "0",
14035
+ "color": "rgba(18, 18, 25, 0.6)",
14036
+ "type": "dropShadow"
14037
+ }
14038
+ ],
14039
+ "type": "boxShadow",
14040
+ "public": true,
14041
+ "filePath": "tokens/elevation/base.dark.json",
14042
+ "isSource": true,
14043
+ "original": {
14044
+ "value": [
14045
+ {
14046
+ "x": "0",
14047
+ "y": "8",
14048
+ "blur": "12",
14049
+ "spread": "0",
14050
+ "color": "rgba(18, 18, 25, 0.6)",
14051
+ "type": "dropShadow"
14052
+ }
14053
+ ],
14054
+ "type": "boxShadow",
14055
+ "public": true
14056
+ },
14057
+ "name": "elevation-dark-mode-dropdown",
14058
+ "attributes": {
14059
+ "category": "elevation",
14060
+ "type": "dark-mode",
14061
+ "item": "dropdown"
14062
+ },
14063
+ "path": [
14064
+ "elevation",
14065
+ "dark-mode",
14066
+ "dropdown"
14067
+ ]
14191
14068
  }
14192
14069
  },
14193
14070
  "light-mode": {
@@ -14409,6 +14286,63 @@
14409
14286
  "light-mode",
14410
14287
  "overlay"
14411
14288
  ]
14289
+ },
14290
+ "dropdown": {
14291
+ "value": [
14292
+ {
14293
+ "x": "0",
14294
+ "y": "1",
14295
+ "blur": "3",
14296
+ "spread": "0",
14297
+ "color": "rgba(0, 0, 0, 0.1)",
14298
+ "type": "dropShadow"
14299
+ },
14300
+ {
14301
+ "x": "0",
14302
+ "y": "8",
14303
+ "blur": "12",
14304
+ "spread": "0",
14305
+ "color": "rgba(0, 0, 0, 0.15)",
14306
+ "type": "dropShadow"
14307
+ }
14308
+ ],
14309
+ "type": "boxShadow",
14310
+ "public": true,
14311
+ "filePath": "tokens/elevation/base.light.json",
14312
+ "isSource": true,
14313
+ "original": {
14314
+ "value": [
14315
+ {
14316
+ "x": "0",
14317
+ "y": "1",
14318
+ "blur": "3",
14319
+ "spread": "0",
14320
+ "color": "rgba(0, 0, 0, 0.1)",
14321
+ "type": "dropShadow"
14322
+ },
14323
+ {
14324
+ "x": "0",
14325
+ "y": "8",
14326
+ "blur": "12",
14327
+ "spread": "0",
14328
+ "color": "rgba(0, 0, 0, 0.15)",
14329
+ "type": "dropShadow"
14330
+ }
14331
+ ],
14332
+ "type": "boxShadow",
14333
+ "public": true
14334
+ },
14335
+ "name": "elevation-light-mode-dropdown",
14336
+ "attributes": {
14337
+ "category": "elevation",
14338
+ "type": "light-mode",
14339
+ "item": "dropdown"
14340
+ },
14341
+ "path": [
14342
+ "elevation",
14343
+ "light-mode",
14344
+ "dropdown"
14345
+ ]
14412
14346
  }
14413
14347
  }
14414
14348
  }
package/build/json/pds-design-tokens-dark-mode.json CHANGED
@@ -3743,89 +3743,6 @@
3743
3743
  "background"
3744
3744
  ]
3745
3745
  }
3746
- },
3747
- "raised": {
3748
- "background": {
3749
- "value": "#282839",
3750
- "public": true,
3751
- "isReferenceToInternal": true,
3752
- "filePath": "tokens/color/alias/panel.dark.json",
3753
- "isSource": true,
3754
- "original": {
3755
- "value": "{color.dark-mode.neutral.500.value}",
3756
- "public": true,
3757
- "isReferenceToInternal": true
3758
- },
3759
- "name": "color-dark-mode-panel-raised-background",
3760
- "attributes": {
3761
- "category": "color",
3762
- "type": "dark-mode",
3763
- "item": "panel",
3764
- "subitem": "raised",
3765
- "state": "background"
3766
- },
3767
- "path": [
3768
- "color",
3769
- "dark-mode",
3770
- "panel",
3771
- "raised",
3772
- "background"
3773
- ]
3774
- },
3775
- "border": {
3776
- "value": "#504e62",
3777
- "public": true,
3778
- "filePath": "tokens/color/alias/panel.dark.json",
3779
- "isSource": true,
3780
- "original": {
3781
- "value": "{color.dark-mode.border.default}",
3782
- "public": true
3783
- },
3784
- "name": "color-dark-mode-panel-raised-border",
3785
- "attributes": {
3786
- "category": "color",
3787
- "type": "dark-mode",
3788
- "item": "panel",
3789
- "subitem": "raised",
3790
- "state": "border"
3791
- },
3792
- "path": [
3793
- "color",
3794
- "dark-mode",
3795
- "panel",
3796
- "raised",
3797
- "border"
3798
- ]
3799
- }
3800
- },
3801
- "overlay": {
3802
- "background": {
3803
- "value": "#282839",
3804
- "public": true,
3805
- "isReferenceToInternal": true,
3806
- "filePath": "tokens/color/alias/panel.dark.json",
3807
- "isSource": true,
3808
- "original": {
3809
- "value": "{color.dark-mode.neutral.500.value}",
3810
- "public": true,
3811
- "isReferenceToInternal": true
3812
- },
3813
- "name": "color-dark-mode-panel-overlay-background",
3814
- "attributes": {
3815
- "category": "color",
3816
- "type": "dark-mode",
3817
- "item": "panel",
3818
- "subitem": "overlay",
3819
- "state": "background"
3820
- },
3821
- "path": [
3822
- "color",
3823
- "dark-mode",
3824
- "panel",
3825
- "overlay",
3826
- "background"
3827
- ]
3828
- }
3829
3746
  }
3830
3747
  },
3831
3748
  "expansion-panel": {
@@ -6218,6 +6135,38 @@
6218
6135
  "dark-mode",
6219
6136
  "overlay"
6220
6137
  ]
6138
+ },
6139
+ "dropdown": {
6140
+ "value": "0px 8px 12px 0px rgba(18, 18, 25, 0.6)",
6141
+ "type": "boxShadow",
6142
+ "public": true,
6143
+ "filePath": "tokens/elevation/base.dark.json",
6144
+ "isSource": true,
6145
+ "original": {
6146
+ "value": [
6147
+ {
6148
+ "x": "0",
6149
+ "y": "8",
6150
+ "blur": "12",
6151
+ "spread": "0",
6152
+ "color": "rgba(18, 18, 25, 0.6)",
6153
+ "type": "dropShadow"
6154
+ }
6155
+ ],
6156
+ "type": "boxShadow",
6157
+ "public": true
6158
+ },
6159
+ "name": "elevation-dark-mode-dropdown",
6160
+ "attributes": {
6161
+ "category": "elevation",
6162
+ "type": "dark-mode",
6163
+ "item": "dropdown"
6164
+ },
6165
+ "path": [
6166
+ "elevation",
6167
+ "dark-mode",
6168
+ "dropdown"
6169
+ ]
6221
6170
  }
6222
6171
  }
6223
6172
  }
package/build/json/pds-design-tokens-light-mode.json CHANGED
@@ -3822,87 +3822,6 @@
3822
3822
  "background"
3823
3823
  ]
3824
3824
  }
3825
- },
3826
- "raised": {
3827
- "background": {
3828
- "value": "#ffffff",
3829
- "public": true,
3830
- "filePath": "tokens/color/alias/panel.light.json",
3831
- "isSource": true,
3832
- "original": {
3833
- "value": "{color.light-mode.background.default}",
3834
- "public": true
3835
- },
3836
- "name": "color-light-mode-panel-raised-background",
3837
- "attributes": {
3838
- "category": "color",
3839
- "type": "light-mode",
3840
- "item": "panel",
3841
- "subitem": "raised",
3842
- "state": "background"
3843
- },
3844
- "path": [
3845
- "color",
3846
- "light-mode",
3847
- "panel",
3848
- "raised",
3849
- "background"
3850
- ]
3851
- },
3852
- "border": {
3853
- "value": "#f1f1f1",
3854
- "public": true,
3855
- "isReferenceToInternal": true,
3856
- "filePath": "tokens/color/alias/panel.light.json",
3857
- "isSource": true,
3858
- "original": {
3859
- "value": "{color.light-mode.neutral.200.value}",
3860
- "public": true,
3861
- "isReferenceToInternal": true
3862
- },
3863
- "name": "color-light-mode-panel-raised-border",
3864
- "attributes": {
3865
- "category": "color",
3866
- "type": "light-mode",
3867
- "item": "panel",
3868
- "subitem": "raised",
3869
- "state": "border"
3870
- },
3871
- "path": [
3872
- "color",
3873
- "light-mode",
3874
- "panel",
3875
- "raised",
3876
- "border"
3877
- ]
3878
- }
3879
- },
3880
- "overlay": {
3881
- "background": {
3882
- "value": "#ffffff",
3883
- "public": true,
3884
- "filePath": "tokens/color/alias/panel.light.json",
3885
- "isSource": true,
3886
- "original": {
3887
- "value": "{color.light-mode.background.default}",
3888
- "public": true
3889
- },
3890
- "name": "color-light-mode-panel-overlay-background",
3891
- "attributes": {
3892
- "category": "color",
3893
- "type": "light-mode",
3894
- "item": "panel",
3895
- "subitem": "overlay",
3896
- "state": "background"
3897
- },
3898
- "path": [
3899
- "color",
3900
- "light-mode",
3901
- "panel",
3902
- "overlay",
3903
- "background"
3904
- ]
3905
- }
3906
3825
  }
3907
3826
  },
3908
3827
  "expansion-panel": {
@@ -6345,6 +6264,46 @@
6345
6264
  "light-mode",
6346
6265
  "overlay"
6347
6266
  ]
6267
+ },
6268
+ "dropdown": {
6269
+ "value": "0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 8px 12px 0px rgba(0, 0, 0, 0.15)",
6270
+ "type": "boxShadow",
6271
+ "public": true,
6272
+ "filePath": "tokens/elevation/base.light.json",
6273
+ "isSource": true,
6274
+ "original": {
6275
+ "value": [
6276
+ {
6277
+ "x": "0",
6278
+ "y": "1",
6279
+ "blur": "3",
6280
+ "spread": "0",
6281
+ "color": "rgba(0, 0, 0, 0.1)",
6282
+ "type": "dropShadow"
6283
+ },
6284
+ {
6285
+ "x": "0",
6286
+ "y": "8",
6287
+ "blur": "12",
6288
+ "spread": "0",
6289
+ "color": "rgba(0, 0, 0, 0.15)",
6290
+ "type": "dropShadow"
6291
+ }
6292
+ ],
6293
+ "type": "boxShadow",
6294
+ "public": true
6295
+ },
6296
+ "name": "elevation-light-mode-dropdown",
6297
+ "attributes": {
6298
+ "category": "elevation",
6299
+ "type": "light-mode",
6300
+ "item": "dropdown"
6301
+ },
6302
+ "path": [
6303
+ "elevation",
6304
+ "light-mode",
6305
+ "dropdown"
6306
+ ]
6348
6307
  }
6349
6308
  }
6350
6309
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "1.0.0-dev.87",
3
+ "version": "1.0.0-dev.88",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [