@lmvz-ds/design-tokens 0.11.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 (8) hide show
  1. package/LICENSE.txt +3 -0
  2. package/README.md +53 -0
  3. package/dist/css/variables.base.css +887 -0
  4. package/dist/css/variables.dark.global.css +85 -0
  5. package/dist/css/variables.dark.themed.css +85 -0
  6. package/dist/css/variables.light.global.css +87 -0
  7. package/dist/css/variables.light.themed.css +87 -0
  8. package/package.json +62 -0
package/dist/css/variables.dark.global.css ADDED
@@ -0,0 +1,85 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --lmvz-semantic-shadow-l1-1-position-y: 2px;
7
+ --lmvz-semantic-shadow-l1-1-blur: 4px;
8
+ --lmvz-semantic-shadow-l2-1-position-y: 2px;
9
+ --lmvz-semantic-shadow-l2-1-blur: 12px;
10
+ --lmvz-semantic-shadow-l2-2-position-y: 4px;
11
+ --lmvz-semantic-shadow-l2-2-blur: 24px;
12
+ --lmvz-semantic-shadow-l3-1-position-y: 2px;
13
+ --lmvz-semantic-shadow-l3-1-blur: 34px;
14
+ --lmvz-semantic-shadow-l3-2-position-y: 18px;
15
+ --lmvz-semantic-shadow-l3-2-blur: 62px;
16
+ --lmvz-semantic-border-radius-round: 999px;
17
+ --lmvz-semantic-border-radius-none: 0px;
18
+ --lmvz-semantic-color-int-primary-hover-shadow: rgba(0, 0, 0, 0);
19
+ --lmvz-semantic-color-shadow-l1-default: rgba(120, 120, 128, 0.08);
20
+ --lmvz-semantic-color-shadow-l1-default-strong: rgba(120, 120, 128, 0.28);
21
+ --lmvz-semantic-color-shadow-l1-colored: rgba(175, 223, 249, 0.42);
22
+ --lmvz-semantic-color-shadow-l1-colored-strong: rgba(175, 223, 249, 0.62);
23
+ --lmvz-semantic-color-shadow-l2-default: rgba(120, 120, 128, 0.08);
24
+ --lmvz-semantic-color-shadow-l2-default-strong: rgba(120, 120, 128, 0.16);
25
+ --lmvz-semantic-color-shadow-l2-colored: rgba(175, 223, 249, 0.42);
26
+ --lmvz-semantic-color-shadow-l2-colored-strong: rgba(175, 223, 249, 0.62);
27
+ --lmvz-semantic-color-shadow-l3-default: rgba(120, 120, 128, 0.05);
28
+ --lmvz-semantic-color-shadow-l3-default-strong: rgba(120, 120, 128, 0.11);
29
+ --lmvz-semantic-color-shadow-l3-colored: rgba(175, 223, 249, 0.42);
30
+ --lmvz-semantic-color-shadow-l3-colored-strong: rgba(175, 223, 249, 0.72);
31
+ --lmvz-semantic-border-radius-xl: var(--lmvz-global-s18);
32
+ --lmvz-semantic-border-radius-lg: var(--lmvz-global-s14);
33
+ --lmvz-semantic-border-radius-md: var(--lmvz-global-s6);
34
+ --lmvz-semantic-border-radius-sm: var(--lmvz-global-s2);
35
+ --lmvz-semantic-border-width-default: var(--lmvz-global-border-width-1);
36
+ --lmvz-semantic-color-int-primary: var(--lmvz-global-color-neutral-white);
37
+ --lmvz-semantic-color-int-primary-hover: var(--lmvz-global-color-grey-neutral-100);
38
+ --lmvz-semantic-color-int-primary-active: var(--lmvz-global-color-grey-neutral-200);
39
+ --lmvz-semantic-color-int-on-primary: var(--lmvz-global-color-neutral-black);
40
+ --lmvz-semantic-color-int-secondary: var(--lmvz-global-color-grey-neutral-800);
41
+ --lmvz-semantic-color-int-secondary-hover: var(--lmvz-global-color-grey-neutral-700);
42
+ --lmvz-semantic-color-int-secondary-active: var(--lmvz-global-color-grey-neutral-600);
43
+ --lmvz-semantic-color-int-on-secondary: var(--lmvz-global-color-neutral-white);
44
+ --lmvz-semantic-color-int-tertiary: var(--lmvz-global-color-neutral-black);
45
+ --lmvz-semantic-color-int-tertiary-hover: var(--lmvz-global-color-grey-neutral-800);
46
+ --lmvz-semantic-color-int-tertiary-active: var(--lmvz-global-color-grey-neutral-700);
47
+ --lmvz-semantic-color-int-on-tertiary: var(--lmvz-global-color-grey-neutral-200);
48
+ --lmvz-semantic-color-int-on-primary-hover: var(--lmvz-global-color-neutral-black);
49
+ --lmvz-semantic-color-int-on-primary-active: var(--lmvz-global-color-neutral-black);
50
+ --lmvz-semantic-color-int-on-secondary-hover: var(--lmvz-global-color-neutral-white);
51
+ --lmvz-semantic-color-int-on-secondary-active: var(--lmvz-global-color-neutral-white);
52
+ --lmvz-semantic-color-int-on-tertiary-hover: var(--lmvz-global-color-neutral-white);
53
+ --lmvz-semantic-color-int-on-tertiary-active: var(--lmvz-global-color-neutral-white);
54
+ --lmvz-semantic-color-surface-primary: var(--lmvz-global-color-neutral-black);
55
+ --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-900);
56
+ --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-800);
57
+ --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-white);
58
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-300);
59
+ --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
60
+ --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
61
+ --lmvz-semantic-color-status-on-selected: var(--lmvz-global-color-brand-blue-950);
62
+ --lmvz-semantic-color-status-on-success: var(--lmvz-global-color-brand-green-500);
63
+ --lmvz-semantic-color-status-on-warning: var(--lmvz-global-color-brand-yellow-800);
64
+ --lmvz-semantic-color-status-on-danger: var(--lmvz-global-color-brand-red-700);
65
+ --lmvz-semantic-color-status-neutral: var(--lmvz-global-color-grey-neutral-50);
66
+ --lmvz-semantic-color-status-selected: var(--lmvz-global-color-brand-blue-100);
67
+ --lmvz-semantic-color-status-success: var(--lmvz-global-color-brand-green-50);
68
+ --lmvz-semantic-color-status-warning: var(--lmvz-global-color-brand-yellow-50);
69
+ --lmvz-semantic-color-status-danger: var(--lmvz-global-color-brand-red-50);
70
+ --lmvz-semantic-color-border-default: var(--lmvz-global-color-grey-neutral-300);
71
+ --lmvz-semantic-color-border-hover: var(--lmvz-global-color-grey-neutral-500);
72
+ --lmvz-semantic-color-border-active: var(--lmvz-global-color-grey-neutral-400);
73
+ --lmvz-semantic-color-border-subtle: var(--lmvz-global-color-grey-neutral-800);
74
+ --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-600);
75
+ --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-white);
76
+ --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-300);
77
+ --lmvz-semantic-color-brand-hellblau: var(--lmvz-global-color-brand-blue-400);
78
+ --lmvz-semantic-color-brand-gruen: var(--lmvz-global-color-brand-green-400);
79
+ --lmvz-semantic-color-brand-gelb: var(--lmvz-global-color-brand-yellow-400);
80
+ --lmvz-semantic-color-brand-rot: var(--lmvz-global-color-brand-red-400);
81
+ --lmvz-string-font-family: var(--lmvz-global-font-family-default);
82
+ --lmvz-semantic-color-surface-input-primary: var(--lmvz-semantic-color-surface-primary);
83
+ --lmvz-semantic-color-gradient-main-1: var(--lmvz-semantic-color-int-primary);
84
+ --lmvz-semantic-color-gradient-main-2: var(--lmvz-semantic-color-int-primary);
85
+ }
package/dist/css/variables.dark.themed.css ADDED
@@ -0,0 +1,85 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ [data-theme="lmvz-dark"] {
6
+ --lmvz-semantic-shadow-l1-1-position-y: 2px;
7
+ --lmvz-semantic-shadow-l1-1-blur: 4px;
8
+ --lmvz-semantic-shadow-l2-1-position-y: 2px;
9
+ --lmvz-semantic-shadow-l2-1-blur: 12px;
10
+ --lmvz-semantic-shadow-l2-2-position-y: 4px;
11
+ --lmvz-semantic-shadow-l2-2-blur: 24px;
12
+ --lmvz-semantic-shadow-l3-1-position-y: 2px;
13
+ --lmvz-semantic-shadow-l3-1-blur: 34px;
14
+ --lmvz-semantic-shadow-l3-2-position-y: 18px;
15
+ --lmvz-semantic-shadow-l3-2-blur: 62px;
16
+ --lmvz-semantic-border-radius-round: 999px;
17
+ --lmvz-semantic-border-radius-none: 0px;
18
+ --lmvz-semantic-color-int-primary-hover-shadow: rgba(0, 0, 0, 0);
19
+ --lmvz-semantic-color-shadow-l1-default: rgba(120, 120, 128, 0.08);
20
+ --lmvz-semantic-color-shadow-l1-default-strong: rgba(120, 120, 128, 0.28);
21
+ --lmvz-semantic-color-shadow-l1-colored: rgba(175, 223, 249, 0.42);
22
+ --lmvz-semantic-color-shadow-l1-colored-strong: rgba(175, 223, 249, 0.62);
23
+ --lmvz-semantic-color-shadow-l2-default: rgba(120, 120, 128, 0.08);
24
+ --lmvz-semantic-color-shadow-l2-default-strong: rgba(120, 120, 128, 0.16);
25
+ --lmvz-semantic-color-shadow-l2-colored: rgba(175, 223, 249, 0.42);
26
+ --lmvz-semantic-color-shadow-l2-colored-strong: rgba(175, 223, 249, 0.62);
27
+ --lmvz-semantic-color-shadow-l3-default: rgba(120, 120, 128, 0.05);
28
+ --lmvz-semantic-color-shadow-l3-default-strong: rgba(120, 120, 128, 0.11);
29
+ --lmvz-semantic-color-shadow-l3-colored: rgba(175, 223, 249, 0.42);
30
+ --lmvz-semantic-color-shadow-l3-colored-strong: rgba(175, 223, 249, 0.72);
31
+ --lmvz-semantic-border-radius-xl: var(--lmvz-global-s18);
32
+ --lmvz-semantic-border-radius-lg: var(--lmvz-global-s14);
33
+ --lmvz-semantic-border-radius-md: var(--lmvz-global-s6);
34
+ --lmvz-semantic-border-radius-sm: var(--lmvz-global-s2);
35
+ --lmvz-semantic-border-width-default: var(--lmvz-global-border-width-1);
36
+ --lmvz-semantic-color-int-primary: var(--lmvz-global-color-neutral-white);
37
+ --lmvz-semantic-color-int-primary-hover: var(--lmvz-global-color-grey-neutral-100);
38
+ --lmvz-semantic-color-int-primary-active: var(--lmvz-global-color-grey-neutral-200);
39
+ --lmvz-semantic-color-int-on-primary: var(--lmvz-global-color-neutral-black);
40
+ --lmvz-semantic-color-int-secondary: var(--lmvz-global-color-grey-neutral-800);
41
+ --lmvz-semantic-color-int-secondary-hover: var(--lmvz-global-color-grey-neutral-700);
42
+ --lmvz-semantic-color-int-secondary-active: var(--lmvz-global-color-grey-neutral-600);
43
+ --lmvz-semantic-color-int-on-secondary: var(--lmvz-global-color-neutral-white);
44
+ --lmvz-semantic-color-int-tertiary: var(--lmvz-global-color-neutral-black);
45
+ --lmvz-semantic-color-int-tertiary-hover: var(--lmvz-global-color-grey-neutral-800);
46
+ --lmvz-semantic-color-int-tertiary-active: var(--lmvz-global-color-grey-neutral-700);
47
+ --lmvz-semantic-color-int-on-tertiary: var(--lmvz-global-color-grey-neutral-200);
48
+ --lmvz-semantic-color-int-on-primary-hover: var(--lmvz-global-color-neutral-black);
49
+ --lmvz-semantic-color-int-on-primary-active: var(--lmvz-global-color-neutral-black);
50
+ --lmvz-semantic-color-int-on-secondary-hover: var(--lmvz-global-color-neutral-white);
51
+ --lmvz-semantic-color-int-on-secondary-active: var(--lmvz-global-color-neutral-white);
52
+ --lmvz-semantic-color-int-on-tertiary-hover: var(--lmvz-global-color-neutral-white);
53
+ --lmvz-semantic-color-int-on-tertiary-active: var(--lmvz-global-color-neutral-white);
54
+ --lmvz-semantic-color-surface-primary: var(--lmvz-global-color-neutral-black);
55
+ --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-900);
56
+ --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-800);
57
+ --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-white);
58
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-300);
59
+ --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
60
+ --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
61
+ --lmvz-semantic-color-status-on-selected: var(--lmvz-global-color-brand-blue-950);
62
+ --lmvz-semantic-color-status-on-success: var(--lmvz-global-color-brand-green-500);
63
+ --lmvz-semantic-color-status-on-warning: var(--lmvz-global-color-brand-yellow-800);
64
+ --lmvz-semantic-color-status-on-danger: var(--lmvz-global-color-brand-red-700);
65
+ --lmvz-semantic-color-status-neutral: var(--lmvz-global-color-grey-neutral-50);
66
+ --lmvz-semantic-color-status-selected: var(--lmvz-global-color-brand-blue-100);
67
+ --lmvz-semantic-color-status-success: var(--lmvz-global-color-brand-green-50);
68
+ --lmvz-semantic-color-status-warning: var(--lmvz-global-color-brand-yellow-50);
69
+ --lmvz-semantic-color-status-danger: var(--lmvz-global-color-brand-red-50);
70
+ --lmvz-semantic-color-border-default: var(--lmvz-global-color-grey-neutral-300);
71
+ --lmvz-semantic-color-border-hover: var(--lmvz-global-color-grey-neutral-500);
72
+ --lmvz-semantic-color-border-active: var(--lmvz-global-color-grey-neutral-400);
73
+ --lmvz-semantic-color-border-subtle: var(--lmvz-global-color-grey-neutral-800);
74
+ --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-600);
75
+ --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-white);
76
+ --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-300);
77
+ --lmvz-semantic-color-brand-hellblau: var(--lmvz-global-color-brand-blue-400);
78
+ --lmvz-semantic-color-brand-gruen: var(--lmvz-global-color-brand-green-400);
79
+ --lmvz-semantic-color-brand-gelb: var(--lmvz-global-color-brand-yellow-400);
80
+ --lmvz-semantic-color-brand-rot: var(--lmvz-global-color-brand-red-400);
81
+ --lmvz-string-font-family: var(--lmvz-global-font-family-default);
82
+ --lmvz-semantic-color-surface-input-primary: var(--lmvz-semantic-color-surface-primary);
83
+ --lmvz-semantic-color-gradient-main-1: var(--lmvz-semantic-color-int-primary);
84
+ --lmvz-semantic-color-gradient-main-2: var(--lmvz-semantic-color-int-primary);
85
+ }
package/dist/css/variables.light.global.css ADDED
@@ -0,0 +1,87 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --lmvz-semantic-shadow-l1-1-position-y: 2px;
7
+ --lmvz-semantic-shadow-l1-1-blur: 4px;
8
+ --lmvz-semantic-shadow-l2-1-position-y: 2px;
9
+ --lmvz-semantic-shadow-l2-1-blur: 12px;
10
+ --lmvz-semantic-shadow-l2-2-position-y: 4px;
11
+ --lmvz-semantic-shadow-l2-2-blur: 24px;
12
+ --lmvz-semantic-shadow-l3-1-position-y: 2px;
13
+ --lmvz-semantic-shadow-l3-1-blur: 34px;
14
+ --lmvz-semantic-shadow-l3-2-position-y: 18px;
15
+ --lmvz-semantic-shadow-l3-2-blur: 62px;
16
+ --lmvz-semantic-border-radius-round: 999px;
17
+ --lmvz-semantic-border-radius-none: 0px;
18
+ --lmvz-semantic-color-int-primary-hover-shadow: rgba(0, 0, 0, 0);
19
+ --lmvz-semantic-color-shadow-l1-default: rgba(120, 120, 128, 0.08);
20
+ --lmvz-semantic-color-shadow-l1-default-strong: rgba(120, 120, 128, 0.28);
21
+ --lmvz-semantic-color-shadow-l1-colored: rgba(175, 223, 249, 0.42);
22
+ --lmvz-semantic-color-shadow-l1-colored-strong: rgba(175, 223, 249, 0.62);
23
+ --lmvz-semantic-color-shadow-l2-default: rgba(120, 120, 128, 0.08);
24
+ --lmvz-semantic-color-shadow-l2-default-strong: rgba(120, 120, 128, 0.16);
25
+ --lmvz-semantic-color-shadow-l2-colored: rgba(175, 223, 249, 0.42);
26
+ --lmvz-semantic-color-shadow-l2-colored-strong: rgba(175, 223, 249, 0.62);
27
+ --lmvz-semantic-color-shadow-l3-default: rgba(120, 120, 128, 0.05);
28
+ --lmvz-semantic-color-shadow-l3-default-strong: rgba(120, 120, 128, 0.11);
29
+ --lmvz-semantic-color-shadow-l3-colored: rgba(175, 223, 249, 0.42);
30
+ --lmvz-semantic-color-shadow-l3-colored-strong: rgba(175, 223, 249, 0.72);
31
+ --lmvz-semantic-border-radius-xl: var(--lmvz-global-s18);
32
+ --lmvz-semantic-border-radius-lg: var(--lmvz-global-s14);
33
+ --lmvz-semantic-border-radius-md: var(--lmvz-global-s6);
34
+ --lmvz-semantic-border-radius-sm: var(--lmvz-global-s2);
35
+ --lmvz-semantic-border-width-default: var(--lmvz-global-border-width-1);
36
+ --lmvz-semantic-color-int-primary: var(--lmvz-global-color-neutral-black);
37
+ --lmvz-semantic-color-int-primary-hover: var(--lmvz-global-color-grey-neutral-900);
38
+ --lmvz-semantic-color-int-primary-active: var(--lmvz-global-color-grey-neutral-800);
39
+ --lmvz-semantic-color-int-on-primary: var(--lmvz-global-color-neutral-white);
40
+ --lmvz-semantic-color-int-secondary: var(--lmvz-global-color-grey-neutral-200);
41
+ --lmvz-semantic-color-int-secondary-hover: var(--lmvz-global-color-grey-neutral-300);
42
+ --lmvz-semantic-color-int-secondary-active: var(--lmvz-global-color-grey-neutral-400);
43
+ --lmvz-semantic-color-int-on-secondary: var(--lmvz-global-color-neutral-black);
44
+ --lmvz-semantic-color-int-tertiary: var(--lmvz-global-color-neutral-white);
45
+ --lmvz-semantic-color-int-tertiary-hover: var(--lmvz-global-color-grey-neutral-200);
46
+ --lmvz-semantic-color-int-tertiary-active: var(--lmvz-global-color-grey-neutral-300);
47
+ --lmvz-semantic-color-int-on-tertiary: var(--lmvz-global-color-grey-neutral-800);
48
+ --lmvz-semantic-color-int-on-primary-hover: var(--lmvz-global-color-neutral-white);
49
+ --lmvz-semantic-color-int-on-primary-active: var(--lmvz-global-color-neutral-white);
50
+ --lmvz-semantic-color-int-on-secondary-hover: var(--lmvz-global-color-neutral-black);
51
+ --lmvz-semantic-color-int-on-secondary-active: var(--lmvz-global-color-neutral-black);
52
+ --lmvz-semantic-color-int-on-tertiary-hover: var(--lmvz-global-color-neutral-black);
53
+ --lmvz-semantic-color-int-on-tertiary-active: var(--lmvz-global-color-neutral-black);
54
+ --lmvz-semantic-color-surface-primary: var(--lmvz-global-color-neutral-white);
55
+ --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-100);
56
+ --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-200);
57
+ --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-black);
58
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-700);
59
+ --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
60
+ --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
61
+ --lmvz-semantic-color-status-on-selected: var(--lmvz-global-color-brand-blue-950);
62
+ --lmvz-semantic-color-status-on-success: var(--lmvz-global-color-brand-green-500);
63
+ --lmvz-semantic-color-status-on-warning: var(--lmvz-global-color-brand-yellow-800);
64
+ --lmvz-semantic-color-status-on-danger: var(--lmvz-global-color-brand-red-700);
65
+ --lmvz-semantic-color-status-neutral: var(--lmvz-global-color-grey-neutral-50);
66
+ --lmvz-semantic-color-status-selected: var(--lmvz-global-color-brand-blue-100);
67
+ --lmvz-semantic-color-status-success: var(--lmvz-global-color-brand-green-50);
68
+ --lmvz-semantic-color-status-warning: var(--lmvz-global-color-brand-yellow-50);
69
+ --lmvz-semantic-color-status-danger: var(--lmvz-global-color-brand-red-50);
70
+ --lmvz-semantic-color-border-default: var(--lmvz-global-color-grey-neutral-300);
71
+ --lmvz-semantic-color-border-hover: var(--lmvz-global-color-grey-neutral-500);
72
+ --lmvz-semantic-color-border-active: var(--lmvz-global-color-grey-neutral-400);
73
+ --lmvz-semantic-color-border-subtle: var(--lmvz-global-color-grey-neutral-200);
74
+ --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-400);
75
+ --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-black);
76
+ --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-700);
77
+ --lmvz-semantic-color-brand-hellblau: var(--lmvz-global-color-brand-blue-400);
78
+ --lmvz-semantic-color-brand-gruen: var(--lmvz-global-color-brand-green-400);
79
+ --lmvz-semantic-color-brand-gelb: var(--lmvz-global-color-brand-yellow-400);
80
+ --lmvz-semantic-color-brand-rot: var(--lmvz-global-color-brand-red-400);
81
+ --lmvz-string-font-family: var(--lmvz-global-font-family-default);
82
+ --lmvz-sem-sem-border-radius-medium: var(--lmvz-global-border-radius-16);
83
+ --lmvz-sem-sem-border-radius-small: var(--lmvz-global-border-radius-8);
84
+ --lmvz-semantic-color-surface-input-primary: var(--lmvz-semantic-color-surface-primary);
85
+ --lmvz-semantic-color-gradient-main-1: var(--lmvz-semantic-color-status-on-selected);
86
+ --lmvz-semantic-color-gradient-main-2: var(--lmvz-semantic-color-status-on-selected);
87
+ }
package/dist/css/variables.light.themed.css ADDED
@@ -0,0 +1,87 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ [data-theme="lmvz-light"] {
6
+ --lmvz-semantic-shadow-l1-1-position-y: 2px;
7
+ --lmvz-semantic-shadow-l1-1-blur: 4px;
8
+ --lmvz-semantic-shadow-l2-1-position-y: 2px;
9
+ --lmvz-semantic-shadow-l2-1-blur: 12px;
10
+ --lmvz-semantic-shadow-l2-2-position-y: 4px;
11
+ --lmvz-semantic-shadow-l2-2-blur: 24px;
12
+ --lmvz-semantic-shadow-l3-1-position-y: 2px;
13
+ --lmvz-semantic-shadow-l3-1-blur: 34px;
14
+ --lmvz-semantic-shadow-l3-2-position-y: 18px;
15
+ --lmvz-semantic-shadow-l3-2-blur: 62px;
16
+ --lmvz-semantic-border-radius-round: 999px;
17
+ --lmvz-semantic-border-radius-none: 0px;
18
+ --lmvz-semantic-color-int-primary-hover-shadow: rgba(0, 0, 0, 0);
19
+ --lmvz-semantic-color-shadow-l1-default: rgba(120, 120, 128, 0.08);
20
+ --lmvz-semantic-color-shadow-l1-default-strong: rgba(120, 120, 128, 0.28);
21
+ --lmvz-semantic-color-shadow-l1-colored: rgba(175, 223, 249, 0.42);
22
+ --lmvz-semantic-color-shadow-l1-colored-strong: rgba(175, 223, 249, 0.62);
23
+ --lmvz-semantic-color-shadow-l2-default: rgba(120, 120, 128, 0.08);
24
+ --lmvz-semantic-color-shadow-l2-default-strong: rgba(120, 120, 128, 0.16);
25
+ --lmvz-semantic-color-shadow-l2-colored: rgba(175, 223, 249, 0.42);
26
+ --lmvz-semantic-color-shadow-l2-colored-strong: rgba(175, 223, 249, 0.62);
27
+ --lmvz-semantic-color-shadow-l3-default: rgba(120, 120, 128, 0.05);
28
+ --lmvz-semantic-color-shadow-l3-default-strong: rgba(120, 120, 128, 0.11);
29
+ --lmvz-semantic-color-shadow-l3-colored: rgba(175, 223, 249, 0.42);
30
+ --lmvz-semantic-color-shadow-l3-colored-strong: rgba(175, 223, 249, 0.72);
31
+ --lmvz-semantic-border-radius-xl: var(--lmvz-global-s18);
32
+ --lmvz-semantic-border-radius-lg: var(--lmvz-global-s14);
33
+ --lmvz-semantic-border-radius-md: var(--lmvz-global-s6);
34
+ --lmvz-semantic-border-radius-sm: var(--lmvz-global-s2);
35
+ --lmvz-semantic-border-width-default: var(--lmvz-global-border-width-1);
36
+ --lmvz-semantic-color-int-primary: var(--lmvz-global-color-neutral-black);
37
+ --lmvz-semantic-color-int-primary-hover: var(--lmvz-global-color-grey-neutral-900);
38
+ --lmvz-semantic-color-int-primary-active: var(--lmvz-global-color-grey-neutral-800);
39
+ --lmvz-semantic-color-int-on-primary: var(--lmvz-global-color-neutral-white);
40
+ --lmvz-semantic-color-int-secondary: var(--lmvz-global-color-grey-neutral-200);
41
+ --lmvz-semantic-color-int-secondary-hover: var(--lmvz-global-color-grey-neutral-300);
42
+ --lmvz-semantic-color-int-secondary-active: var(--lmvz-global-color-grey-neutral-400);
43
+ --lmvz-semantic-color-int-on-secondary: var(--lmvz-global-color-neutral-black);
44
+ --lmvz-semantic-color-int-tertiary: var(--lmvz-global-color-neutral-white);
45
+ --lmvz-semantic-color-int-tertiary-hover: var(--lmvz-global-color-grey-neutral-200);
46
+ --lmvz-semantic-color-int-tertiary-active: var(--lmvz-global-color-grey-neutral-300);
47
+ --lmvz-semantic-color-int-on-tertiary: var(--lmvz-global-color-grey-neutral-800);
48
+ --lmvz-semantic-color-int-on-primary-hover: var(--lmvz-global-color-neutral-white);
49
+ --lmvz-semantic-color-int-on-primary-active: var(--lmvz-global-color-neutral-white);
50
+ --lmvz-semantic-color-int-on-secondary-hover: var(--lmvz-global-color-neutral-black);
51
+ --lmvz-semantic-color-int-on-secondary-active: var(--lmvz-global-color-neutral-black);
52
+ --lmvz-semantic-color-int-on-tertiary-hover: var(--lmvz-global-color-neutral-black);
53
+ --lmvz-semantic-color-int-on-tertiary-active: var(--lmvz-global-color-neutral-black);
54
+ --lmvz-semantic-color-surface-primary: var(--lmvz-global-color-neutral-white);
55
+ --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-100);
56
+ --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-200);
57
+ --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-black);
58
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-700);
59
+ --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
60
+ --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
61
+ --lmvz-semantic-color-status-on-selected: var(--lmvz-global-color-brand-blue-950);
62
+ --lmvz-semantic-color-status-on-success: var(--lmvz-global-color-brand-green-500);
63
+ --lmvz-semantic-color-status-on-warning: var(--lmvz-global-color-brand-yellow-800);
64
+ --lmvz-semantic-color-status-on-danger: var(--lmvz-global-color-brand-red-700);
65
+ --lmvz-semantic-color-status-neutral: var(--lmvz-global-color-grey-neutral-50);
66
+ --lmvz-semantic-color-status-selected: var(--lmvz-global-color-brand-blue-100);
67
+ --lmvz-semantic-color-status-success: var(--lmvz-global-color-brand-green-50);
68
+ --lmvz-semantic-color-status-warning: var(--lmvz-global-color-brand-yellow-50);
69
+ --lmvz-semantic-color-status-danger: var(--lmvz-global-color-brand-red-50);
70
+ --lmvz-semantic-color-border-default: var(--lmvz-global-color-grey-neutral-300);
71
+ --lmvz-semantic-color-border-hover: var(--lmvz-global-color-grey-neutral-500);
72
+ --lmvz-semantic-color-border-active: var(--lmvz-global-color-grey-neutral-400);
73
+ --lmvz-semantic-color-border-subtle: var(--lmvz-global-color-grey-neutral-200);
74
+ --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-400);
75
+ --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-black);
76
+ --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-700);
77
+ --lmvz-semantic-color-brand-hellblau: var(--lmvz-global-color-brand-blue-400);
78
+ --lmvz-semantic-color-brand-gruen: var(--lmvz-global-color-brand-green-400);
79
+ --lmvz-semantic-color-brand-gelb: var(--lmvz-global-color-brand-yellow-400);
80
+ --lmvz-semantic-color-brand-rot: var(--lmvz-global-color-brand-red-400);
81
+ --lmvz-string-font-family: var(--lmvz-global-font-family-default);
82
+ --lmvz-sem-sem-border-radius-medium: var(--lmvz-global-border-radius-16);
83
+ --lmvz-sem-sem-border-radius-small: var(--lmvz-global-border-radius-8);
84
+ --lmvz-semantic-color-surface-input-primary: var(--lmvz-semantic-color-surface-primary);
85
+ --lmvz-semantic-color-gradient-main-1: var(--lmvz-semantic-color-status-on-selected);
86
+ --lmvz-semantic-color-gradient-main-2: var(--lmvz-semantic-color-status-on-selected);
87
+ }
package/package.json ADDED
@@ -0,0 +1,62 @@
1
+ {
2
+ "name": "@lmvz-ds/design-tokens",
3
+ "private": false,
4
+ "type": "module",
5
+ "version": "0.11.4",
6
+ "author": "Patrick Nemenz <patrick.nemenz@adesso.at>",
7
+ "license": "UNLICENSED",
8
+ "publishConfig": {
9
+ "access": "public",
10
+ "registry": "https://registry.npmjs.org/"
11
+ },
12
+ "repository": {
13
+ "type": "git",
14
+ "url": "https://bitbucket.org/lmvz/lmvz-ds"
15
+ },
16
+ "volta": {
17
+ "extends": "../../package.json"
18
+ },
19
+ "files": [
20
+ "dist/",
21
+ "package.json"
22
+ ],
23
+ "exports": {
24
+ ".": "./dist/css/variables.base.css",
25
+ "./*": "./dist/*",
26
+ "./package.json": "./package.json"
27
+ },
28
+ "scripts": {
29
+ "clean": "rimraf ./dist",
30
+ "start": "tsx watch --include './tokens/*.**' ./scripts/build-tokens.ts",
31
+ "build": "tsx ./scripts/build-tokens.ts && npm run lint",
32
+ "lint": "stylelint './dist/**/*.css' --config ./stylelint.config.mjs || true",
33
+ "update": "npm run update:style-dictionary",
34
+ "update:style-dictionary": "rm -rf tokens && tsx ./scripts/export-style-dictionary.ts && bash ./scripts/cleanup-base-tokens.sh",
35
+ "supernova:describe": "tsx ../shared/scripts/supernova-describe.ts"
36
+ },
37
+ "nx": {
38
+ "targets": {
39
+ "update": {
40
+ "dependsOn": []
41
+ },
42
+ "update:style-dictionary": {
43
+ "dependsOn": []
44
+ }
45
+ }
46
+ },
47
+ "devDependencies": {
48
+ "@lmvz-ds/exporter-style-dictionary": "^2.5.1",
49
+ "@lmvz-ds/shared": "^0.11.4",
50
+ "@supernovaio/cli": "2.0.27",
51
+ "concurrently": "^9.2.1",
52
+ "json5": "^2.2.3",
53
+ "lodash": "^4.17.21",
54
+ "rimraf": "^4.4.1",
55
+ "style-dictionary": "^5.1.3",
56
+ "stylelint": "^17.0.0",
57
+ "stylelint-config-standard": "^40.0.0",
58
+ "stylelint-value-no-unknown-custom-properties": "^6.1.1",
59
+ "tsx": "^4.21.0"
60
+ },
61
+ "gitHead": "e59dc5d5385de2f565fc55bac83ca8710eefc40f"
62
+ }