@hpe-web/design-tokens 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/dist/css/fonts.css +132 -0
  2. package/dist/css/tokens.css +305 -0
  3. package/dist/css/tokens.dark.css +96 -0
  4. package/dist/css/tokens.sm-xs.css +93 -0
  5. package/dist/css/tokens.xl.css +100 -0
  6. package/dist/js/tokens.d.ts +307 -0
  7. package/dist/js/tokens.dark.d.ts +98 -0
  8. package/dist/js/tokens.dark.mjs +98 -0
  9. package/dist/js/tokens.mjs +307 -0
  10. package/dist/json/tokens.dark.json +92 -0
  11. package/dist/json/tokens.json +301 -0
  12. package/dist/json/tokens.sm-xs.json +87 -0
  13. package/dist/json/tokens.xl.json +94 -0
  14. package/dist/scss/_tokens.dark.scss +93 -0
  15. package/dist/scss/_tokens.scss +302 -0
  16. package/dist/scss/_tokens.sm-xs.scss +88 -0
  17. package/dist/scss/_tokens.xl.scss +95 -0
  18. package/dtcg/.gitkeep +0 -0
  19. package/dtcg/foundation/border-radius.tokens.json +239 -0
  20. package/dtcg/foundation/border-width.tokens.json +103 -0
  21. package/dtcg/foundation/color.tokens.json +2916 -0
  22. package/dtcg/foundation/dimension.tokens.json +258 -0
  23. package/dtcg/foundation/font-family.tokens.json +53 -0
  24. package/dtcg/foundation/font-size.tokens.json +408 -0
  25. package/dtcg/foundation/font-weight.tokens.json +214 -0
  26. package/dtcg/foundation/letter-spacing.tokens.json +203 -0
  27. package/dtcg/foundation/line-height.tokens.json +408 -0
  28. package/dtcg/foundation/size.tokens.json +191 -0
  29. package/dtcg/foundation/space.tokens.json +431 -0
  30. package/dtcg/hpe.resolver.json +163 -0
  31. package/dtcg/semantic/border-radius.tokens.json +149 -0
  32. package/dtcg/semantic/border-width.tokens.json +50 -0
  33. package/dtcg/semantic/font-family.tokens.json +42 -0
  34. package/dtcg/semantic/font-size.tokens.json +285 -0
  35. package/dtcg/semantic/font-weight.tokens.json +134 -0
  36. package/dtcg/semantic/letter-spacing.tokens.json +203 -0
  37. package/dtcg/semantic/line-height.tokens.json +285 -0
  38. package/dtcg/semantic/size.tokens.json +120 -0
  39. package/dtcg/semantic/space.tokens.json +275 -0
  40. package/dtcg/theme/dark/color.tokens.json +698 -0
  41. package/dtcg/theme/light/color.tokens.json +722 -0
  42. package/dtcg/viewport/sm-xs/border-radius.tokens.json +48 -0
  43. package/dtcg/viewport/sm-xs/border-width.tokens.json +15 -0
  44. package/dtcg/viewport/sm-xs/font-size.tokens.json +236 -0
  45. package/dtcg/viewport/sm-xs/font-weight.tokens.json +18 -0
  46. package/dtcg/viewport/sm-xs/letter-spacing.tokens.json +130 -0
  47. package/dtcg/viewport/sm-xs/line-height.tokens.json +236 -0
  48. package/dtcg/viewport/sm-xs/size.tokens.json +39 -0
  49. package/dtcg/viewport/sm-xs/space.tokens.json +46 -0
  50. package/dtcg/viewport/xl/border-radius.tokens.json +48 -0
  51. package/dtcg/viewport/xl/font-size.tokens.json +236 -0
  52. package/dtcg/viewport/xl/letter-spacing.tokens.json +122 -0
  53. package/dtcg/viewport/xl/line-height.tokens.json +178 -0
  54. package/dtcg/viewport/xl/size.tokens.json +84 -0
  55. package/dtcg/viewport/xl/space.tokens.json +68 -0
  56. package/package.json +36 -0
package/dist/js/tokens.mjs ADDED
@@ -0,0 +1,307 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ const tokens = {
6
+ 'hpe-web-button-play-rest-icon-color': "#068667",
7
+ 'hpe-web-multi-mode-button-anchor-large-border-radius': "9999px",
8
+ 'hpe-web-multi-mode-button-anchor-large-font-size': "20px",
9
+ 'hpe-web-multi-mode-button-anchor-large-line-height': "28px",
10
+ 'hpe-web-multi-mode-button-anchor-large-border-width': "4px",
11
+ 'hpe-web-multi-mode-button-anchor-large-icon-height': "20px",
12
+ 'hpe-web-multi-mode-button-anchor-large-icon-width': "20px",
13
+ 'hpe-web-multi-mode-button-anchor-large-min-height': "20px",
14
+ 'hpe-web-multi-mode-button-anchor-large-gap-x': "12px",
15
+ 'hpe-web-multi-mode-button-anchor-large-padding-x': "0px",
16
+ 'hpe-web-multi-mode-button-anchor-large-padding-y': "0px",
17
+ 'hpe-web-multi-mode-button-anchor-medium-border-radius': "9999px",
18
+ 'hpe-web-multi-mode-button-anchor-medium-border-width': "4px",
19
+ 'hpe-web-multi-mode-button-anchor-medium-font-size': "18px",
20
+ 'hpe-web-multi-mode-button-anchor-medium-line-height': "24px",
21
+ 'hpe-web-multi-mode-button-anchor-medium-icon-height': "16px",
22
+ 'hpe-web-multi-mode-button-anchor-medium-icon-width': "16px",
23
+ 'hpe-web-multi-mode-button-anchor-medium-min-height': "24px",
24
+ 'hpe-web-multi-mode-button-anchor-medium-gap-x': "12px",
25
+ 'hpe-web-multi-mode-button-anchor-medium-padding-x': "0px",
26
+ 'hpe-web-multi-mode-button-anchor-medium-padding-y': "0px",
27
+ 'hpe-web-multi-mode-button-anchor-small-border-radius': "9999px",
28
+ 'hpe-web-multi-mode-button-anchor-small-border-width': "4px",
29
+ 'hpe-web-multi-mode-button-anchor-small-font-size': "16px",
30
+ 'hpe-web-multi-mode-button-anchor-small-line-height': "24px",
31
+ 'hpe-web-multi-mode-button-anchor-small-icon-height': "16px",
32
+ 'hpe-web-multi-mode-button-anchor-small-icon-width': "16px",
33
+ 'hpe-web-multi-mode-button-anchor-small-min-height': "14px",
34
+ 'hpe-web-multi-mode-button-anchor-small-gap-x': "8px",
35
+ 'hpe-web-multi-mode-button-anchor-small-padding-x': "0px",
36
+ 'hpe-web-multi-mode-button-anchor-small-padding-y': "0px",
37
+ 'hpe-web-multi-mode-button-primary-large-border-radius': "9999px",
38
+ 'hpe-web-multi-mode-button-primary-large-font-size': "20px",
39
+ 'hpe-web-multi-mode-button-primary-large-line-height': "28px",
40
+ 'hpe-web-multi-mode-button-primary-large-border-width': "0px",
41
+ 'hpe-web-multi-mode-button-primary-large-icon-height': "20px",
42
+ 'hpe-web-multi-mode-button-primary-large-icon-width': "20px",
43
+ 'hpe-web-multi-mode-button-primary-large-min-height': "60px",
44
+ 'hpe-web-multi-mode-button-primary-large-gap-x': "12px",
45
+ 'hpe-web-multi-mode-button-primary-large-padding-x': "36px",
46
+ 'hpe-web-multi-mode-button-primary-large-padding-y': "16px",
47
+ 'hpe-web-multi-mode-button-primary-medium-border-radius': "9999px",
48
+ 'hpe-web-multi-mode-button-primary-medium-border-width': "0px",
49
+ 'hpe-web-multi-mode-button-primary-medium-font-size': "18px",
50
+ 'hpe-web-multi-mode-button-primary-medium-line-height': "24px",
51
+ 'hpe-web-multi-mode-button-primary-medium-icon-height': "16px",
52
+ 'hpe-web-multi-mode-button-primary-medium-icon-width': "16px",
53
+ 'hpe-web-multi-mode-button-primary-medium-min-height': "52px",
54
+ 'hpe-web-multi-mode-button-primary-medium-gap-x': "12px",
55
+ 'hpe-web-multi-mode-button-primary-medium-padding-x': "28px",
56
+ 'hpe-web-multi-mode-button-primary-medium-padding-y': "14px",
57
+ 'hpe-web-multi-mode-button-primary-small-border-radius': "9999px",
58
+ 'hpe-web-multi-mode-button-primary-small-border-width': "0px",
59
+ 'hpe-web-multi-mode-button-primary-small-font-size': "16px",
60
+ 'hpe-web-multi-mode-button-primary-small-line-height': "24px",
61
+ 'hpe-web-multi-mode-button-primary-small-icon-height': "16px",
62
+ 'hpe-web-multi-mode-button-primary-small-icon-width': "16px",
63
+ 'hpe-web-multi-mode-button-primary-small-min-height': "48px",
64
+ 'hpe-web-multi-mode-button-primary-small-gap-x': "8px",
65
+ 'hpe-web-multi-mode-button-primary-small-padding-x': "24px",
66
+ 'hpe-web-multi-mode-button-primary-small-padding-y': "12px",
67
+ 'hpe-web-multi-mode-button-secondary-large-border-radius': "9999px",
68
+ 'hpe-web-multi-mode-button-secondary-large-border-width': "4px",
69
+ 'hpe-web-multi-mode-button-secondary-large-font-size': "20px",
70
+ 'hpe-web-multi-mode-button-secondary-large-line-height': "28px",
71
+ 'hpe-web-multi-mode-button-secondary-large-icon-height': "20px",
72
+ 'hpe-web-multi-mode-button-secondary-large-icon-width': "20px",
73
+ 'hpe-web-multi-mode-button-secondary-large-min-height': "60px",
74
+ 'hpe-web-multi-mode-button-secondary-large-gap-x': "12px",
75
+ 'hpe-web-multi-mode-button-secondary-large-padding-x': "36px",
76
+ 'hpe-web-multi-mode-button-secondary-large-padding-y': "16px",
77
+ 'hpe-web-multi-mode-button-secondary-medium-border-radius': "9999px",
78
+ 'hpe-web-multi-mode-button-secondary-medium-border-width': "4px",
79
+ 'hpe-web-multi-mode-button-secondary-medium-font-size': "18px",
80
+ 'hpe-web-multi-mode-button-secondary-medium-line-height': "24px",
81
+ 'hpe-web-multi-mode-button-secondary-medium-icon-height': "16px",
82
+ 'hpe-web-multi-mode-button-secondary-medium-icon-width': "16px",
83
+ 'hpe-web-multi-mode-button-secondary-medium-min-height': "52px",
84
+ 'hpe-web-multi-mode-button-secondary-medium-gap-x': "12px",
85
+ 'hpe-web-multi-mode-button-secondary-medium-padding-x': "28px",
86
+ 'hpe-web-multi-mode-button-secondary-medium-padding-y': "14px",
87
+ 'hpe-web-multi-mode-button-secondary-small-border-radius': "9999px",
88
+ 'hpe-web-multi-mode-button-secondary-small-border-width': "3px",
89
+ 'hpe-web-multi-mode-button-secondary-small-font-size': "16px",
90
+ 'hpe-web-multi-mode-button-secondary-small-line-height': "24px",
91
+ 'hpe-web-multi-mode-button-secondary-small-icon-height': "16px",
92
+ 'hpe-web-multi-mode-button-secondary-small-icon-width': "16px",
93
+ 'hpe-web-multi-mode-button-secondary-small-min-height': "48px",
94
+ 'hpe-web-multi-mode-button-secondary-small-gap-x': "8px",
95
+ 'hpe-web-multi-mode-button-secondary-small-padding-x': "24px",
96
+ 'hpe-web-multi-mode-button-secondary-small-padding-y': "12px",
97
+ 'hpe-web-radius-full': "9999px",
98
+ 'hpe-web-radius-hair': "1px",
99
+ 'hpe-web-radius-large': "12px",
100
+ 'hpe-web-radius-medium': "8px",
101
+ 'hpe-web-radius-none': "0px",
102
+ 'hpe-web-radius-small': "6px",
103
+ 'hpe-web-radius-xlarge': "16px",
104
+ 'hpe-web-radius-xsmall': "4px",
105
+ 'hpe-web-radius-xxlarge': "24px",
106
+ 'hpe-web-radius-xxsmall': "1px",
107
+ 'hpe-web-color-background-card': "#f7f7f7",
108
+ 'hpe-web-color-background-card-hover': "#e6e8e9",
109
+ 'hpe-web-color-background-component': "#e6e8e9",
110
+ 'hpe-web-color-background-component-disabled': "#a5a5a9",
111
+ 'hpe-web-color-background-component-hover': "#d4d4d4",
112
+ 'hpe-web-color-background-contrast': "#0000000a",
113
+ 'hpe-web-color-background-critical': "#cc1f1a",
114
+ 'hpe-web-color-background-default': "#ffffff",
115
+ 'hpe-web-color-background-focus': "#2ad2c9",
116
+ 'hpe-web-color-background-neutral': "#535c66",
117
+ 'hpe-web-color-background-neutral-strong': "#292d3a",
118
+ 'hpe-web-color-background-neutral-weak': "#d4d8db",
119
+ 'hpe-web-color-background-ok': "#009a71",
120
+ 'hpe-web-color-background-primary': "#01a982",
121
+ 'hpe-web-color-background-primary-strong': "#068667",
122
+ 'hpe-web-color-background-warning': "#d36d00",
123
+ 'hpe-web-color-border-critical': "#cc1f1a",
124
+ 'hpe-web-color-border-default': "#a0a2a8",
125
+ 'hpe-web-color-border-focus': "#2ad2c9",
126
+ 'hpe-web-color-border-ok': "#009a71",
127
+ 'hpe-web-color-border-primary': "#01a982",
128
+ 'hpe-web-color-border-primary-strong': "#068667",
129
+ 'hpe-web-color-border-warning': "#d36d00",
130
+ 'hpe-web-color-border-weak': "#d1d1d1",
131
+ 'hpe-web-color-decorative-black': "#000000",
132
+ 'hpe-web-color-decorative-blue': "#0070f8",
133
+ 'hpe-web-color-decorative-brand': "#01a982",
134
+ 'hpe-web-color-decorative-cyan': "#62e5f6",
135
+ 'hpe-web-color-decorative-green': "#05cc93",
136
+ 'hpe-web-color-decorative-neutral': "#7d8a92",
137
+ 'hpe-web-color-decorative-neutral-hover': "#606a70",
138
+ 'hpe-web-color-decorative-purple': "#7764fc",
139
+ 'hpe-web-color-decorative-white': "#ffffff",
140
+ 'hpe-web-color-gradient-element-green-stop0': "#05cc93",
141
+ 'hpe-web-color-gradient-element-green-stop100': "#ffffff00",
142
+ 'hpe-web-color-gradient-element-neutral-stop0': "#292d3a45",
143
+ 'hpe-web-color-gradient-element-neutral-stop100': "#ffffff00",
144
+ 'hpe-web-color-gradient-element-neutral-stop15': "#393d4840",
145
+ 'hpe-web-color-gradient-element-neutral-stop28': "#494e573d",
146
+ 'hpe-web-color-gradient-element-neutral-stop38': "#5a5f6538",
147
+ 'hpe-web-color-gradient-element-neutral-stop47': "#6a707333",
148
+ 'hpe-web-color-gradient-element-neutral-stop54': "#7b818130",
149
+ 'hpe-web-color-gradient-element-neutral-stop60': "#8c92902b",
150
+ 'hpe-web-color-gradient-element-neutral-stop65': "#9da39e26",
151
+ 'hpe-web-color-gradient-element-neutral-stop70': "#adb4ac21",
152
+ 'hpe-web-color-gradient-element-neutral-stop73': "#bec5bb1f",
153
+ 'hpe-web-color-gradient-element-neutral-stop77': "#cfd6c91a",
154
+ 'hpe-web-color-gradient-element-neutral-stop80': "#e0e7d714",
155
+ 'hpe-web-color-gradient-element-neutral-stop84': "#f0f8e512",
156
+ 'hpe-web-color-gradient-element-neutral-stop88': "#fafff20d",
157
+ 'hpe-web-color-gradient-element-neutral-stop94': "#ffffff08",
158
+ 'hpe-web-color-gradient-neutral-stop0': "#1d1f2700",
159
+ 'hpe-web-color-gradient-neutral-stop100': "#1d1f27",
160
+ 'hpe-web-color-gradient-video-overlay-stop0': "#00000000",
161
+ 'hpe-web-color-gradient-video-overlay-stop100': "#00000066",
162
+ 'hpe-web-color-icon-critical': "#cc1f1a",
163
+ 'hpe-web-color-icon-default': "#67686e",
164
+ 'hpe-web-color-icon-disabled': "#a0a2ab",
165
+ 'hpe-web-color-icon-focus': "#2ad2c9",
166
+ 'hpe-web-color-icon-neutral': "#292d3a",
167
+ 'hpe-web-color-icon-ok': "#009a71",
168
+ 'hpe-web-color-icon-primary': "#01a982",
169
+ 'hpe-web-color-icon-primary-strong': "#005f49",
170
+ 'hpe-web-color-icon-strong': "#292d3a",
171
+ 'hpe-web-color-icon-warning': "#d36d00",
172
+ 'hpe-web-color-icon-weak': "#676767",
173
+ 'hpe-web-color-logo': "#01a982",
174
+ 'hpe-web-color-text-body': "#67686e",
175
+ 'hpe-web-color-text-critical': "#cc1f1a",
176
+ 'hpe-web-color-text-disabled': "#a0a2ab",
177
+ 'hpe-web-color-text-focus': "#2ad2c9",
178
+ 'hpe-web-color-text-header': "#292d3a",
179
+ 'hpe-web-color-text-neutral-strong': "#21242e",
180
+ 'hpe-web-color-text-ok': "#009a71",
181
+ 'hpe-web-color-text-on-neutral': "#ffffff",
182
+ 'hpe-web-color-text-primary': "#068667",
183
+ 'hpe-web-color-text-primary-strong': "#005f49",
184
+ 'hpe-web-color-text-warning': "#d36d00",
185
+ 'hpe-web-color-text-weak': "#676767",
186
+ 'hpe-web-color-transparent': "#00000000",
187
+ 'hpe-web-theme-button-carousel-disabled-background': "#b4b6ba",
188
+ 'hpe-web-theme-button-carousel-disabled-border-color': "#00000000",
189
+ 'hpe-web-theme-button-carousel-disabled-icon-color': "#ffffff",
190
+ 'hpe-web-theme-button-carousel-hover-background': "#67686e",
191
+ 'hpe-web-theme-button-carousel-hover-border-color': "#00000000",
192
+ 'hpe-web-theme-button-carousel-hover-icon-color': "#ffffff",
193
+ 'hpe-web-theme-button-carousel-rest-background': "#535c66",
194
+ 'hpe-web-theme-button-carousel-rest-border-color': "#00000000",
195
+ 'hpe-web-theme-button-carousel-rest-icon-color': "#ffffff",
196
+ 'hpe-web-display-font': "\"HPE Graphik XXCondensed\", \"Arial Narrow\", Arial, sans-serif",
197
+ 'hpe-web-display-bold-2xlarge-font-size': "144px",
198
+ 'hpe-web-display-bold-2xlarge-font-weight': 700,
199
+ 'hpe-web-display-bold-2xlarge-letter-spacing': "2px",
200
+ 'hpe-web-display-bold-2xlarge-line-height': "144px",
201
+ 'hpe-web-display-bold-large-font-size': "80px",
202
+ 'hpe-web-display-bold-large-font-weight': 700,
203
+ 'hpe-web-display-bold-large-letter-spacing': "1.6px",
204
+ 'hpe-web-display-bold-large-line-height': "80px",
205
+ 'hpe-web-display-bold-xlarge-font-size': "96px",
206
+ 'hpe-web-display-bold-xlarge-font-weight': 700,
207
+ 'hpe-web-display-bold-xlarge-letter-spacing': "2px",
208
+ 'hpe-web-display-bold-xlarge-line-height': "96px",
209
+ 'hpe-web-display-light-2xlarge-font-size': "144px",
210
+ 'hpe-web-display-light-2xlarge-font-weight': 300,
211
+ 'hpe-web-display-light-2xlarge-letter-spacing': "2px",
212
+ 'hpe-web-display-light-2xlarge-line-height': "144px",
213
+ 'hpe-web-display-light-large-font-size': "80px",
214
+ 'hpe-web-display-light-large-font-weight': 300,
215
+ 'hpe-web-display-light-large-letter-spacing': "1.6px",
216
+ 'hpe-web-display-light-large-line-height': "80px",
217
+ 'hpe-web-display-light-xlarge-font-size': "96px",
218
+ 'hpe-web-display-light-xlarge-font-weight': 300,
219
+ 'hpe-web-display-light-xlarge-letter-spacing': "2px",
220
+ 'hpe-web-display-light-xlarge-line-height': "96px",
221
+ 'hpe-web-display-regular-2xlarge-font-size': "144px",
222
+ 'hpe-web-display-regular-2xlarge-font-weight': 400,
223
+ 'hpe-web-display-regular-2xlarge-letter-spacing': "2px",
224
+ 'hpe-web-display-regular-2xlarge-line-height': "144px",
225
+ 'hpe-web-display-regular-large-font-size': "80px",
226
+ 'hpe-web-display-regular-large-font-weight': 500,
227
+ 'hpe-web-display-regular-large-letter-spacing': "1.6px",
228
+ 'hpe-web-display-regular-large-line-height': "80px",
229
+ 'hpe-web-display-regular-xlarge-font-size': "96px",
230
+ 'hpe-web-display-regular-xlarge-font-weight': 500,
231
+ 'hpe-web-display-regular-xlarge-letter-spacing': "2px",
232
+ 'hpe-web-display-regular-xlarge-line-height': "96px",
233
+ 'hpe-web-heading-font': "\"HPE Graphik\", Arial, sans-serif",
234
+ 'hpe-web-heading-3xsmall-font-size': "16px",
235
+ 'hpe-web-heading-3xsmall-font-weight': 500,
236
+ 'hpe-web-heading-3xsmall-letter-spacing': "0px",
237
+ 'hpe-web-heading-3xsmall-line-height': "22px",
238
+ 'hpe-web-heading-large-font-size': "56px",
239
+ 'hpe-web-heading-large-font-weight': 500,
240
+ 'hpe-web-heading-large-letter-spacing': "-1.68px",
241
+ 'hpe-web-heading-large-line-height': "62px",
242
+ 'hpe-web-heading-medium-font-size': "40px",
243
+ 'hpe-web-heading-medium-font-weight': 500,
244
+ 'hpe-web-heading-medium-letter-spacing': "-0.8px",
245
+ 'hpe-web-heading-medium-line-height': "46px",
246
+ 'hpe-web-heading-small-font-size': "32px",
247
+ 'hpe-web-heading-small-font-weight': 500,
248
+ 'hpe-web-heading-small-letter-spacing': "-0.32px",
249
+ 'hpe-web-heading-small-line-height': "38px",
250
+ 'hpe-web-heading-xlarge-font-size': "68px",
251
+ 'hpe-web-heading-xlarge-font-weight': 500,
252
+ 'hpe-web-heading-xlarge-letter-spacing': "-2.73px",
253
+ 'hpe-web-heading-xlarge-line-height': "74px",
254
+ 'hpe-web-heading-xsmall-font-size': "24px",
255
+ 'hpe-web-heading-xsmall-font-weight': 500,
256
+ 'hpe-web-heading-xsmall-letter-spacing': "0px",
257
+ 'hpe-web-heading-xsmall-line-height': "30px",
258
+ 'hpe-web-heading-xxsmall-font-size': "18px",
259
+ 'hpe-web-heading-xxsmall-font-weight': 500,
260
+ 'hpe-web-heading-xxsmall-letter-spacing': "0px",
261
+ 'hpe-web-heading-xxsmall-line-height': "24px",
262
+ 'hpe-web-quote-font': "\"HPE Graphik\", Arial, sans-serif",
263
+ 'hpe-web-quote-large-font-size': "48px",
264
+ 'hpe-web-quote-large-font-weight': 400,
265
+ 'hpe-web-quote-large-letter-spacing': "-1.92px",
266
+ 'hpe-web-quote-large-line-height': "58px",
267
+ 'hpe-web-quote-medium-font-size': "40px",
268
+ 'hpe-web-quote-medium-font-weight': 400,
269
+ 'hpe-web-quote-medium-letter-spacing': "-1.2px",
270
+ 'hpe-web-quote-medium-line-height': "50px",
271
+ 'hpe-web-quote-small-font-size': "32px",
272
+ 'hpe-web-quote-small-font-weight': 400,
273
+ 'hpe-web-quote-small-letter-spacing': "-0.64px",
274
+ 'hpe-web-quote-small-line-height': "42px",
275
+ 'hpe-web-text-font': "\"HPE Graphik\", Arial, sans-serif",
276
+ 'hpe-web-text-large-font-size': "24px",
277
+ 'hpe-web-text-large-font-weight': 400,
278
+ 'hpe-web-text-large-letter-spacing': "-0.24px",
279
+ 'hpe-web-text-large-line-height': "34px",
280
+ 'hpe-web-text-medium-font-size': "18px",
281
+ 'hpe-web-text-medium-font-weight': 400,
282
+ 'hpe-web-text-medium-letter-spacing': "0px",
283
+ 'hpe-web-text-medium-line-height': "26px",
284
+ 'hpe-web-text-small-font-size': "16px",
285
+ 'hpe-web-text-small-font-weight': 400,
286
+ 'hpe-web-text-small-letter-spacing': "0px",
287
+ 'hpe-web-text-small-line-height': "24px",
288
+ 'hpe-web-text-xsmall-font-size': "14px",
289
+ 'hpe-web-text-xsmall-font-weight': 400,
290
+ 'hpe-web-text-xsmall-letter-spacing': "0px",
291
+ 'hpe-web-text-xsmall-line-height': "20px",
292
+ 'hpe-web-spacing-3xlarge': "96px",
293
+ 'hpe-web-spacing-3xsmall': "8px",
294
+ 'hpe-web-spacing-4xlarge': "160px",
295
+ 'hpe-web-spacing-4xsmall': "4px",
296
+ 'hpe-web-spacing-hair': "1px",
297
+ 'hpe-web-spacing-large': "40px",
298
+ 'hpe-web-spacing-medium': "32px",
299
+ 'hpe-web-spacing-none': "0px",
300
+ 'hpe-web-spacing-small': "24px",
301
+ 'hpe-web-spacing-xlarge': "48px",
302
+ 'hpe-web-spacing-xsmall': "16px",
303
+ 'hpe-web-spacing-xxlarge': "64px",
304
+ 'hpe-web-spacing-xxsmall': "12px"
305
+ };
306
+
307
+ export default tokens;
package/dist/json/tokens.dark.json ADDED
@@ -0,0 +1,92 @@
1
+ {
2
+ "hpe-web-button-play-rest-icon-color": "#068667",
3
+ "hpe-web-color-background-card": "#292d3a",
4
+ "hpe-web-color-background-card-hover": "#21242e",
5
+ "hpe-web-color-background-component": "#292d3a",
6
+ "hpe-web-color-background-component-disabled": "#d4d8db",
7
+ "hpe-web-color-background-component-hover": "#535c66",
8
+ "hpe-web-color-background-contrast": "#0000000a",
9
+ "hpe-web-color-background-critical": "#cc1f1a",
10
+ "hpe-web-color-background-default": "#1d1f27",
11
+ "hpe-web-color-background-focus": "#2ad2c9",
12
+ "hpe-web-color-background-neutral": "#d4d8db",
13
+ "hpe-web-color-background-neutral-strong": "#ffffff",
14
+ "hpe-web-color-background-neutral-weak": "#d4d8db",
15
+ "hpe-web-color-background-ok": "#1ed8ae",
16
+ "hpe-web-color-background-primary": "#01a982",
17
+ "hpe-web-color-background-primary-strong": "#068667",
18
+ "hpe-web-color-background-warning": "#d36d00",
19
+ "hpe-web-color-border-critical": "#cc1f1a",
20
+ "hpe-web-color-border-default": "#7d8a92",
21
+ "hpe-web-color-border-focus": "#2ad2c9",
22
+ "hpe-web-color-border-ok": "#17eba0",
23
+ "hpe-web-color-border-primary": "#01a982",
24
+ "hpe-web-color-border-primary-strong": "#068667",
25
+ "hpe-web-color-border-warning": "#d36d00",
26
+ "hpe-web-color-border-weak": "#535c66",
27
+ "hpe-web-color-decorative-black": "#000000",
28
+ "hpe-web-color-decorative-blue": "#0070f8",
29
+ "hpe-web-color-decorative-brand": "#01a982",
30
+ "hpe-web-color-decorative-cyan": "#00a4b3",
31
+ "hpe-web-color-decorative-green": "#068667",
32
+ "hpe-web-color-decorative-neutral": "#b1b9be",
33
+ "hpe-web-color-decorative-neutral-hover": "#d4d8db",
34
+ "hpe-web-color-decorative-purple": "#7764fc",
35
+ "hpe-web-color-decorative-white": "#ffffff",
36
+ "hpe-web-color-gradient-element-green-stop0": "#05cc93",
37
+ "hpe-web-color-gradient-element-green-stop100": "#0f101600",
38
+ "hpe-web-color-gradient-element-neutral-stop0": "#5c667245",
39
+ "hpe-web-color-gradient-element-neutral-stop100": "#5c667200",
40
+ "hpe-web-color-gradient-element-neutral-stop15": "#5c6672fc",
41
+ "hpe-web-color-gradient-element-neutral-stop28": "#5c6672f5",
42
+ "hpe-web-color-gradient-element-neutral-stop38": "#5c6672e8",
43
+ "hpe-web-color-gradient-element-neutral-stop47": "#5c6672d9",
44
+ "hpe-web-color-gradient-element-neutral-stop54": "#5c6672c7",
45
+ "hpe-web-color-gradient-element-neutral-stop60": "#5c6672b2",
46
+ "hpe-web-color-gradient-element-neutral-stop65": "#5c66729e",
47
+ "hpe-web-color-gradient-element-neutral-stop70": "#5c667285",
48
+ "hpe-web-color-gradient-element-neutral-stop73": "#5c66726e",
49
+ "hpe-web-color-gradient-element-neutral-stop77": "#5c667257",
50
+ "hpe-web-color-gradient-element-neutral-stop80": "#5c667242",
51
+ "hpe-web-color-gradient-element-neutral-stop84": "#5c66722e",
52
+ "hpe-web-color-gradient-element-neutral-stop88": "#5c66721a",
53
+ "hpe-web-color-gradient-element-neutral-stop94": "#5c66720d",
54
+ "hpe-web-color-gradient-neutral-stop0": "#1d1f2700",
55
+ "hpe-web-color-gradient-neutral-stop100": "#1d1f27",
56
+ "hpe-web-color-gradient-video-overlay-stop0": "#00000000",
57
+ "hpe-web-color-gradient-video-overlay-stop100": "#00000066",
58
+ "hpe-web-color-icon-critical": "#cc1f1a",
59
+ "hpe-web-color-icon-default": "#e5e5e5",
60
+ "hpe-web-color-icon-disabled": "#bebebe",
61
+ "hpe-web-color-icon-focus": "#2ad2c9",
62
+ "hpe-web-color-icon-neutral": "#ffffff",
63
+ "hpe-web-color-icon-ok": "#1ed8ae",
64
+ "hpe-web-color-icon-primary": "#01a982",
65
+ "hpe-web-color-icon-primary-strong": "#01a982",
66
+ "hpe-web-color-icon-strong": "#ffffff",
67
+ "hpe-web-color-icon-warning": "#d36d00",
68
+ "hpe-web-color-icon-weak": "#ffffff9c",
69
+ "hpe-web-color-logo": "#01a982",
70
+ "hpe-web-color-text-body": "#e5e5e5",
71
+ "hpe-web-color-text-critical": "#fc6161",
72
+ "hpe-web-color-text-disabled": "#bebebe",
73
+ "hpe-web-color-text-focus": "#2ad2c9",
74
+ "hpe-web-color-text-header": "#ffffff",
75
+ "hpe-web-color-text-neutral-strong": "#f7f7f7",
76
+ "hpe-web-color-text-ok": "#17eba0",
77
+ "hpe-web-color-text-on-neutral": "#292d3a",
78
+ "hpe-web-color-text-primary": "#00e0af",
79
+ "hpe-web-color-text-primary-strong": "#01a982",
80
+ "hpe-web-color-text-warning": "#ec8c25",
81
+ "hpe-web-color-text-weak": "#ffffff9c",
82
+ "hpe-web-color-transparent": "#ffffff00",
83
+ "hpe-web-theme-button-carousel-disabled-background": "#a5a5a9",
84
+ "hpe-web-theme-button-carousel-disabled-border-color": "#00000000",
85
+ "hpe-web-theme-button-carousel-disabled-icon-color": "#292d3a",
86
+ "hpe-web-theme-button-carousel-hover-background": "#d4d4d4",
87
+ "hpe-web-theme-button-carousel-hover-border-color": "#ffffff00",
88
+ "hpe-web-theme-button-carousel-hover-icon-color": "#292d3a",
89
+ "hpe-web-theme-button-carousel-rest-background": "#e6e8e9",
90
+ "hpe-web-theme-button-carousel-rest-border-color": "#00000000",
91
+ "hpe-web-theme-button-carousel-rest-icon-color": "#292d3a"
92
+ }