@pantheon-systems/pds-design-tokens 0.7.0-dev.2 → 0.7.0-dev.4

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 (8) hide show
  1. package/build/css/pds-design-tokens-dark-mode.css +9 -0
  2. package/build/css/pds-design-tokens-light-mode.css +10 -1
  3. package/build/figma/pds-design-tokens-figma.json +491 -7
  4. package/build/json/pds-design-tokens-dark-mode.json +245 -0
  5. package/build/json/pds-design-tokens-light-mode.json +242 -3
  6. package/build/scss/_pds-design-tokens-dark-mode.scss +9 -0
  7. package/build/scss/_pds-design-tokens-light-mode.scss +10 -1
  8. package/package.json +1 -1
package/build/css/pds-design-tokens-dark-mode.css CHANGED
@@ -63,8 +63,17 @@
63
63
  --pds-color-link-default: #36a3ff;
64
64
  --pds-color-link-hover: #2776b9;
65
65
  --pds-color-link-visited: #967fff;
66
+ --pds-color-panel-default-background: var(--pds-color-background-default);
67
+ --pds-color-panel-default-border: var(--pds-color-border-default);
68
+ --pds-color-panel-overlay-background: #282839;
69
+ --pds-color-panel-overlay-border: #282839;
70
+ --pds-color-panel-raised-background: #282839;
71
+ --pds-color-panel-raised-border: var(--pds-color-border-default);
72
+ --pds-color-panel-sunken-background: #121219;
73
+ --pds-color-panel-sunken-border: #121219;
66
74
  --pds-color-text-default: #ffffff;
67
75
  --pds-color-text-headings: var(--pds-color-text-default);
76
+ --pds-color-text-overline: #858299;
68
77
  --pds-color-text-paragraph: var(--pds-color-text-default);
69
78
  --pds-elevation-overlay: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
70
79
  --pds-elevation-raised: 0px 1px 1px 0px rgba(18, 18, 25, 0.95);
package/build/css/pds-design-tokens-light-mode.css CHANGED
@@ -11,7 +11,7 @@
11
11
 
12
12
  :root {
13
13
  --pds-color-background-default: #ffffff;
14
- --pds-color-border-default: #71717c;
14
+ --pds-color-border-default: #cfcfd3;
15
15
  --pds-color-brand-accent-default: #de0093;
16
16
  --pds-color-brand-primary-default: #ffdc28;
17
17
  --pds-color-brand-secondary-default: #3017a1;
@@ -63,8 +63,17 @@
63
63
  --pds-color-link-default: #0f62fe;
64
64
  --pds-color-link-hover: #003cac;
65
65
  --pds-color-link-visited: #967fff;
66
+ --pds-color-panel-default-background: var(--pds-color-background-default);
67
+ --pds-color-panel-default-border: var(--pds-color-border-default);
68
+ --pds-color-panel-overlay-background: var(--pds-color-background-default);
69
+ --pds-color-panel-overlay-border: var(--pds-color-border-default);
70
+ --pds-color-panel-raised-background: var(--pds-color-background-default);
71
+ --pds-color-panel-raised-border: var(--pds-color-border-default);
72
+ --pds-color-panel-sunken-background: #23232d;
73
+ --pds-color-panel-sunken-border: #23232d;
66
74
  --pds-color-text-default: #23232d;
67
75
  --pds-color-text-headings: var(--pds-color-text-default);
76
+ --pds-color-text-overline: #71717c;
68
77
  --pds-color-text-paragraph: #23232d;
69
78
  --pds-elevation-overlay: 0px 8px 12px 0px rgba(113, 113, 124, 0.25), 0px 0px 1px 0px rgba(18, 18, 25, 0.25);
70
79
  --pds-elevation-raised: 0px 1px 1px 0px #aeaeb6, 0px 0px 1px 0px rgba(18, 18, 25, 0.25);
package/build/figma/pds-design-tokens-figma.json CHANGED
@@ -93,7 +93,7 @@
93
93
  "value": {
94
94
  "fontSize": "1.953 * 16",
95
95
  "fontFamily": "Aleo",
96
- "fontWeight": "Italic",
96
+ "fontWeight": 400,
97
97
  "lineHeight": "125%"
98
98
  },
99
99
  "type": "typography",
@@ -103,7 +103,7 @@
103
103
  "value": {
104
104
  "fontSize": "{typography.size.2XL} * {figma.typography.size.base}",
105
105
  "fontFamily": "Aleo",
106
- "fontWeight": "Italic",
106
+ "fontWeight": "{typography.font-weight.regular}",
107
107
  "lineHeight": "{typography.line-height.S}"
108
108
  },
109
109
  "type": "typography"
@@ -124,7 +124,7 @@
124
124
  "value": {
125
125
  "fontSize": "2.441 * 16",
126
126
  "fontFamily": "Aleo",
127
- "fontWeight": 700,
127
+ "fontWeight": "Italic",
128
128
  "letterSpacing": "0.01 * 100%",
129
129
  "lineHeight": "125%"
130
130
  },
@@ -135,7 +135,7 @@
135
135
  "value": {
136
136
  "fontSize": "{typography.size.3XL} * {figma.typography.size.base}",
137
137
  "fontFamily": "Aleo",
138
- "fontWeight": "{typography.font-weight.bold}",
138
+ "fontWeight": "Italic",
139
139
  "letterSpacing": "{typography.letter-spacing.S} * 100%",
140
140
  "lineHeight": "{typography.line-height.S}"
141
141
  },
@@ -2766,6 +2766,226 @@
2766
2766
  ]
2767
2767
  }
2768
2768
  },
2769
+ "panel": {
2770
+ "default": {
2771
+ "background": {
2772
+ "value": "#1d1d29",
2773
+ "public": true,
2774
+ "filePath": "tokens/color/alias/panel.dark.json",
2775
+ "isSource": true,
2776
+ "original": {
2777
+ "value": "{color.dark-mode.background.default}",
2778
+ "public": true
2779
+ },
2780
+ "name": "color-dark-mode-panel-default-background",
2781
+ "attributes": {
2782
+ "category": "color",
2783
+ "type": "dark-mode",
2784
+ "item": "panel",
2785
+ "subitem": "default",
2786
+ "state": "background"
2787
+ },
2788
+ "path": [
2789
+ "color",
2790
+ "dark-mode",
2791
+ "panel",
2792
+ "default",
2793
+ "background"
2794
+ ]
2795
+ },
2796
+ "border": {
2797
+ "value": "#504e62",
2798
+ "public": true,
2799
+ "filePath": "tokens/color/alias/panel.dark.json",
2800
+ "isSource": true,
2801
+ "original": {
2802
+ "value": "{color.dark-mode.border.default}",
2803
+ "public": true
2804
+ },
2805
+ "name": "color-dark-mode-panel-default-border",
2806
+ "attributes": {
2807
+ "category": "color",
2808
+ "type": "dark-mode",
2809
+ "item": "panel",
2810
+ "subitem": "default",
2811
+ "state": "border"
2812
+ },
2813
+ "path": [
2814
+ "color",
2815
+ "dark-mode",
2816
+ "panel",
2817
+ "default",
2818
+ "border"
2819
+ ]
2820
+ }
2821
+ },
2822
+ "sunken": {
2823
+ "background": {
2824
+ "value": "#121219",
2825
+ "public": true,
2826
+ "isReferenceToInternal": true,
2827
+ "filePath": "tokens/color/alias/panel.dark.json",
2828
+ "isSource": true,
2829
+ "original": {
2830
+ "value": "{color.dark-mode.neutral.700.value}",
2831
+ "public": true,
2832
+ "isReferenceToInternal": true
2833
+ },
2834
+ "name": "color-dark-mode-panel-sunken-background",
2835
+ "attributes": {
2836
+ "category": "color",
2837
+ "type": "dark-mode",
2838
+ "item": "panel",
2839
+ "subitem": "sunken",
2840
+ "state": "background"
2841
+ },
2842
+ "path": [
2843
+ "color",
2844
+ "dark-mode",
2845
+ "panel",
2846
+ "sunken",
2847
+ "background"
2848
+ ]
2849
+ },
2850
+ "border": {
2851
+ "value": "#121219",
2852
+ "public": true,
2853
+ "isReferenceToInternal": true,
2854
+ "filePath": "tokens/color/alias/panel.dark.json",
2855
+ "isSource": true,
2856
+ "original": {
2857
+ "value": "{color.dark-mode.neutral.700.value}",
2858
+ "public": true,
2859
+ "isReferenceToInternal": true
2860
+ },
2861
+ "name": "color-dark-mode-panel-sunken-border",
2862
+ "attributes": {
2863
+ "category": "color",
2864
+ "type": "dark-mode",
2865
+ "item": "panel",
2866
+ "subitem": "sunken",
2867
+ "state": "border"
2868
+ },
2869
+ "path": [
2870
+ "color",
2871
+ "dark-mode",
2872
+ "panel",
2873
+ "sunken",
2874
+ "border"
2875
+ ]
2876
+ }
2877
+ },
2878
+ "raised": {
2879
+ "background": {
2880
+ "value": "#282839",
2881
+ "public": true,
2882
+ "isReferenceToInternal": true,
2883
+ "filePath": "tokens/color/alias/panel.dark.json",
2884
+ "isSource": true,
2885
+ "original": {
2886
+ "value": "{color.dark-mode.neutral.500.value}",
2887
+ "public": true,
2888
+ "isReferenceToInternal": true
2889
+ },
2890
+ "name": "color-dark-mode-panel-raised-background",
2891
+ "attributes": {
2892
+ "category": "color",
2893
+ "type": "dark-mode",
2894
+ "item": "panel",
2895
+ "subitem": "raised",
2896
+ "state": "background"
2897
+ },
2898
+ "path": [
2899
+ "color",
2900
+ "dark-mode",
2901
+ "panel",
2902
+ "raised",
2903
+ "background"
2904
+ ]
2905
+ },
2906
+ "border": {
2907
+ "value": "#504e62",
2908
+ "public": true,
2909
+ "filePath": "tokens/color/alias/panel.dark.json",
2910
+ "isSource": true,
2911
+ "original": {
2912
+ "value": "{color.dark-mode.border.default}",
2913
+ "public": true
2914
+ },
2915
+ "name": "color-dark-mode-panel-raised-border",
2916
+ "attributes": {
2917
+ "category": "color",
2918
+ "type": "dark-mode",
2919
+ "item": "panel",
2920
+ "subitem": "raised",
2921
+ "state": "border"
2922
+ },
2923
+ "path": [
2924
+ "color",
2925
+ "dark-mode",
2926
+ "panel",
2927
+ "raised",
2928
+ "border"
2929
+ ]
2930
+ }
2931
+ },
2932
+ "overlay": {
2933
+ "background": {
2934
+ "value": "#282839",
2935
+ "public": true,
2936
+ "isReferenceToInternal": true,
2937
+ "filePath": "tokens/color/alias/panel.dark.json",
2938
+ "isSource": true,
2939
+ "original": {
2940
+ "value": "{color.dark-mode.neutral.500.value}",
2941
+ "public": true,
2942
+ "isReferenceToInternal": true
2943
+ },
2944
+ "name": "color-dark-mode-panel-overlay-background",
2945
+ "attributes": {
2946
+ "category": "color",
2947
+ "type": "dark-mode",
2948
+ "item": "panel",
2949
+ "subitem": "overlay",
2950
+ "state": "background"
2951
+ },
2952
+ "path": [
2953
+ "color",
2954
+ "dark-mode",
2955
+ "panel",
2956
+ "overlay",
2957
+ "background"
2958
+ ]
2959
+ },
2960
+ "border": {
2961
+ "value": "#282839",
2962
+ "public": true,
2963
+ "isReferenceToInternal": true,
2964
+ "filePath": "tokens/color/alias/panel.dark.json",
2965
+ "isSource": true,
2966
+ "original": {
2967
+ "value": "{color.dark-mode.neutral.500.value}",
2968
+ "public": true,
2969
+ "isReferenceToInternal": true
2970
+ },
2971
+ "name": "color-dark-mode-panel-overlay-border",
2972
+ "attributes": {
2973
+ "category": "color",
2974
+ "type": "dark-mode",
2975
+ "item": "panel",
2976
+ "subitem": "overlay",
2977
+ "state": "border"
2978
+ },
2979
+ "path": [
2980
+ "color",
2981
+ "dark-mode",
2982
+ "panel",
2983
+ "overlay",
2984
+ "border"
2985
+ ]
2986
+ }
2987
+ }
2988
+ },
2769
2989
  "text": {
2770
2990
  "default": {
2771
2991
  "value": "#ffffff",
@@ -2837,6 +3057,31 @@
2837
3057
  "text",
2838
3058
  "headings"
2839
3059
  ]
3060
+ },
3061
+ "overline": {
3062
+ "value": "#858299",
3063
+ "public": true,
3064
+ "isReferenceToInternal": true,
3065
+ "filePath": "tokens/color/alias/typography.dark.json",
3066
+ "isSource": true,
3067
+ "original": {
3068
+ "value": "{color.dark-mode.neutral.300.value}",
3069
+ "public": true,
3070
+ "isReferenceToInternal": true
3071
+ },
3072
+ "name": "color-dark-mode-text-overline",
3073
+ "attributes": {
3074
+ "category": "color",
3075
+ "type": "dark-mode",
3076
+ "item": "text",
3077
+ "subitem": "overline"
3078
+ },
3079
+ "path": [
3080
+ "color",
3081
+ "dark-mode",
3082
+ "text",
3083
+ "overline"
3084
+ ]
2840
3085
  }
2841
3086
  },
2842
3087
  "brand": {
@@ -4484,13 +4729,13 @@
4484
4729
  },
4485
4730
  "border": {
4486
4731
  "default": {
4487
- "value": "#71717c",
4732
+ "value": "#cfcfd3",
4488
4733
  "public": true,
4489
4734
  "isReferenceToInternal": true,
4490
4735
  "filePath": "tokens/color/alias/defaults.light.json",
4491
4736
  "isSource": true,
4492
4737
  "original": {
4493
- "value": "{color.light-mode.neutral.400.value}",
4738
+ "value": "{color.light-mode.neutral.100.value}",
4494
4739
  "public": true,
4495
4740
  "isReferenceToInternal": true
4496
4741
  },
@@ -4595,7 +4840,7 @@
4595
4840
  },
4596
4841
  "border": {
4597
4842
  "default": {
4598
- "value": "#71717c",
4843
+ "value": "#cfcfd3",
4599
4844
  "public": true,
4600
4845
  "filePath": "tokens/color/alias/input.light.json",
4601
4846
  "isSource": true,
@@ -5730,6 +5975,220 @@
5730
5975
  ]
5731
5976
  }
5732
5977
  },
5978
+ "panel": {
5979
+ "default": {
5980
+ "background": {
5981
+ "value": "#ffffff",
5982
+ "public": true,
5983
+ "filePath": "tokens/color/alias/panel.light.json",
5984
+ "isSource": true,
5985
+ "original": {
5986
+ "value": "{color.light-mode.background.default}",
5987
+ "public": true
5988
+ },
5989
+ "name": "color-light-mode-panel-default-background",
5990
+ "attributes": {
5991
+ "category": "color",
5992
+ "type": "light-mode",
5993
+ "item": "panel",
5994
+ "subitem": "default",
5995
+ "state": "background"
5996
+ },
5997
+ "path": [
5998
+ "color",
5999
+ "light-mode",
6000
+ "panel",
6001
+ "default",
6002
+ "background"
6003
+ ]
6004
+ },
6005
+ "border": {
6006
+ "value": "#cfcfd3",
6007
+ "public": true,
6008
+ "filePath": "tokens/color/alias/panel.light.json",
6009
+ "isSource": true,
6010
+ "original": {
6011
+ "value": "{color.light-mode.border.default}",
6012
+ "public": true
6013
+ },
6014
+ "name": "color-light-mode-panel-default-border",
6015
+ "attributes": {
6016
+ "category": "color",
6017
+ "type": "light-mode",
6018
+ "item": "panel",
6019
+ "subitem": "default",
6020
+ "state": "border"
6021
+ },
6022
+ "path": [
6023
+ "color",
6024
+ "light-mode",
6025
+ "panel",
6026
+ "default",
6027
+ "border"
6028
+ ]
6029
+ }
6030
+ },
6031
+ "sunken": {
6032
+ "background": {
6033
+ "value": "#23232d",
6034
+ "public": true,
6035
+ "isReferenceToInternal": true,
6036
+ "filePath": "tokens/color/alias/panel.light.json",
6037
+ "isSource": true,
6038
+ "original": {
6039
+ "value": "{color.light-mode.neutral.700.value}",
6040
+ "public": true,
6041
+ "isReferenceToInternal": true
6042
+ },
6043
+ "name": "color-light-mode-panel-sunken-background",
6044
+ "attributes": {
6045
+ "category": "color",
6046
+ "type": "light-mode",
6047
+ "item": "panel",
6048
+ "subitem": "sunken",
6049
+ "state": "background"
6050
+ },
6051
+ "path": [
6052
+ "color",
6053
+ "light-mode",
6054
+ "panel",
6055
+ "sunken",
6056
+ "background"
6057
+ ]
6058
+ },
6059
+ "border": {
6060
+ "value": "#23232d",
6061
+ "public": true,
6062
+ "isReferenceToInternal": true,
6063
+ "filePath": "tokens/color/alias/panel.light.json",
6064
+ "isSource": true,
6065
+ "original": {
6066
+ "value": "{color.light-mode.neutral.700.value}",
6067
+ "public": true,
6068
+ "isReferenceToInternal": true
6069
+ },
6070
+ "name": "color-light-mode-panel-sunken-border",
6071
+ "attributes": {
6072
+ "category": "color",
6073
+ "type": "light-mode",
6074
+ "item": "panel",
6075
+ "subitem": "sunken",
6076
+ "state": "border"
6077
+ },
6078
+ "path": [
6079
+ "color",
6080
+ "light-mode",
6081
+ "panel",
6082
+ "sunken",
6083
+ "border"
6084
+ ]
6085
+ }
6086
+ },
6087
+ "raised": {
6088
+ "background": {
6089
+ "value": "#ffffff",
6090
+ "public": true,
6091
+ "filePath": "tokens/color/alias/panel.light.json",
6092
+ "isSource": true,
6093
+ "original": {
6094
+ "value": "{color.light-mode.background.default}",
6095
+ "public": true
6096
+ },
6097
+ "name": "color-light-mode-panel-raised-background",
6098
+ "attributes": {
6099
+ "category": "color",
6100
+ "type": "light-mode",
6101
+ "item": "panel",
6102
+ "subitem": "raised",
6103
+ "state": "background"
6104
+ },
6105
+ "path": [
6106
+ "color",
6107
+ "light-mode",
6108
+ "panel",
6109
+ "raised",
6110
+ "background"
6111
+ ]
6112
+ },
6113
+ "border": {
6114
+ "value": "#cfcfd3",
6115
+ "public": true,
6116
+ "filePath": "tokens/color/alias/panel.light.json",
6117
+ "isSource": true,
6118
+ "original": {
6119
+ "value": "{color.light-mode.border.default}",
6120
+ "public": true
6121
+ },
6122
+ "name": "color-light-mode-panel-raised-border",
6123
+ "attributes": {
6124
+ "category": "color",
6125
+ "type": "light-mode",
6126
+ "item": "panel",
6127
+ "subitem": "raised",
6128
+ "state": "border"
6129
+ },
6130
+ "path": [
6131
+ "color",
6132
+ "light-mode",
6133
+ "panel",
6134
+ "raised",
6135
+ "border"
6136
+ ]
6137
+ }
6138
+ },
6139
+ "overlay": {
6140
+ "background": {
6141
+ "value": "#ffffff",
6142
+ "public": true,
6143
+ "filePath": "tokens/color/alias/panel.light.json",
6144
+ "isSource": true,
6145
+ "original": {
6146
+ "value": "{color.light-mode.background.default}",
6147
+ "public": true
6148
+ },
6149
+ "name": "color-light-mode-panel-overlay-background",
6150
+ "attributes": {
6151
+ "category": "color",
6152
+ "type": "light-mode",
6153
+ "item": "panel",
6154
+ "subitem": "overlay",
6155
+ "state": "background"
6156
+ },
6157
+ "path": [
6158
+ "color",
6159
+ "light-mode",
6160
+ "panel",
6161
+ "overlay",
6162
+ "background"
6163
+ ]
6164
+ },
6165
+ "border": {
6166
+ "value": "#cfcfd3",
6167
+ "public": true,
6168
+ "filePath": "tokens/color/alias/panel.light.json",
6169
+ "isSource": true,
6170
+ "original": {
6171
+ "value": "{color.light-mode.border.default}",
6172
+ "public": true
6173
+ },
6174
+ "name": "color-light-mode-panel-overlay-border",
6175
+ "attributes": {
6176
+ "category": "color",
6177
+ "type": "light-mode",
6178
+ "item": "panel",
6179
+ "subitem": "overlay",
6180
+ "state": "border"
6181
+ },
6182
+ "path": [
6183
+ "color",
6184
+ "light-mode",
6185
+ "panel",
6186
+ "overlay",
6187
+ "border"
6188
+ ]
6189
+ }
6190
+ }
6191
+ },
5733
6192
  "text": {
5734
6193
  "default": {
5735
6194
  "value": "#23232d",
@@ -5803,6 +6262,31 @@
5803
6262
  "text",
5804
6263
  "headings"
5805
6264
  ]
6265
+ },
6266
+ "overline": {
6267
+ "value": "#71717c",
6268
+ "public": true,
6269
+ "isReferenceToInternal": true,
6270
+ "filePath": "tokens/color/alias/typography.light.json",
6271
+ "isSource": true,
6272
+ "original": {
6273
+ "value": "{color.light-mode.neutral.400.value}",
6274
+ "public": true,
6275
+ "isReferenceToInternal": true
6276
+ },
6277
+ "name": "color-light-mode-text-overline",
6278
+ "attributes": {
6279
+ "category": "color",
6280
+ "type": "light-mode",
6281
+ "item": "text",
6282
+ "subitem": "overline"
6283
+ },
6284
+ "path": [
6285
+ "color",
6286
+ "light-mode",
6287
+ "text",
6288
+ "overline"
6289
+ ]
5806
6290
  }
5807
6291
  },
5808
6292
  "brand": {
package/build/json/pds-design-tokens-dark-mode.json CHANGED
@@ -1276,6 +1276,226 @@
1276
1276
  ]
1277
1277
  }
1278
1278
  },
1279
+ "panel": {
1280
+ "default": {
1281
+ "background": {
1282
+ "value": "#1d1d29",
1283
+ "public": true,
1284
+ "filePath": "tokens/color/alias/panel.dark.json",
1285
+ "isSource": true,
1286
+ "original": {
1287
+ "value": "{color.dark-mode.background.default}",
1288
+ "public": true
1289
+ },
1290
+ "name": "color-dark-mode-panel-default-background",
1291
+ "attributes": {
1292
+ "category": "color",
1293
+ "type": "dark-mode",
1294
+ "item": "panel",
1295
+ "subitem": "default",
1296
+ "state": "background"
1297
+ },
1298
+ "path": [
1299
+ "color",
1300
+ "dark-mode",
1301
+ "panel",
1302
+ "default",
1303
+ "background"
1304
+ ]
1305
+ },
1306
+ "border": {
1307
+ "value": "#504e62",
1308
+ "public": true,
1309
+ "filePath": "tokens/color/alias/panel.dark.json",
1310
+ "isSource": true,
1311
+ "original": {
1312
+ "value": "{color.dark-mode.border.default}",
1313
+ "public": true
1314
+ },
1315
+ "name": "color-dark-mode-panel-default-border",
1316
+ "attributes": {
1317
+ "category": "color",
1318
+ "type": "dark-mode",
1319
+ "item": "panel",
1320
+ "subitem": "default",
1321
+ "state": "border"
1322
+ },
1323
+ "path": [
1324
+ "color",
1325
+ "dark-mode",
1326
+ "panel",
1327
+ "default",
1328
+ "border"
1329
+ ]
1330
+ }
1331
+ },
1332
+ "sunken": {
1333
+ "background": {
1334
+ "value": "#121219",
1335
+ "public": true,
1336
+ "isReferenceToInternal": true,
1337
+ "filePath": "tokens/color/alias/panel.dark.json",
1338
+ "isSource": true,
1339
+ "original": {
1340
+ "value": "{color.dark-mode.neutral.700.value}",
1341
+ "public": true,
1342
+ "isReferenceToInternal": true
1343
+ },
1344
+ "name": "color-dark-mode-panel-sunken-background",
1345
+ "attributes": {
1346
+ "category": "color",
1347
+ "type": "dark-mode",
1348
+ "item": "panel",
1349
+ "subitem": "sunken",
1350
+ "state": "background"
1351
+ },
1352
+ "path": [
1353
+ "color",
1354
+ "dark-mode",
1355
+ "panel",
1356
+ "sunken",
1357
+ "background"
1358
+ ]
1359
+ },
1360
+ "border": {
1361
+ "value": "#121219",
1362
+ "public": true,
1363
+ "isReferenceToInternal": true,
1364
+ "filePath": "tokens/color/alias/panel.dark.json",
1365
+ "isSource": true,
1366
+ "original": {
1367
+ "value": "{color.dark-mode.neutral.700.value}",
1368
+ "public": true,
1369
+ "isReferenceToInternal": true
1370
+ },
1371
+ "name": "color-dark-mode-panel-sunken-border",
1372
+ "attributes": {
1373
+ "category": "color",
1374
+ "type": "dark-mode",
1375
+ "item": "panel",
1376
+ "subitem": "sunken",
1377
+ "state": "border"
1378
+ },
1379
+ "path": [
1380
+ "color",
1381
+ "dark-mode",
1382
+ "panel",
1383
+ "sunken",
1384
+ "border"
1385
+ ]
1386
+ }
1387
+ },
1388
+ "raised": {
1389
+ "background": {
1390
+ "value": "#282839",
1391
+ "public": true,
1392
+ "isReferenceToInternal": true,
1393
+ "filePath": "tokens/color/alias/panel.dark.json",
1394
+ "isSource": true,
1395
+ "original": {
1396
+ "value": "{color.dark-mode.neutral.500.value}",
1397
+ "public": true,
1398
+ "isReferenceToInternal": true
1399
+ },
1400
+ "name": "color-dark-mode-panel-raised-background",
1401
+ "attributes": {
1402
+ "category": "color",
1403
+ "type": "dark-mode",
1404
+ "item": "panel",
1405
+ "subitem": "raised",
1406
+ "state": "background"
1407
+ },
1408
+ "path": [
1409
+ "color",
1410
+ "dark-mode",
1411
+ "panel",
1412
+ "raised",
1413
+ "background"
1414
+ ]
1415
+ },
1416
+ "border": {
1417
+ "value": "#504e62",
1418
+ "public": true,
1419
+ "filePath": "tokens/color/alias/panel.dark.json",
1420
+ "isSource": true,
1421
+ "original": {
1422
+ "value": "{color.dark-mode.border.default}",
1423
+ "public": true
1424
+ },
1425
+ "name": "color-dark-mode-panel-raised-border",
1426
+ "attributes": {
1427
+ "category": "color",
1428
+ "type": "dark-mode",
1429
+ "item": "panel",
1430
+ "subitem": "raised",
1431
+ "state": "border"
1432
+ },
1433
+ "path": [
1434
+ "color",
1435
+ "dark-mode",
1436
+ "panel",
1437
+ "raised",
1438
+ "border"
1439
+ ]
1440
+ }
1441
+ },
1442
+ "overlay": {
1443
+ "background": {
1444
+ "value": "#282839",
1445
+ "public": true,
1446
+ "isReferenceToInternal": true,
1447
+ "filePath": "tokens/color/alias/panel.dark.json",
1448
+ "isSource": true,
1449
+ "original": {
1450
+ "value": "{color.dark-mode.neutral.500.value}",
1451
+ "public": true,
1452
+ "isReferenceToInternal": true
1453
+ },
1454
+ "name": "color-dark-mode-panel-overlay-background",
1455
+ "attributes": {
1456
+ "category": "color",
1457
+ "type": "dark-mode",
1458
+ "item": "panel",
1459
+ "subitem": "overlay",
1460
+ "state": "background"
1461
+ },
1462
+ "path": [
1463
+ "color",
1464
+ "dark-mode",
1465
+ "panel",
1466
+ "overlay",
1467
+ "background"
1468
+ ]
1469
+ },
1470
+ "border": {
1471
+ "value": "#282839",
1472
+ "public": true,
1473
+ "isReferenceToInternal": true,
1474
+ "filePath": "tokens/color/alias/panel.dark.json",
1475
+ "isSource": true,
1476
+ "original": {
1477
+ "value": "{color.dark-mode.neutral.500.value}",
1478
+ "public": true,
1479
+ "isReferenceToInternal": true
1480
+ },
1481
+ "name": "color-dark-mode-panel-overlay-border",
1482
+ "attributes": {
1483
+ "category": "color",
1484
+ "type": "dark-mode",
1485
+ "item": "panel",
1486
+ "subitem": "overlay",
1487
+ "state": "border"
1488
+ },
1489
+ "path": [
1490
+ "color",
1491
+ "dark-mode",
1492
+ "panel",
1493
+ "overlay",
1494
+ "border"
1495
+ ]
1496
+ }
1497
+ }
1498
+ },
1279
1499
  "text": {
1280
1500
  "default": {
1281
1501
  "value": "#ffffff",
@@ -1347,6 +1567,31 @@
1347
1567
  "text",
1348
1568
  "headings"
1349
1569
  ]
1570
+ },
1571
+ "overline": {
1572
+ "value": "#858299",
1573
+ "public": true,
1574
+ "isReferenceToInternal": true,
1575
+ "filePath": "tokens/color/alias/typography.dark.json",
1576
+ "isSource": true,
1577
+ "original": {
1578
+ "value": "{color.dark-mode.neutral.300.value}",
1579
+ "public": true,
1580
+ "isReferenceToInternal": true
1581
+ },
1582
+ "name": "color-dark-mode-text-overline",
1583
+ "attributes": {
1584
+ "category": "color",
1585
+ "type": "dark-mode",
1586
+ "item": "text",
1587
+ "subitem": "overline"
1588
+ },
1589
+ "path": [
1590
+ "color",
1591
+ "dark-mode",
1592
+ "text",
1593
+ "overline"
1594
+ ]
1350
1595
  }
1351
1596
  },
1352
1597
  "brand": {
package/build/json/pds-design-tokens-light-mode.json CHANGED
@@ -30,13 +30,13 @@
30
30
  },
31
31
  "border": {
32
32
  "default": {
33
- "value": "#71717c",
33
+ "value": "#cfcfd3",
34
34
  "public": true,
35
35
  "isReferenceToInternal": true,
36
36
  "filePath": "tokens/color/alias/defaults.light.json",
37
37
  "isSource": true,
38
38
  "original": {
39
- "value": "{color.light-mode.neutral.400.value}",
39
+ "value": "{color.light-mode.neutral.100.value}",
40
40
  "public": true,
41
41
  "isReferenceToInternal": true
42
42
  },
@@ -141,7 +141,7 @@
141
141
  },
142
142
  "border": {
143
143
  "default": {
144
- "value": "#71717c",
144
+ "value": "#cfcfd3",
145
145
  "public": true,
146
146
  "filePath": "tokens/color/alias/input.light.json",
147
147
  "isSource": true,
@@ -1276,6 +1276,220 @@
1276
1276
  ]
1277
1277
  }
1278
1278
  },
1279
+ "panel": {
1280
+ "default": {
1281
+ "background": {
1282
+ "value": "#ffffff",
1283
+ "public": true,
1284
+ "filePath": "tokens/color/alias/panel.light.json",
1285
+ "isSource": true,
1286
+ "original": {
1287
+ "value": "{color.light-mode.background.default}",
1288
+ "public": true
1289
+ },
1290
+ "name": "color-light-mode-panel-default-background",
1291
+ "attributes": {
1292
+ "category": "color",
1293
+ "type": "light-mode",
1294
+ "item": "panel",
1295
+ "subitem": "default",
1296
+ "state": "background"
1297
+ },
1298
+ "path": [
1299
+ "color",
1300
+ "light-mode",
1301
+ "panel",
1302
+ "default",
1303
+ "background"
1304
+ ]
1305
+ },
1306
+ "border": {
1307
+ "value": "#cfcfd3",
1308
+ "public": true,
1309
+ "filePath": "tokens/color/alias/panel.light.json",
1310
+ "isSource": true,
1311
+ "original": {
1312
+ "value": "{color.light-mode.border.default}",
1313
+ "public": true
1314
+ },
1315
+ "name": "color-light-mode-panel-default-border",
1316
+ "attributes": {
1317
+ "category": "color",
1318
+ "type": "light-mode",
1319
+ "item": "panel",
1320
+ "subitem": "default",
1321
+ "state": "border"
1322
+ },
1323
+ "path": [
1324
+ "color",
1325
+ "light-mode",
1326
+ "panel",
1327
+ "default",
1328
+ "border"
1329
+ ]
1330
+ }
1331
+ },
1332
+ "sunken": {
1333
+ "background": {
1334
+ "value": "#23232d",
1335
+ "public": true,
1336
+ "isReferenceToInternal": true,
1337
+ "filePath": "tokens/color/alias/panel.light.json",
1338
+ "isSource": true,
1339
+ "original": {
1340
+ "value": "{color.light-mode.neutral.700.value}",
1341
+ "public": true,
1342
+ "isReferenceToInternal": true
1343
+ },
1344
+ "name": "color-light-mode-panel-sunken-background",
1345
+ "attributes": {
1346
+ "category": "color",
1347
+ "type": "light-mode",
1348
+ "item": "panel",
1349
+ "subitem": "sunken",
1350
+ "state": "background"
1351
+ },
1352
+ "path": [
1353
+ "color",
1354
+ "light-mode",
1355
+ "panel",
1356
+ "sunken",
1357
+ "background"
1358
+ ]
1359
+ },
1360
+ "border": {
1361
+ "value": "#23232d",
1362
+ "public": true,
1363
+ "isReferenceToInternal": true,
1364
+ "filePath": "tokens/color/alias/panel.light.json",
1365
+ "isSource": true,
1366
+ "original": {
1367
+ "value": "{color.light-mode.neutral.700.value}",
1368
+ "public": true,
1369
+ "isReferenceToInternal": true
1370
+ },
1371
+ "name": "color-light-mode-panel-sunken-border",
1372
+ "attributes": {
1373
+ "category": "color",
1374
+ "type": "light-mode",
1375
+ "item": "panel",
1376
+ "subitem": "sunken",
1377
+ "state": "border"
1378
+ },
1379
+ "path": [
1380
+ "color",
1381
+ "light-mode",
1382
+ "panel",
1383
+ "sunken",
1384
+ "border"
1385
+ ]
1386
+ }
1387
+ },
1388
+ "raised": {
1389
+ "background": {
1390
+ "value": "#ffffff",
1391
+ "public": true,
1392
+ "filePath": "tokens/color/alias/panel.light.json",
1393
+ "isSource": true,
1394
+ "original": {
1395
+ "value": "{color.light-mode.background.default}",
1396
+ "public": true
1397
+ },
1398
+ "name": "color-light-mode-panel-raised-background",
1399
+ "attributes": {
1400
+ "category": "color",
1401
+ "type": "light-mode",
1402
+ "item": "panel",
1403
+ "subitem": "raised",
1404
+ "state": "background"
1405
+ },
1406
+ "path": [
1407
+ "color",
1408
+ "light-mode",
1409
+ "panel",
1410
+ "raised",
1411
+ "background"
1412
+ ]
1413
+ },
1414
+ "border": {
1415
+ "value": "#cfcfd3",
1416
+ "public": true,
1417
+ "filePath": "tokens/color/alias/panel.light.json",
1418
+ "isSource": true,
1419
+ "original": {
1420
+ "value": "{color.light-mode.border.default}",
1421
+ "public": true
1422
+ },
1423
+ "name": "color-light-mode-panel-raised-border",
1424
+ "attributes": {
1425
+ "category": "color",
1426
+ "type": "light-mode",
1427
+ "item": "panel",
1428
+ "subitem": "raised",
1429
+ "state": "border"
1430
+ },
1431
+ "path": [
1432
+ "color",
1433
+ "light-mode",
1434
+ "panel",
1435
+ "raised",
1436
+ "border"
1437
+ ]
1438
+ }
1439
+ },
1440
+ "overlay": {
1441
+ "background": {
1442
+ "value": "#ffffff",
1443
+ "public": true,
1444
+ "filePath": "tokens/color/alias/panel.light.json",
1445
+ "isSource": true,
1446
+ "original": {
1447
+ "value": "{color.light-mode.background.default}",
1448
+ "public": true
1449
+ },
1450
+ "name": "color-light-mode-panel-overlay-background",
1451
+ "attributes": {
1452
+ "category": "color",
1453
+ "type": "light-mode",
1454
+ "item": "panel",
1455
+ "subitem": "overlay",
1456
+ "state": "background"
1457
+ },
1458
+ "path": [
1459
+ "color",
1460
+ "light-mode",
1461
+ "panel",
1462
+ "overlay",
1463
+ "background"
1464
+ ]
1465
+ },
1466
+ "border": {
1467
+ "value": "#cfcfd3",
1468
+ "public": true,
1469
+ "filePath": "tokens/color/alias/panel.light.json",
1470
+ "isSource": true,
1471
+ "original": {
1472
+ "value": "{color.light-mode.border.default}",
1473
+ "public": true
1474
+ },
1475
+ "name": "color-light-mode-panel-overlay-border",
1476
+ "attributes": {
1477
+ "category": "color",
1478
+ "type": "light-mode",
1479
+ "item": "panel",
1480
+ "subitem": "overlay",
1481
+ "state": "border"
1482
+ },
1483
+ "path": [
1484
+ "color",
1485
+ "light-mode",
1486
+ "panel",
1487
+ "overlay",
1488
+ "border"
1489
+ ]
1490
+ }
1491
+ }
1492
+ },
1279
1493
  "text": {
1280
1494
  "default": {
1281
1495
  "value": "#23232d",
@@ -1349,6 +1563,31 @@
1349
1563
  "text",
1350
1564
  "headings"
1351
1565
  ]
1566
+ },
1567
+ "overline": {
1568
+ "value": "#71717c",
1569
+ "public": true,
1570
+ "isReferenceToInternal": true,
1571
+ "filePath": "tokens/color/alias/typography.light.json",
1572
+ "isSource": true,
1573
+ "original": {
1574
+ "value": "{color.light-mode.neutral.400.value}",
1575
+ "public": true,
1576
+ "isReferenceToInternal": true
1577
+ },
1578
+ "name": "color-light-mode-text-overline",
1579
+ "attributes": {
1580
+ "category": "color",
1581
+ "type": "light-mode",
1582
+ "item": "text",
1583
+ "subitem": "overline"
1584
+ },
1585
+ "path": [
1586
+ "color",
1587
+ "light-mode",
1588
+ "text",
1589
+ "overline"
1590
+ ]
1352
1591
  }
1353
1592
  },
1354
1593
  "brand": {
package/build/scss/_pds-design-tokens-dark-mode.scss CHANGED
@@ -61,8 +61,17 @@ $pds-color-link-active: #2776b9;
61
61
  $pds-color-link-default: #36a3ff;
62
62
  $pds-color-link-hover: #2776b9;
63
63
  $pds-color-link-visited: #967fff;
64
+ $pds-color-panel-default-background: $pds-color-background-default;
65
+ $pds-color-panel-default-border: $pds-color-border-default;
66
+ $pds-color-panel-overlay-background: #282839;
67
+ $pds-color-panel-overlay-border: #282839;
68
+ $pds-color-panel-raised-background: #282839;
69
+ $pds-color-panel-raised-border: $pds-color-border-default;
70
+ $pds-color-panel-sunken-background: #121219;
71
+ $pds-color-panel-sunken-border: #121219;
64
72
  $pds-color-text-default: #ffffff;
65
73
  $pds-color-text-headings: $pds-color-text-default;
74
+ $pds-color-text-overline: #858299;
66
75
  $pds-color-text-paragraph: $pds-color-text-default;
67
76
  $pds-elevation-overlay: 0px 8px 12px 0px rgba(18, 18, 25, 0.6);
68
77
  $pds-elevation-raised: 0px 1px 1px 0px rgba(18, 18, 25, 0.95);
package/build/scss/_pds-design-tokens-light-mode.scss CHANGED
@@ -9,7 +9,7 @@
9
9
  // This file has been generated automatically.
10
10
 
11
11
  $pds-color-background-default: #ffffff;
12
- $pds-color-border-default: #71717c;
12
+ $pds-color-border-default: #cfcfd3;
13
13
  $pds-color-brand-accent-default: #de0093;
14
14
  $pds-color-brand-primary-default: #ffdc28;
15
15
  $pds-color-brand-secondary-default: #3017a1;
@@ -61,8 +61,17 @@ $pds-color-link-active: #003cac;
61
61
  $pds-color-link-default: #0f62fe;
62
62
  $pds-color-link-hover: #003cac;
63
63
  $pds-color-link-visited: #967fff;
64
+ $pds-color-panel-default-background: $pds-color-background-default;
65
+ $pds-color-panel-default-border: $pds-color-border-default;
66
+ $pds-color-panel-overlay-background: $pds-color-background-default;
67
+ $pds-color-panel-overlay-border: $pds-color-border-default;
68
+ $pds-color-panel-raised-background: $pds-color-background-default;
69
+ $pds-color-panel-raised-border: $pds-color-border-default;
70
+ $pds-color-panel-sunken-background: #23232d;
71
+ $pds-color-panel-sunken-border: #23232d;
64
72
  $pds-color-text-default: #23232d;
65
73
  $pds-color-text-headings: $pds-color-text-default;
74
+ $pds-color-text-overline: #71717c;
66
75
  $pds-color-text-paragraph: #23232d;
67
76
  $pds-elevation-overlay: 0px 8px 12px 0px rgba(113, 113, 124, 0.25), 0px 0px 1px 0px rgba(18, 18, 25, 0.25);
68
77
  $pds-elevation-raised: 0px 1px 1px 0px #aeaeb6, 0px 0px 1px 0px rgba(18, 18, 25, 0.25);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "0.7.0-dev.2",
3
+ "version": "0.7.0-dev.4",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [