@mittwald/flow-design-tokens 0.1.0-alpha.65 → 0.1.0-alpha.68

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 (2) hide show
  1. package/dist/variables.css +40 -26
  2. package/package.json +2 -2
package/dist/variables.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 11 Apr 2024 13:25:52 GMT
3
+ * Generated on Tue, 16 Apr 2024 07:23:40 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -24,8 +24,9 @@
24
24
  --size-rem--xxs: 0.125rem;
25
25
  --size-rem--xxxs: 0.0625rem;
26
26
  --menu-item--icon-to-text-spacing: 0.5em;
27
- --font-size--xxl: 2rem;
28
- --font-size--xl: 1.5rem;
27
+ --font-size--xxxl: 2rem;
28
+ --font-size--xxl: 1.5rem;
29
+ --font-size--xl: 1.25rem;
29
30
  --font-size--l: 1.125rem;
30
31
  --font-size--m: 1rem;
31
32
  --font-size--s: 0.875rem;
@@ -112,6 +113,7 @@
112
113
  --modal--size--m: 900px;
113
114
  --modal--size--s: 660px;
114
115
  --modal--overlay-background-color: rgba(0, 0, 0, 0.3);
116
+ --illustrated-message--max-width: 400px;
115
117
  --icon--size--l: 4rem;
116
118
  --icon--size--m: 1.5rem;
117
119
  --icon--size--s: 1rem;
@@ -120,7 +122,7 @@
120
122
  --menu-item--padding-y: var(--size-px--xs);
121
123
  --menu-item--padding-x: var(--size-px--s);
122
124
  --menu-item--font-weight--current: var(--font-weight--bold);
123
- --menu--heading-to-group-spacing: var(--size-px--s);
125
+ --menu--label-to-group-spacing: var(--size-px--s);
124
126
  --menu--group-to-group-spacing: var(--size-px--m);
125
127
  --menu--item-to-item-spacing: var(--size-px--s);
126
128
  --form-control--border-style: var(--border-style--default);
@@ -218,18 +220,15 @@
218
220
  --tooltip--font-size: var(--font-size--s);
219
221
  --tooltip--padding-y: var(--size-px--xs);
220
222
  --tooltip--padding-x: var(--size-px--s);
221
- --tab-panel--padding: var(--size-px--l);
223
+ --tab-panel--padding: var(--size-px--xl);
222
224
  --tab--font-weight--selected: var(--font-weight--bold);
223
225
  --tab--padding-x: var(--size-px--l);
224
226
  --tab--padding-y: var(--size-px--m);
225
- --tab-list--tab-to-tab-spacing: var(--size-px--xxs);
226
227
  --switch--track-padding: var(--size-rem--xxs);
227
228
  --switch--label-to-track-spacing: var(--size-rem--s);
228
229
  --status-badge--icon-to-text-spacing: var(--size-rem--xs);
229
- --status-badge--padding-icon-only: var(--size-rem--xxs);
230
230
  --status-badge--padding-x: var(--size-rem--s);
231
231
  --status-badge--padding-y: var(--size-rem--xxs);
232
- --status-badge--corner-radius-icon-only: var(--corner-radius--round);
233
232
  --status-badge--font-weight: var(--font-weight--bold);
234
233
  --status-badge--font-size: var(--font-size--s);
235
234
  --segmented-button--text-to-text-spacing: var(--size-rem--xs);
@@ -244,9 +243,11 @@
244
243
  --radio-group--radio-to-radio-spacing: var(--size-rem--s);
245
244
  --progress-bar--bar-border-radius: var(--size-rem--xs);
246
245
  --progress-bar--bar-height: var(--size-rem--s);
246
+ --progress-bar--label-to-value-spacing: var(--size-rem--m);
247
247
  --progress-bar--label-to-bar-spacing: var(--size-rem--xs);
248
248
  --progress-bar--value-font-weight: var(--font-weight--bold);
249
- --progress-bar--font-size: var(--font-size--s);
249
+ --progress-bar--font-size-small: var(--font-size--s);
250
+ --progress-bar--font-size: var(--font-size--m);
250
251
  --popover--padding: var(--size-px--m);
251
252
  --popover--border-radius: var(--size-px--xs);
252
253
  --modal--button-group-border-style: var(--border-style--default);
@@ -262,7 +263,7 @@
262
263
  --link--text-to-icon-spacing: var(--size-rem--xs);
263
264
  --link--font-weight: var(--font-weight--bold);
264
265
  --link--font-size: var(--font-size--s);
265
- --layout-card--padding: var(--size-px--l);
266
+ --layout-card--padding: var(--size-px--xl);
266
267
  --labeled-value--value-to-button-spacing: var(--size-rem--xs);
267
268
  --labeled-value--label-to-value-spacing: var(--size-rem--xs);
268
269
  --label--font-weight: var(--font-weight--bold);
@@ -270,8 +271,9 @@
270
271
  --inline-code--padding-x: var(--size-px--xs);
271
272
  --inline-code--font-size: var(--font-size--s);
272
273
  --inline-alert--heading-font-size: var(--font-size--m);
273
- --inline-alert--icon-to-text-spacing: var(--size-rem--s);
274
- --inline-alert--text-to-text-spacing: var(--size-rem--xs);
274
+ --inline-alert--content-to-content-spacing: var(--size-rem--s);
275
+ --inline-alert--icon-to-heading-spacing: var(--size-rem--s);
276
+ --inline-alert--heading-to-content-spacing: var(--size-rem--xs);
275
277
  --inline-alert--border-style: var(--border-style--default);
276
278
  --inline-alert--padding: var(--size-px--m);
277
279
  --initials--variant-4-content-accent-color: var(--color--soft-contrast-violet--1000);
@@ -287,13 +289,18 @@
287
289
  --initials--variant-1-content-color: var(--color--hosting-blue--800);
288
290
  --initials--variant-1-background-color: var(--color--hosting-blue--200);
289
291
  --initials--font-weight: var(--font-weight--bold);
292
+ --illustrated-message--text-to-button-spacing: var(--size-rem--m);
293
+ --illustrated-message--heading-to-text-spacing: var(--size-rem--s);
294
+ --illustrated-message--icon-to-heading-spacing: var(--size-rem--m);
295
+ --illustrated-message--padding-mobile: var(--size-px--l);
296
+ --illustrated-message--padding: var(--size-px--xxl);
290
297
  --heading--h6-font-size: var(--font-size--m);
291
298
  --heading--h5-font-size: var(--font-size--m);
292
- --heading--h4-font-size: var(--font-size--m);
293
- --heading--h3-font-size: var(--font-size--m);
294
- --heading--h2-font-size: var(--font-size--l);
295
- --heading--h1-font-size-mobile: var(--font-size--xl);
296
- --heading--h1-font-size: var(--font-size--xxl);
299
+ --heading--h4-font-size: var(--font-size--l);
300
+ --heading--h3-font-size: var(--font-size--xl);
301
+ --heading--h2-font-size: var(--font-size--xxl);
302
+ --heading--h1-font-size-mobile: var(--font-size--xxl);
303
+ --heading--h1-font-size: var(--font-size--xxxl);
297
304
  --heading--font-weight: var(--font-weight--bold);
298
305
  --heading--icon-to-text-spacing: var(--size-rem--s);
299
306
  --header-navigation--item-font-weight-current: var(--font-weight--bold);
@@ -457,9 +464,9 @@
457
464
  --primary-solid-background-color--default: var(--primary--color--800);
458
465
  --tooltip--color: var(--neutral--color--100);
459
466
  --tooltip--background-color: var(--neutral--color--900);
460
- --tab--color--selected: var(--primary--color--800);
467
+ --tab--corner-top-radius-current: var(--corner-radius--default);
468
+ --tab--disabled-color: var(--neutral--color--600);
461
469
  --tab--background-color--selected: var(--neutral--color--100);
462
- --tab--background-color--default: var(--neutral--color--400);
463
470
  --tab-list--background-color: var(--neutral--color--400);
464
471
  --switch--handle-background-color: var(--neutral--color--100);
465
472
  --switch--handle-color--disabled: var(--neutral--color--600);
@@ -489,6 +496,10 @@
489
496
  --inline-alert--border-x-start-width: var(--border-width--400);
490
497
  --inline-alert--border-width: var(--border-width--100);
491
498
  --inline-alert--corner-radius: var(--corner-radius--default);
499
+ --illustrated-message--negative-heading-color: var(--danger--color--900);
500
+ --illustrated-message--negative-icon-color: var(--danger--color--800);
501
+ --illustrated-message--info-heading-color: var(--info--color--800);
502
+ --illustrated-message--info-icon-color: var(--info--color--800);
492
503
  --icon--color--default: var(--neutral--color--900);
493
504
  --heading--color: var(--primary--color--1000);
494
505
  --header-navigation--item-underline-width-current: var(--border-width--200);
@@ -514,7 +525,13 @@
514
525
  --form-control--border-color--invalid: var(--danger-outline-border-color);
515
526
  --form-control--border-color--disabled: var(--disabled-outline-border-color);
516
527
  --form-control--border-color--default: var(--neutral-outline-border-color--default);
517
- --tab--color--default: var(--color--default);
528
+ --tab--disabled-background-color: var(--neutral-soft-background-color--default);
529
+ --tab--color--pressed: var(--neutral-soft-content-color--pressed);
530
+ --tab--color--hover: var(--neutral-soft-content-color--hover);
531
+ --tab--color--default: var(--neutral-soft-content-color--default);
532
+ --tab--background-color--pressed: var(--neutral-soft-background-color--pressed);
533
+ --tab--background-color--hover: var(--neutral-soft-background-color--hover);
534
+ --tab--background-color--default: var(--neutral-soft-background-color--default);
518
535
  --switch--handle-color--default: var(--neutral-solid-content-color);
519
536
  --switch--track-background-color--selected: var(--success-solid-background-color--default);
520
537
  --switch--track-background-color--default: var(--neutral-solid-background-color--default);
@@ -538,12 +555,9 @@
538
555
  --list-item--border-color: var(--neutral-outline-border-color--default);
539
556
  --list-item--background-color--pressed: var(--neutral-outline-background-color--pressed);
540
557
  --list-item--background-color--hover: var(--neutral-outline-background-color--hover);
541
- --link--danger-color--pressed: var(--danger-plain-content-color--pressed);
542
- --link--danger-color--hover: var(--danger-plain-content-color--hover);
543
- --link--danger-color--default: var(--danger-plain-content-color--default);
544
- --link--primary-color--pressed: var(--primary-plain-content-color--pressed);
545
- --link--primary-color--hover: var(--primary-plain-content-color--hover);
546
- --link--primary-color--default: var(--primary-plain-content-color--default);
558
+ --link--color--pressed: var(--primary-plain-content-color--pressed);
559
+ --link--color--hover: var(--primary-plain-content-color--hover);
560
+ --link--color--default: var(--primary-plain-content-color--default);
547
561
  --link--disabled-color: var(--disabled-plain-content-color);
548
562
  --inline-code--background-color: var(--neutral-soft-background-color--default);
549
563
  --inline-alert--success-heading-color: var(--success-outline-content-color);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mittwald/flow-design-tokens",
3
- "version": "0.1.0-alpha.65",
3
+ "version": "0.1.0-alpha.68",
4
4
  "type": "module",
5
5
  "description": "The design tokens used in Flow, mittwald’s design system",
6
6
  "homepage": "https://mittwald.github.io/flow",
@@ -20,5 +20,5 @@
20
20
  "nx": "^18.2.4",
21
21
  "style-dictionary": "^3.9.2"
22
22
  },
23
- "gitHead": "000868d3499fd78147a5a50f1d5e6571c18527b7"
23
+ "gitHead": "45433f8067f9db8d52fd6e6d8f1e2971dc71d4fb"
24
24
  }