@patternfly/design-tokens 1.0.3 → 1.0.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 (9) hide show
  1. package/build/css/_tokens-charts.scss +1 -1
  2. package/build/css/_tokens-dark.scss +2 -2
  3. package/build/css/_tokens-default.scss +17 -11
  4. package/build/css/_tokens-palette.scss +1 -1
  5. package/package.json +1 -1
  6. package/tokens/dark/base.dark.json +1 -1
  7. package/tokens/default/base.json +2 -2
  8. package/tokens/default/semantic.dimension.json +58 -30
  9. package/tokens/default/semantic.json +2 -2
package/build/css/_tokens-charts.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  // /**
2
2
  // * Do not edit directly
3
- // * Generated on Thu, 21 Mar 2024 17:46:16 GMT
3
+ // * Generated on Wed, 27 Mar 2024 20:59:01 GMT
4
4
  // */
5
5
 
6
6
  :root {
package/build/css/_tokens-dark.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  // /**
2
2
  // * Do not edit directly
3
- // * Generated on Thu, 21 Mar 2024 17:46:16 GMT
3
+ // * Generated on Wed, 27 Mar 2024 20:59:01 GMT
4
4
  // */
5
5
 
6
6
  :root {
@@ -67,7 +67,7 @@
67
67
  --pf-t--global--dark--color--status--success--100: var(--pf-t--color--green--40);
68
68
  --pf-t--global--dark--color--favorite--200: var(--pf-t--color--yellow--20);
69
69
  --pf-t--global--dark--color--favorite--100: var(--pf-t--color--yellow--30);
70
- --pf-t--global--dark--color--disabled--300: var(--pf-t--color--gray--60);
70
+ --pf-t--global--dark--color--disabled--300: var(--pf-t--color--gray--70);
71
71
  --pf-t--global--dark--color--disabled--200: var(--pf-t--color--gray--50);
72
72
  --pf-t--global--dark--color--disabled--100: var(--pf-t--color--gray--40);
73
73
  --pf-t--global--dark--color--brand--300: var(--pf-t--color--blue--10);
package/build/css/_tokens-default.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  // /**
2
2
  // * Do not edit directly
3
- // * Generated on Thu, 21 Mar 2024 17:46:16 GMT
3
+ // * Generated on Wed, 27 Mar 2024 20:59:01 GMT
4
4
  // */
5
5
 
6
6
  :root {
@@ -113,8 +113,8 @@
113
113
  --pf-t--global--color--favorite--200: var(--pf-t--color--yellow--40);
114
114
  --pf-t--global--color--favorite--100: var(--pf-t--color--yellow--30);
115
115
  --pf-t--global--color--disabled--300: var(--pf-t--color--gray--60);
116
- --pf-t--global--color--disabled--200: var(--pf-t--color--gray--50);
117
- --pf-t--global--color--disabled--100: var(--pf-t--color--gray--40);
116
+ --pf-t--global--color--disabled--200: var(--pf-t--color--gray--40);
117
+ --pf-t--global--color--disabled--100: var(--pf-t--color--gray--30);
118
118
  --pf-t--global--color--brand--300: var(--pf-t--color--blue--60);
119
119
  --pf-t--global--color--brand--200: var(--pf-t--color--blue--50);
120
120
  --pf-t--global--color--brand--100: var(--pf-t--color--blue--40);
@@ -202,10 +202,10 @@
202
202
  --pf-t--global--border--width--box--default: var(--pf-t--global--border--width--100);
203
203
  --pf-t--global--border--width--extra-strong: var(--pf-t--global--border--width--300);
204
204
  --pf-t--global--border--width--strong: var(--pf-t--global--border--width--200);
205
+ --pf-t--global--border--width--regular: var(--pf-t--global--border--width--100);
205
206
  --pf-t--global--border--width--divider--clicked: var(--pf-t--global--border--width--100);
206
207
  --pf-t--global--border--width--divider--hover: var(--pf-t--global--border--width--100);
207
208
  --pf-t--global--border--width--divider--default: var(--pf-t--global--border--width--100);
208
- --pf-t--global--border--width--regular: var(--pf-t--global--border--width--100);
209
209
  --pf-t--global--icon--color--300: var(--pf-t--color--white);
210
210
  --pf-t--global--icon--color--200: var(--pf-t--color--gray--50);
211
211
  --pf-t--global--icon--color--100: var(--pf-t--color--gray--90);
@@ -215,12 +215,18 @@
215
215
  --pf-t--global--icon--size--lg: var(--pf-t--global--icon--size--250);
216
216
  --pf-t--global--icon--size--md: var(--pf-t--global--icon--size--200);
217
217
  --pf-t--global--icon--size--sm: var(--pf-t--global--icon--size--100);
218
- --pf-t--global--spacer--control--horizontal: var(--pf-t--global--spacer--300);
219
- --pf-t--global--spacer--control--vertical: var(--pf-t--global--spacer--200);
218
+ --pf-t--global--spacer--button--horizontal--plain: var(--pf-t--global--spacer--200);
220
219
  --pf-t--global--spacer--button--horizontal--compact: var(--pf-t--global--spacer--300);
221
220
  --pf-t--global--spacer--button--horizontal--default: var(--pf-t--global--spacer--400);
221
+ --pf-t--global--spacer--button--vertical--plain: var(--pf-t--global--spacer--200);
222
222
  --pf-t--global--spacer--button--vertical--compact: var(--pf-t--global--spacer--100);
223
223
  --pf-t--global--spacer--button--vertical--default: var(--pf-t--global--spacer--200);
224
+ --pf-t--global--spacer--control--horizontal--plain: var(--pf-t--global--spacer--200);
225
+ --pf-t--global--spacer--control--horizontal--compact: var(--pf-t--global--spacer--200);
226
+ --pf-t--global--spacer--control--horizontal--default: var(--pf-t--global--spacer--300);
227
+ --pf-t--global--spacer--control--vertical--plain: var(--pf-t--global--spacer--200);
228
+ --pf-t--global--spacer--control--vertical--compact: var(--pf-t--global--spacer--100);
229
+ --pf-t--global--spacer--control--vertical--default: var(--pf-t--global--spacer--200);
224
230
  --pf-t--global--spacer--4xl: var(--pf-t--global--spacer--800);
225
231
  --pf-t--global--spacer--3xl: var(--pf-t--global--spacer--700);
226
232
  --pf-t--global--spacer--2xl: var(--pf-t--global--spacer--600);
@@ -234,7 +240,7 @@
234
240
  --pf-t--global--text--color--status--warning--default: var(--pf-t--global--color--status--warning--200);
235
241
  --pf-t--global--text--color--required: var(--pf-t--global--text--color--400);
236
242
  --pf-t--global--text--color--on-disabled: var(--pf-t--global--color--disabled--300);
237
- --pf-t--global--text--color--disabled: var(--pf-t--global--color--disabled--100);
243
+ --pf-t--global--text--color--disabled: var(--pf-t--global--color--disabled--200);
238
244
  --pf-t--global--text--color--inverse: var(--pf-t--global--text--color--300);
239
245
  --pf-t--global--text--color--subtle: var(--pf-t--global--text--color--200);
240
246
  --pf-t--global--text--color--regular: var(--pf-t--global--text--color--100);
@@ -348,7 +354,7 @@
348
354
  --pf-t--global--border--color--status--warning--hover: var(--pf-t--global--color--status--warning--300);
349
355
  --pf-t--global--border--color--status--warning--default: var(--pf-t--global--color--status--warning--200);
350
356
  --pf-t--global--icon--color--on-disabled: var(--pf-t--global--color--disabled--300);
351
- --pf-t--global--icon--color--disabled: var(--pf-t--global--color--disabled--100);
357
+ --pf-t--global--icon--color--disabled: var(--pf-t--global--color--disabled--200);
352
358
  --pf-t--global--icon--color--inverse: var(--pf-t--global--icon--color--300);
353
359
  --pf-t--global--icon--color--subtle: var(--pf-t--global--icon--color--200);
354
360
  --pf-t--global--icon--color--regular: var(--pf-t--global--icon--color--100);
@@ -524,14 +530,14 @@
524
530
  --pf-t--global--icon--color--brand--clicked: var(--pf-t--global--color--brand--clicked);
525
531
  --pf-t--global--icon--color--brand--hover: var(--pf-t--global--color--brand--hover);
526
532
  --pf-t--global--icon--color--brand--default: var(--pf-t--global--color--brand--default);
527
- --pf-t--global--icon--size--font--body--lg: var(--pf-t--global--font--size--body--lg);
528
- --pf-t--global--icon--size--font--body--default: var(--pf-t--global--font--size--body--default);
529
- --pf-t--global--icon--size--font--body--sm: var(--pf-t--global--font--size--body--sm);
530
533
  --pf-t--global--icon--size--font--heading--h6: var(--pf-t--global--font--size--heading--h6);
531
534
  --pf-t--global--icon--size--font--heading--h5: var(--pf-t--global--font--size--heading--h5);
532
535
  --pf-t--global--icon--size--font--heading--h4: var(--pf-t--global--font--size--heading--h4);
533
536
  --pf-t--global--icon--size--font--heading--h3: var(--pf-t--global--font--size--heading--h3);
534
537
  --pf-t--global--icon--size--font--heading--h2: var(--pf-t--global--font--size--heading--h2);
535
538
  --pf-t--global--icon--size--font--heading--h1: var(--pf-t--global--font--size--heading--h1);
539
+ --pf-t--global--icon--size--font--body--lg: var(--pf-t--global--font--size--body--lg);
540
+ --pf-t--global--icon--size--font--body--default: var(--pf-t--global--font--size--body--default);
541
+ --pf-t--global--icon--size--font--body--sm: var(--pf-t--global--font--size--body--sm);
536
542
  --pf-t--global--color--status--read--on-secondary: var(--pf-t--global--background--color--control--default);
537
543
  }
package/build/css/_tokens-palette.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  // /**
2
2
  // * Do not edit directly
3
- // * Generated on Thu, 21 Mar 2024 17:46:16 GMT
3
+ // * Generated on Wed, 27 Mar 2024 20:59:01 GMT
4
4
  // */
5
5
 
6
6
  :root {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/design-tokens",
3
- "version": "1.0.3",
3
+ "version": "1.0.4",
4
4
  "description": "Define the design tokens for patternfly design system and component library",
5
5
  "main": "dist/esm/index.js",
6
6
  "module": "dist/esm/index.js",
package/tokens/dark/base.dark.json CHANGED
@@ -66,7 +66,7 @@
66
66
  },
67
67
  "300": {
68
68
  "type": "color",
69
- "value": "{color.gray.60}"
69
+ "value": "{color.gray.70}"
70
70
  }
71
71
  },
72
72
  "favorite": {
package/tokens/default/base.json CHANGED
@@ -57,11 +57,11 @@
57
57
  "disabled": {
58
58
  "100": {
59
59
  "type": "color",
60
- "value": "{color.gray.40}"
60
+ "value": "{color.gray.30}"
61
61
  },
62
62
  "200": {
63
63
  "type": "color",
64
- "value": "{color.gray.50}"
64
+ "value": "{color.gray.40}"
65
65
  },
66
66
  "300": {
67
67
  "type": "color",
package/tokens/default/semantic.dimension.json CHANGED
@@ -29,10 +29,6 @@
29
29
  }
30
30
  },
31
31
  "width": {
32
- "regular": {
33
- "type": "number",
34
- "value": "{global.border.width.100}"
35
- },
36
32
  "divider": {
37
33
  "default": {
38
34
  "type": "number",
@@ -47,6 +43,10 @@
47
43
  "value": "{global.border.width.100}"
48
44
  }
49
45
  },
46
+ "regular": {
47
+ "type": "number",
48
+ "value": "{global.border.width.100}"
49
+ },
50
50
  "strong": {
51
51
  "type": "number",
52
52
  "value": "{global.border.width.200}"
@@ -142,7 +142,7 @@
142
142
  "type": "number",
143
143
  "value": "{global.spacer.800}"
144
144
  },
145
- "button": {
145
+ "control": {
146
146
  "vertical": {
147
147
  "default": {
148
148
  "type": "number",
@@ -151,27 +151,55 @@
151
151
  "compact": {
152
152
  "type": "number",
153
153
  "value": "{global.spacer.100}"
154
+ },
155
+ "plain": {
156
+ "type": "number",
157
+ "value": "{global.spacer.200}"
154
158
  }
155
159
  },
156
160
  "horizontal": {
157
161
  "default": {
158
162
  "type": "number",
159
- "value": "{global.spacer.400}"
163
+ "value": "{global.spacer.300}"
160
164
  },
161
165
  "compact": {
162
166
  "type": "number",
163
- "value": "{global.spacer.300}"
167
+ "value": "{global.spacer.200}"
168
+ },
169
+ "plain": {
170
+ "type": "number",
171
+ "value": "{global.spacer.200}"
164
172
  }
165
173
  }
166
174
  },
167
- "control": {
175
+ "button": {
168
176
  "vertical": {
169
- "type": "number",
170
- "value": "{global.spacer.200}"
177
+ "default": {
178
+ "type": "number",
179
+ "value": "{global.spacer.200}"
180
+ },
181
+ "compact": {
182
+ "type": "number",
183
+ "value": "{global.spacer.100}"
184
+ },
185
+ "plain": {
186
+ "type": "number",
187
+ "value": "{global.spacer.200}"
188
+ }
171
189
  },
172
190
  "horizontal": {
173
- "type": "number",
174
- "value": "{global.spacer.300}"
191
+ "default": {
192
+ "type": "number",
193
+ "value": "{global.spacer.400}"
194
+ },
195
+ "compact": {
196
+ "type": "number",
197
+ "value": "{global.spacer.300}"
198
+ },
199
+ "plain": {
200
+ "type": "number",
201
+ "value": "{global.spacer.200}"
202
+ }
175
203
  }
176
204
  }
177
205
  },
@@ -197,11 +225,21 @@
197
225
  "type": "number",
198
226
  "value": "{global.icon.size.400}"
199
227
  },
200
- "3xl": {
201
- "type": "number",
202
- "value": "{global.icon.size.500}"
203
- },
204
228
  "font": {
229
+ "body": {
230
+ "sm": {
231
+ "type": "number",
232
+ "value": "{global.font.size.body.sm}"
233
+ },
234
+ "default": {
235
+ "type": "number",
236
+ "value": "{global.font.size.body.default}"
237
+ },
238
+ "lg": {
239
+ "type": "number",
240
+ "value": "{global.font.size.body.lg}"
241
+ }
242
+ },
205
243
  "heading": {
206
244
  "h1": {
207
245
  "type": "number",
@@ -228,20 +266,6 @@
228
266
  "value": "{global.font.size.heading.h6}"
229
267
  }
230
268
  },
231
- "body": {
232
- "sm": {
233
- "type": "number",
234
- "value": "{global.font.size.body.sm}"
235
- },
236
- "default": {
237
- "type": "number",
238
- "value": "{global.font.size.body.default}"
239
- },
240
- "lg": {
241
- "type": "number",
242
- "value": "{global.font.size.body.lg}"
243
- }
244
- },
245
269
  "xs": {
246
270
  "type": "number",
247
271
  "value": "{global.font.size.xs}"
@@ -274,6 +298,10 @@
274
298
  "type": "number",
275
299
  "value": "{global.font.size.4xl}"
276
300
  }
301
+ },
302
+ "3xl": {
303
+ "type": "number",
304
+ "value": "{global.icon.size.500}"
277
305
  }
278
306
  }
279
307
  },
package/tokens/default/semantic.json CHANGED
@@ -607,7 +607,7 @@
607
607
  },
608
608
  "disabled": {
609
609
  "type": "color",
610
- "value": "{global.color.disabled.100}"
610
+ "value": "{global.color.disabled.200}"
611
611
  },
612
612
  "on-disabled": {
613
613
  "type": "color",
@@ -1033,7 +1033,7 @@
1033
1033
  },
1034
1034
  "disabled": {
1035
1035
  "type": "color",
1036
- "value": "{global.color.disabled.100}"
1036
+ "value": "{global.color.disabled.200}"
1037
1037
  },
1038
1038
  "on-disabled": {
1039
1039
  "type": "color",