@patternfly/design-tokens 1.0.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 (39) hide show
  1. package/build/css/_tokens-charts.scss +159 -0
  2. package/build/css/_tokens-dark.scss +355 -0
  3. package/build/css/_tokens-default.scss +418 -0
  4. package/build/css/_tokens-palette.scss +75 -0
  5. package/build-js-for-docs.js +38 -0
  6. package/build.js +55 -0
  7. package/config.chart.json +23 -0
  8. package/config.dark.json +23 -0
  9. package/config.default.json +23 -0
  10. package/config.palette-colors.json +23 -0
  11. package/generate-fed-package-json.js +65 -0
  12. package/package.json +52 -0
  13. package/patternfly-a11y.config.js +24 -0
  14. package/patternfly-docs/content/all-patternfly-tokens.md +9 -0
  15. package/patternfly-docs/content/tokensTable.js +143 -0
  16. package/patternfly-docs/generated/index.js +12 -0
  17. package/patternfly-docs/generated/react.js +59 -0
  18. package/patternfly-docs/generated/tokens/all-patternfly-tokens/tokens.js +34 -0
  19. package/patternfly-docs/pages/index.js +27 -0
  20. package/patternfly-docs/patternfly-docs.config.js +6 -0
  21. package/patternfly-docs/patternfly-docs.css.js +8 -0
  22. package/patternfly-docs/patternfly-docs.routes.js +12 -0
  23. package/patternfly-docs/patternfly-docs.source.js +20 -0
  24. package/patternfly-docs/scssAsJson.json +1 -0
  25. package/plugins/export-patternfly-tokens/README.md +22 -0
  26. package/plugins/export-patternfly-tokens/code.js +85 -0
  27. package/plugins/export-patternfly-tokens/export.html +179 -0
  28. package/plugins/export-patternfly-tokens/manifest.json +12 -0
  29. package/release.config.js +13 -0
  30. package/tokens/AsExported.text +3388 -0
  31. package/tokens/dark/base.dark.json +331 -0
  32. package/tokens/dark/palette.color.json +295 -0
  33. package/tokens/dark/semantic.dark.json +1359 -0
  34. package/tokens/default/base.dimension.json +171 -0
  35. package/tokens/default/base.json +329 -0
  36. package/tokens/default/chart.json +695 -0
  37. package/tokens/default/palette.color.json +295 -0
  38. package/tokens/default/semantic.dimension.json +383 -0
  39. package/tokens/default/semantic.json +1110 -0
@@ -0,0 +1,295 @@
1
+
2
+ {
3
+ "color": {
4
+ "white": {
5
+ "type": "color",
6
+ "value": "#ffffff"
7
+ },
8
+ "gray": {
9
+ "10": {
10
+ "type": "color",
11
+ "value": "#f2f2f2"
12
+ },
13
+ "20": {
14
+ "type": "color",
15
+ "value": "#e0e0e0"
16
+ },
17
+ "30": {
18
+ "type": "color",
19
+ "value": "#c7c7c7"
20
+ },
21
+ "40": {
22
+ "type": "color",
23
+ "value": "#a3a3a3"
24
+ },
25
+ "50": {
26
+ "type": "color",
27
+ "value": "#707070"
28
+ },
29
+ "60": {
30
+ "type": "color",
31
+ "value": "#4d4d4d"
32
+ },
33
+ "70": {
34
+ "type": "color",
35
+ "value": "#383838"
36
+ },
37
+ "80": {
38
+ "type": "color",
39
+ "value": "#292929"
40
+ },
41
+ "90": {
42
+ "type": "color",
43
+ "value": "#1f1f1f"
44
+ },
45
+ "95": {
46
+ "type": "color",
47
+ "value": "#151515"
48
+ }
49
+ },
50
+ "black": {
51
+ "type": "color",
52
+ "value": "#000000"
53
+ },
54
+ "blue": {
55
+ "10": {
56
+ "type": "color",
57
+ "value": "#e0f0ff"
58
+ },
59
+ "20": {
60
+ "type": "color",
61
+ "value": "#b9dafc"
62
+ },
63
+ "30": {
64
+ "type": "color",
65
+ "value": "#92c5f9"
66
+ },
67
+ "40": {
68
+ "type": "color",
69
+ "value": "#4394e5"
70
+ },
71
+ "50": {
72
+ "type": "color",
73
+ "value": "#0066cc"
74
+ },
75
+ "60": {
76
+ "type": "color",
77
+ "value": "#004d99"
78
+ },
79
+ "70": {
80
+ "type": "color",
81
+ "value": "#003366"
82
+ }
83
+ },
84
+ "teal": {
85
+ "10": {
86
+ "type": "color",
87
+ "value": "#daf2f2"
88
+ },
89
+ "20": {
90
+ "type": "color",
91
+ "value": "#b9e5e5"
92
+ },
93
+ "30": {
94
+ "type": "color",
95
+ "value": "#9ad8d8"
96
+ },
97
+ "40": {
98
+ "type": "color",
99
+ "value": "#63bdbd"
100
+ },
101
+ "50": {
102
+ "type": "color",
103
+ "value": "#37a3a3"
104
+ },
105
+ "60": {
106
+ "type": "color",
107
+ "value": "#147878"
108
+ },
109
+ "70": {
110
+ "type": "color",
111
+ "value": "#004d4d"
112
+ }
113
+ },
114
+ "yellow": {
115
+ "10": {
116
+ "type": "color",
117
+ "value": "#fff4cc"
118
+ },
119
+ "20": {
120
+ "type": "color",
121
+ "value": "#ffe072"
122
+ },
123
+ "30": {
124
+ "type": "color",
125
+ "value": "#ffcc17"
126
+ },
127
+ "40": {
128
+ "type": "color",
129
+ "value": "#dca614"
130
+ },
131
+ "50": {
132
+ "type": "color",
133
+ "value": "#b98412"
134
+ },
135
+ "60": {
136
+ "type": "color",
137
+ "value": "#96640f"
138
+ },
139
+ "70": {
140
+ "type": "color",
141
+ "value": "#73480b"
142
+ }
143
+ },
144
+ "green": {
145
+ "10": {
146
+ "type": "color",
147
+ "value": "#e9f7df"
148
+ },
149
+ "20": {
150
+ "type": "color",
151
+ "value": "#d1f1bb"
152
+ },
153
+ "30": {
154
+ "type": "color",
155
+ "value": "#afdc8f"
156
+ },
157
+ "40": {
158
+ "type": "color",
159
+ "value": "#87bb62"
160
+ },
161
+ "50": {
162
+ "type": "color",
163
+ "value": "#63993d"
164
+ },
165
+ "60": {
166
+ "type": "color",
167
+ "value": "#3d7317"
168
+ },
169
+ "70": {
170
+ "type": "color",
171
+ "value": "#204d00"
172
+ }
173
+ },
174
+ "orange": {
175
+ "10": {
176
+ "type": "color",
177
+ "value": "#ffe8cc"
178
+ },
179
+ "20": {
180
+ "type": "color",
181
+ "value": "#fccb8f"
182
+ },
183
+ "30": {
184
+ "type": "color",
185
+ "value": "#f8ae54"
186
+ },
187
+ "40": {
188
+ "type": "color",
189
+ "value": "#f5921b"
190
+ },
191
+ "50": {
192
+ "type": "color",
193
+ "value": "#ca6c0f"
194
+ },
195
+ "60": {
196
+ "type": "color",
197
+ "value": "#9e4a06"
198
+ },
199
+ "70": {
200
+ "type": "color",
201
+ "value": "#732e00"
202
+ }
203
+ },
204
+ "red-orange": {
205
+ "10": {
206
+ "type": "color",
207
+ "value": "#ffe3d9"
208
+ },
209
+ "20": {
210
+ "type": "color",
211
+ "value": "#fbbea8"
212
+ },
213
+ "30": {
214
+ "type": "color",
215
+ "value": "#f89b78"
216
+ },
217
+ "40": {
218
+ "type": "color",
219
+ "value": "#f4784a"
220
+ },
221
+ "50": {
222
+ "type": "color",
223
+ "value": "#f0561d"
224
+ },
225
+ "60": {
226
+ "type": "color",
227
+ "value": "#b1380b"
228
+ },
229
+ "70": {
230
+ "type": "color",
231
+ "value": "#731f00"
232
+ }
233
+ },
234
+ "purple": {
235
+ "10": {
236
+ "type": "color",
237
+ "value": "#ece6ff"
238
+ },
239
+ "20": {
240
+ "type": "color",
241
+ "value": "#d0c5f4"
242
+ },
243
+ "30": {
244
+ "type": "color",
245
+ "value": "#b6a6e9"
246
+ },
247
+ "40": {
248
+ "type": "color",
249
+ "value": "#876fd4"
250
+ },
251
+ "50": {
252
+ "type": "color",
253
+ "value": "#5e40be"
254
+ },
255
+ "60": {
256
+ "type": "color",
257
+ "value": "#3d2785"
258
+ },
259
+ "70": {
260
+ "type": "color",
261
+ "value": "#21134d"
262
+ }
263
+ },
264
+ "red": {
265
+ "10": {
266
+ "type": "color",
267
+ "value": "#fce3e3"
268
+ },
269
+ "20": {
270
+ "type": "color",
271
+ "value": "#fbc5c5"
272
+ },
273
+ "30": {
274
+ "type": "color",
275
+ "value": "#f9a8a8"
276
+ },
277
+ "40": {
278
+ "type": "color",
279
+ "value": "#f56e6e"
280
+ },
281
+ "50": {
282
+ "type": "color",
283
+ "value": "#ee0000"
284
+ },
285
+ "60": {
286
+ "type": "color",
287
+ "value": "#a60000"
288
+ },
289
+ "70": {
290
+ "type": "color",
291
+ "value": "#5f0000"
292
+ }
293
+ }
294
+ }
295
+ }
@@ -0,0 +1,383 @@
1
+
2
+ {
3
+ "global": {
4
+ "border": {
5
+ "radius": {
6
+ "sharp": {
7
+ "type": "number",
8
+ "value": "{global.border.radius.0}"
9
+ },
10
+ "tiny": {
11
+ "type": "number",
12
+ "value": "{global.border.radius.100}"
13
+ },
14
+ "small": {
15
+ "type": "number",
16
+ "value": "{global.border.radius.200}"
17
+ },
18
+ "medium": {
19
+ "type": "number",
20
+ "value": "{global.border.radius.300}"
21
+ },
22
+ "large": {
23
+ "type": "number",
24
+ "value": "{global.border.radius.400}"
25
+ },
26
+ "pill": {
27
+ "type": "number",
28
+ "value": "{global.border.radius.500}"
29
+ }
30
+ },
31
+ "width": {
32
+ "divider": {
33
+ "default": {
34
+ "type": "number",
35
+ "value": "{global.border.width.100}"
36
+ },
37
+ "hover": {
38
+ "type": "number",
39
+ "value": "{global.border.width.100}"
40
+ },
41
+ "clicked": {
42
+ "type": "number",
43
+ "value": "{global.border.width.100}"
44
+ }
45
+ },
46
+ "regular": {
47
+ "type": "number",
48
+ "value": "{global.border.width.100}"
49
+ },
50
+ "strong": {
51
+ "type": "number",
52
+ "value": "{global.border.width.200}"
53
+ },
54
+ "extra-strong": {
55
+ "type": "number",
56
+ "value": "{global.border.width.300}"
57
+ },
58
+ "box": {
59
+ "default": {
60
+ "type": "number",
61
+ "value": "{global.border.width.100}"
62
+ },
63
+ "hover": {
64
+ "type": "number",
65
+ "value": "{global.border.width.100}"
66
+ },
67
+ "clicked": {
68
+ "type": "number",
69
+ "value": "{global.border.width.200}"
70
+ },
71
+ "status": {
72
+ "default": {
73
+ "type": "number",
74
+ "value": "{global.border.width.200}"
75
+ },
76
+ "read": {
77
+ "type": "number",
78
+ "value": "{global.border.width.100}"
79
+ }
80
+ }
81
+ },
82
+ "button": {
83
+ "default": {
84
+ "type": "number",
85
+ "value": "{global.border.width.100}"
86
+ },
87
+ "hover": {
88
+ "type": "number",
89
+ "value": "{global.border.width.200}"
90
+ },
91
+ "clicked": {
92
+ "type": "number",
93
+ "value": "{global.border.width.200}"
94
+ }
95
+ },
96
+ "control": {
97
+ "default": {
98
+ "type": "number",
99
+ "value": "{global.border.width.100}"
100
+ },
101
+ "hover": {
102
+ "type": "number",
103
+ "value": "{global.border.width.100}"
104
+ },
105
+ "clicked": {
106
+ "type": "number",
107
+ "value": "{global.border.width.200}"
108
+ }
109
+ }
110
+ }
111
+ },
112
+ "spacer": {
113
+ "xs": {
114
+ "type": "number",
115
+ "value": "{global.spacer.100}"
116
+ },
117
+ "sm": {
118
+ "type": "number",
119
+ "value": "{global.spacer.200}"
120
+ },
121
+ "md": {
122
+ "type": "number",
123
+ "value": "{global.spacer.300}"
124
+ },
125
+ "lg": {
126
+ "type": "number",
127
+ "value": "{global.spacer.400}"
128
+ },
129
+ "xl": {
130
+ "type": "number",
131
+ "value": "{global.spacer.500}"
132
+ },
133
+ "2xl": {
134
+ "type": "number",
135
+ "value": "{global.spacer.600}"
136
+ },
137
+ "3xl": {
138
+ "type": "number",
139
+ "value": "{global.spacer.700}"
140
+ },
141
+ "4xl": {
142
+ "type": "number",
143
+ "value": "{global.spacer.800}"
144
+ },
145
+ "button": {
146
+ "vertical": {
147
+ "default": {
148
+ "type": "number",
149
+ "value": "{global.spacer.200}"
150
+ },
151
+ "compact": {
152
+ "type": "number",
153
+ "value": "{global.spacer.100}"
154
+ }
155
+ },
156
+ "horizontal": {
157
+ "default": {
158
+ "type": "number",
159
+ "value": "{global.spacer.400}"
160
+ },
161
+ "compact": {
162
+ "type": "number",
163
+ "value": "{global.spacer.300}"
164
+ }
165
+ }
166
+ },
167
+ "control": {
168
+ "vertical": {
169
+ "type": "number",
170
+ "value": "{global.spacer.200}"
171
+ },
172
+ "horizontal": {
173
+ "type": "number",
174
+ "value": "{global.spacer.300}"
175
+ }
176
+ }
177
+ },
178
+ "icon": {
179
+ "size": {
180
+ "sm": {
181
+ "type": "number",
182
+ "value": "{global.icon.size.100}"
183
+ },
184
+ "md": {
185
+ "type": "number",
186
+ "value": "{global.icon.size.200}"
187
+ },
188
+ "lg": {
189
+ "type": "number",
190
+ "value": "{global.icon.size.250}"
191
+ },
192
+ "xl": {
193
+ "type": "number",
194
+ "value": "{global.icon.size.300}"
195
+ },
196
+ "2xl": {
197
+ "type": "number",
198
+ "value": "{global.icon.size.400}"
199
+ },
200
+ "font": {
201
+ "body": {
202
+ "sm": {
203
+ "type": "number",
204
+ "value": "{global.font.size.body.sm}"
205
+ },
206
+ "default": {
207
+ "type": "number",
208
+ "value": "{global.font.size.body.default}"
209
+ },
210
+ "lg": {
211
+ "type": "number",
212
+ "value": "{global.font.size.body.lg}"
213
+ }
214
+ },
215
+ "heading": {
216
+ "h1": {
217
+ "type": "number",
218
+ "value": "{global.font.size.heading.h1}"
219
+ },
220
+ "h2": {
221
+ "type": "number",
222
+ "value": "{global.font.size.heading.h2}"
223
+ },
224
+ "h3": {
225
+ "type": "number",
226
+ "value": "{global.font.size.heading.h3}"
227
+ },
228
+ "h4": {
229
+ "type": "number",
230
+ "value": "{global.font.size.heading.h4}"
231
+ },
232
+ "h5": {
233
+ "type": "number",
234
+ "value": "{global.font.size.heading.h5}"
235
+ },
236
+ "h6": {
237
+ "type": "number",
238
+ "value": "{global.font.size.heading.h6}"
239
+ }
240
+ },
241
+ "xs": {
242
+ "type": "number",
243
+ "value": "{global.font.size.xs}"
244
+ },
245
+ "sm": {
246
+ "type": "number",
247
+ "value": "{global.font.size.sm}"
248
+ },
249
+ "md": {
250
+ "type": "number",
251
+ "value": "{global.font.size.md}"
252
+ },
253
+ "lg": {
254
+ "type": "number",
255
+ "value": "{global.font.size.lg}"
256
+ },
257
+ "xl": {
258
+ "type": "number",
259
+ "value": "{global.font.size.xl}"
260
+ },
261
+ "2xl": {
262
+ "type": "number",
263
+ "value": "{global.font.size.2xl}"
264
+ },
265
+ "3xl": {
266
+ "type": "number",
267
+ "value": "{global.font.size.3xl}"
268
+ },
269
+ "4xl": {
270
+ "type": "number",
271
+ "value": "{global.font.size.4xl}"
272
+ }
273
+ },
274
+ "3xl": {
275
+ "type": "number",
276
+ "value": "{global.icon.size.500}"
277
+ }
278
+ }
279
+ },
280
+ "font": {
281
+ "size": {
282
+ "body": {
283
+ "sm": {
284
+ "type": "number",
285
+ "value": "{global.font.size.xs}"
286
+ },
287
+ "default": {
288
+ "type": "number",
289
+ "value": "{global.font.size.sm}"
290
+ },
291
+ "lg": {
292
+ "type": "number",
293
+ "value": "{global.font.size.md}"
294
+ }
295
+ },
296
+ "heading": {
297
+ "h1": {
298
+ "type": "number",
299
+ "value": "{global.font.size.2xl}"
300
+ },
301
+ "h2": {
302
+ "type": "number",
303
+ "value": "{global.font.size.xl}"
304
+ },
305
+ "h3": {
306
+ "type": "number",
307
+ "value": "{global.font.size.lg}"
308
+ },
309
+ "h4": {
310
+ "type": "number",
311
+ "value": "{global.font.size.md}"
312
+ },
313
+ "h5": {
314
+ "type": "number",
315
+ "value": "{global.font.size.md}"
316
+ },
317
+ "h6": {
318
+ "type": "number",
319
+ "value": "{global.font.size.md}"
320
+ }
321
+ },
322
+ "xs": {
323
+ "type": "number",
324
+ "value": "{global.font.size.100}"
325
+ },
326
+ "sm": {
327
+ "type": "number",
328
+ "value": "{global.font.size.200}"
329
+ },
330
+ "md": {
331
+ "type": "number",
332
+ "value": "{global.font.size.300}"
333
+ },
334
+ "lg": {
335
+ "type": "number",
336
+ "value": "{global.font.size.400}"
337
+ },
338
+ "xl": {
339
+ "type": "number",
340
+ "value": "{global.font.size.500}"
341
+ },
342
+ "2xl": {
343
+ "type": "number",
344
+ "value": "{global.font.size.600}"
345
+ },
346
+ "3xl": {
347
+ "type": "number",
348
+ "value": "{global.font.size.700}"
349
+ },
350
+ "4xl": {
351
+ "type": "number",
352
+ "value": "{global.font.size.800}"
353
+ }
354
+ }
355
+ },
356
+ "Zindex": {
357
+ "xs": {
358
+ "type": "number",
359
+ "value": "{global.Zindex.100}"
360
+ },
361
+ "sm": {
362
+ "type": "number",
363
+ "value": "{global.Zindex.200}"
364
+ },
365
+ "md": {
366
+ "type": "number",
367
+ "value": "{global.Zindex.300}"
368
+ },
369
+ "lg": {
370
+ "type": "number",
371
+ "value": "{global.Zindex.400}"
372
+ },
373
+ "xl": {
374
+ "type": "number",
375
+ "value": "{global.Zindex.500}"
376
+ },
377
+ "2xl": {
378
+ "type": "number",
379
+ "value": "{global.Zindex.600}"
380
+ }
381
+ }
382
+ }
383
+ }