@mittwald/flow-design-tokens 0.1.0-alpha.85 → 0.1.0-alpha.87

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 +22 -11
  2. package/package.json +3 -3
package/dist/variables.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 29 Apr 2024 06:28:19 GMT
3
+ * Generated on Mon, 29 Apr 2024 09:37:02 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -23,7 +23,6 @@
23
23
  --size-rem--xs: 0.25rem;
24
24
  --size-rem--xxs: 0.125rem;
25
25
  --size-rem--xxxs: 0.0625rem;
26
- --menu-item--icon-to-text-spacing: 0.5em;
27
26
  --font-size--xxxl: 2rem;
28
27
  --font-size--xxl: 1.5rem;
29
28
  --font-size--xl: 1.25rem;
@@ -122,12 +121,13 @@
122
121
  --icon--size--s: 1rem;
123
122
  --avatar--size--m: 2.5rem;
124
123
  --menu-item--background-color--default: var(--color--transparent);
124
+ --menu-item--icon-to-text-spacing: var(--size-rem--s);
125
125
  --menu-item--padding-y: var(--size-px--xs);
126
126
  --menu-item--padding-x: var(--size-px--s);
127
127
  --menu-item--font-weight--current: var(--font-weight--bold);
128
128
  --menu--label-to-group-spacing: var(--size-px--s);
129
129
  --menu--group-to-group-spacing: var(--size-px--m);
130
- --menu--item-to-item-spacing: var(--size-px--s);
130
+ --menu--item-to-item-spacing: var(--size-px--xs);
131
131
  --form-control--border-style: var(--border-style--default);
132
132
  --form-control--padding-y: var(--size-px--s);
133
133
  --form-control--padding-x: var(--size-px--m);
@@ -136,6 +136,7 @@
136
136
  --font-size--default: var(--font-size--m);
137
137
  --line-height--m: calc(var(--font-size--m) * 1.5);
138
138
  --focus--outline-offset: var(--size-px--xxs);
139
+ --disabled-inverse-background-color: var(--color--transparent);
139
140
  --disabled-plain-background-color: var(--color--transparent);
140
141
  --neutral-plain-background-color--default: var(--color--transparent);
141
142
  --warning-outline-background-color--default: var(--color--transparent);
@@ -224,6 +225,7 @@
224
225
  --tooltip--padding-y: var(--size-px--xs);
225
226
  --tooltip--padding-x: var(--size-px--s);
226
227
  --tab-panel--padding: var(--size-px--xl);
228
+ --tab--text-to-status-spacing: var(--size-rem--s);
227
229
  --tab--font-weight--selected: var(--font-weight--bold);
228
230
  --tab--padding-x: var(--size-px--l);
229
231
  --tab--padding-y: var(--size-px--m);
@@ -251,8 +253,8 @@
251
253
  --progress-bar--value-font-weight: var(--font-weight--bold);
252
254
  --progress-bar--font-size-small: var(--font-size--s);
253
255
  --progress-bar--font-size: var(--font-size--m);
254
- --popover--padding: var(--size-px--m);
255
- --popover--border-radius: var(--size-px--xs);
256
+ --popover--padding: var(--size-px--s);
257
+ --popover--corner-radius: var(--size-px--xs);
256
258
  --modal--button-group-border-style: var(--border-style--default);
257
259
  --modal--button-group-padding: var(--size-rem--l);
258
260
  --modal--padding-bottom: var(--size-px--xl);
@@ -320,6 +322,8 @@
320
322
  --checkbox-button--label-font-weight-with-content: var(--font-weight--bold);
321
323
  --checkbox-button--icon-to-text-spacing: var(--size-rem--m);
322
324
  --checkbox-button--text-to-text-spacing: var(--size-rem--xs);
325
+ --button--inverse-background-color--pressed: var(--inverse-background-color--pressed);
326
+ --button--inverse-background-color--hover: var(--inverse-background-color--hover);
323
327
  --button--font-size-s: var(--font-size--s);
324
328
  --button--text-to-icon-spacing-s: var(--size-rem--xs);
325
329
  --button--padding-s-squished-y: var(--size-px--xs);
@@ -338,12 +342,11 @@
338
342
  --avatar--size--s: var(--size-rem--xl);
339
343
  --avatar--size--xs: var(--size-rem--l);
340
344
  --menu-item--disabled-background-color: var(--disabled-plain-background-color);
341
- --menu-item--background-color--current: var(--info--color--200);
342
- --menu-item--background-color--hover: var(--info--color--100);
345
+ --menu-item--background-color--current: var(--primary--color--200);
346
+ --menu-item--background-color--hover: var(--primary--color--100);
343
347
  --menu-item--icon-color--current: var(--info--color--800);
344
348
  --menu-item--icon-color--default: var(--neutral--color--800);
345
- --menu-item--color--current: var(--info--color--800);
346
- --menu-item--color--default: var(--neutral--color--1000);
349
+ --menu-item--color--current: var(--primary--color--800);
347
350
  --menu-item--corner-radius: var(--corner-radius--default);
348
351
  --form-control--background-color--invalid: var(--danger--color--100);
349
352
  --form-control--background-color--focused: var(--neutral--color--200);
@@ -352,10 +355,11 @@
352
355
  --form-control--placeholder-color--default: var(--neutral--color--900);
353
356
  --form-control--border-width: var(--border-width--100);
354
357
  --form-control--corner-radius: var(--corner-radius--default);
358
+ --content--color: var(--neutral--color--1000);
355
359
  --focus--outline-width: var(--border-width--200);
356
360
  --focus--outline-color: var(--primary--color--800);
357
- --color--default: var(--neutral--color--1000);
358
361
  --inverse-content-color: var(--neutral--color--100);
362
+ --disabled-inverse-content-color: var(--neutral--color--700);
359
363
  --disabled-soft-content-color: var(--neutral--color--500);
360
364
  --disabled-soft-background-color: var(--neutral--color--300);
361
365
  --disabled-outline-border-color: var(--neutral--color--400);
@@ -511,6 +515,7 @@
511
515
  --header-navigation--item-corner-radius: var(--corner-radius--default);
512
516
  --field-error--color: var(--danger--color--700);
513
517
  --field-description--color: var(--neutral--color--800);
518
+ --button--disabled-inverse-background-color: var(--disabled-inverse-background-color);
514
519
  --button--disabled-plain-background-color: var(--disabled-plain-background-color);
515
520
  --button--danger-plain-background-color--default: var(--danger-plain-background-color--default);
516
521
  --button--secondary-plain-background-color--default: var(--neutral-plain-background-color--default);
@@ -541,6 +546,10 @@
541
546
  --switch--handle-color--default: var(--neutral-solid-content-color);
542
547
  --switch--track-background-color--selected: var(--success-solid-background-color--default);
543
548
  --switch--track-background-color--default: var(--neutral-solid-background-color--default);
549
+ --status-icon--success-color: var(--success-outline-content-color);
550
+ --status-icon--danger-color: var(--danger-outline-content-color);
551
+ --status-icon--warning-color: var(--warning-outline-content-color);
552
+ --status-icon--info-color: var(--info-outline-content-color);
544
553
  --status-badge--danger-content-color: var(--danger-soft-content-color--default);
545
554
  --status-badge--danger-background-color: var(--danger-soft-background-color--default);
546
555
  --status-badge--warning-content-color: var(--warning-soft-content-color--default);
@@ -582,6 +591,8 @@
582
591
  --checkbox--icon-color--selected: var(--neutral-outline-border-color--selected);
583
592
  --checkbox--icon-color--default: var(--icon--color);
584
593
  --checkbox--color--disabled: var(--disabled-outline-content-color);
594
+ --button--inverse-content-color: var(--inverse-content-color);
595
+ --button--disabled-inverse-content-color: var(--disabled-inverse-content-color);
585
596
  --button--disabled-soft-content-color: var(--disabled-soft-content-color);
586
597
  --button--disabled-soft-background-color: var(--disabled-soft-background-color);
587
598
  --button--disabled-plain-content-color: var(--disabled-plain-content-color);
@@ -656,5 +667,5 @@
656
667
  --button--accent-solid-background-color--hover: var(--success-solid-background-color--hover);
657
668
  --button--accent-solid-background-color--default: var(--success-solid-background-color--default);
658
669
  --button--pending-icon-color: var(--disabled-plain-content-accent-color);
659
- --breadcrumb-item--color: var(--color--default);
670
+ --breadcrumb-item--color: var(--content--color);
660
671
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mittwald/flow-design-tokens",
3
- "version": "0.1.0-alpha.85",
3
+ "version": "0.1.0-alpha.87",
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",
@@ -17,8 +17,8 @@
17
17
  "devDependencies": {
18
18
  "@types/js-yaml": "^4.0.9",
19
19
  "js-yaml": "^4.1.0",
20
- "nx": "^18.3.1",
20
+ "nx": "^18.3.4",
21
21
  "style-dictionary": "^3.9.2"
22
22
  },
23
- "gitHead": "c30d2597e7b46bde6e6b7ed199983a8aca8c9262"
23
+ "gitHead": "2e459f372876383b7ca9d15861a40a2609c77f14"
24
24
  }