@itcase/tokens-am 1.0.30 → 1.1.1

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 (3) hide show
  1. package/dist/css/styles/main.css +239 -204
  2. package/package.json +2 -2
  3. package/dist/fonts/fonts.css +0 -77
package/dist/css/styles/main.css CHANGED
@@ -1,236 +1,276 @@
1
- html:is(.am):root {
2
- --color-accent-primary: hsla(92, 49%, 47%, 1);
3
- --color-accent-primary-hover: hsla(92, 70%, 47%, 1);
4
- --color-accent-secondary: hsla(92, 29%, 62%, 1);
5
- --color-accent-secondary-hover: hsla(90, 28%, 88%, 1);
6
- --color-accent-tertiary: hsla(93, 53%, 93%, 1);
7
- --color-accent-active: hsla(92, 46%, 41%, 1);
8
- --color-accent-disabled: hsla(93, 45%, 80%, 1);
9
-
10
- --color-accent-text-primary: hsla(0, 0%, 100%, 1);
11
- --color-accent-text-secondary: hsla(92, 49%, 47%, 1);
12
- --color-accent-text-disable: hsla(92, 49%, 47%, 1);
13
-
14
- --color-accent-item-primary: hsla(0, 0%, 100%, 1);
15
- --color-accent-item-secondary: hsla(92, 49%, 47%, 1);
16
- --color-accent-item-disabled: hsla(92, 49%, 47%, 1);
17
-
18
- --color-accent-border-primary: hsla(0, 0%, 100%, 1);
19
- --color-accent-border-secondary: hsla(92, 50%, 42%, 1);
20
- --color-accent-border-tertiary: hsla(94, 53%, 68%, 1);
21
- --color-accent-border-hover: hsla(92, 70%, 47%, 1);
22
- --color-accent-border-quaternary: hsla(92, 37%, 35%, 1);
23
- --color-accent-border-disabled: hsla(93, 45%, 80%, 1);
24
-
25
- --color-primary-primary: hsla(36, 95%, 45%, 1);
26
- --color-primary-primary-hover: hsla(36, 94%, 60%, 1);
27
- --color-primary-secondary: hsla(36, 95%, 45%, 1);
28
- --color-primary-secondary-hover: hsla(36, 88%, 87%, 1);
29
- --color-primary-disabled: hsla(32, 13%, 81%, 1);
30
- --color-primary-active: hsla(36, 95%, 40%, 1);
31
-
32
- --color-primary-text-primary: hsla(0, 0%, 100%, 1);
33
- --color-primary-text-secondary: hsla(36, 95%, 45%, 1);
34
- --color-primary-text-disabled: hsla(36, 60%, 65%, 1);
35
-
36
- --color-primary-item-primary: hsla(0, 0%, 100%, 1);
37
- --color-primary-item-secondary: hsla(36, 95%, 45%, 1);
38
- --color-primary-item-disabled: hsla(36, 60%, 65%, 1);
39
-
40
- --color-primary-border-primary: hsla(0, 0%, 100%, 1);
41
- --color-primary-border-secondary: hsla(36, 95%, 45%, 1);
42
- --color-primary-border-tertiary: hsla(36, 96%, 70%, 1);
43
- --color-primary-border-quaternary: hsla(36, 95%, 36%, 1);
44
- --color-primary-border-hover: hsla(36, 94%, 60%, 1);
45
- --color-primary-border-disabled: hsla(32, 13%, 81%, 1);
46
-
47
- --color-secondary-primary: hsla(349, 96%, 44%, 1);
48
- --color-secondary-primary-hover: hsla(349, 100%, 51%, 1);
49
- --color-secondary-secondary: hsla(349, 70%, 74%, 1);
50
- --color-secondary-secondary-hover: hsla(348, 68%, 85%, 1);
51
- --color-secondary-disabled: hsla(348, 59%, 90%, 1);
52
- --color-secondary-active: hsla(349, 95%, 34%, 1);
53
-
54
- --color-secondary-item-primary: hsla(0, 0%, 100%, 1);
55
- --color-secondary-item-secondary: hsla(349, 96%, 44%, 1);
56
- --color-secondary-item-disabled: hsla(348, 53%, 68%, 1);
57
-
58
- --color-secondary-text-primary: hsla(0, 0%, 100%, 1);
59
- --color-secondary-text-secondary: hsla(349, 96%, 44%, 1);
60
- --color-secondary-text-disabled: hsla(348, 53%, 68%, 1);
61
-
62
- --color-secondary-border-primary: hsla(0, 0%, 100%, 1);
63
- --color-secondary-border-secondary: hsla(349, 90%, 54%, 1);
64
- --color-secondary-border-tertiary: hsla(349, 94%, 72%, 1);
65
- --color-secondary-border-quaternary: hsla(349, 87%, 28%, 1);
66
- --color-secondary-border-hover: hsla(349, 100%, 51%, 1);
67
- --color-secondary-border-disabled: hsla(348, 59%, 90%, 1);
68
-
69
- --color-surface-primary: hsla(0, 0%, 100%, 1);
70
- --color-surface-primary-hover: hsla(0, 0%, 82%, 1);
71
- --color-surface-secondary: hsla(220, 14%, 96%, 1);
72
- --color-surface-secondary-hover: hsla(0, 0%, 78%, 1);
73
- --color-surface-tertiary: hsla(0, 0%, 85%, 1);
74
- --color-surface-tertiary-hover: hsla(0, 0%, 73%, 1);
75
- --color-surface-quaternary: hsla(0, 0%, 45%, 1);
76
- --color-surface-quaternary-50: hsla(0, 0%, 45%, 0.5);
77
- --color-surface-disabled: hsla(0, 0%, 79%, 1);
78
- --color-surface-active: hsla(0, 0%, 64%, 1);
79
-
80
- --color-surface-text-primary: hsla(0, 0%, 9%, 1);
81
- --color-surface-text-secondary: hsla(0, 0%, 46%, 1);
82
- --color-surface-text-tertiary: hsla(213, 5%, 45%, 1);
83
- --color-surface-text-quaternary: hsla(0, 0%, 45%, 1);
84
- --color-surface-text-disabled: hsla(0, 0%, 47%, 1);
85
- --color-surface-text-accent: hsla(92, 49%, 47%, 1);
86
- --color-surface-text-accent-hover: hsla(92, 70%, 47%, 1);
87
- --color-surface-text-active: hsla(40, 75%, 58%, 1);
88
- --color-surface-text-inverse: hsla(0, 0%, 100%, 1);
89
-
90
- --color-surface-item-primary: hsla(36, 71%, 13%, 1);
91
- --color-surface-item-secondary: hsla(0, 0%, 93%, 1);
92
- --color-surface-item-tertiary: hsla(0, 0%, 85%, 1);
93
- --color-surface-item-quaternary: hsla(0, 0%, 45%, 1);
94
- --color-surface-item-disabled: hsla(0, 0%, 85%, 1);
95
- --color-surface-item-inverse: hsla(0, 0%, 100%, 1);
96
- --color-surface-item-accent: hsla(92, 49%, 47%, 1);
97
-
98
- --color-surface-border-primary: hsla(36, 71%, 13%, 1);
99
- --color-surface-border-secondary: hsla(0, 0%, 93%, 1);
100
- --color-surface-border-tertiary: hsla(0, 0%, 85%, 1);
101
- --color-surface-border-quaternary: hsla(0, 0%, 45%, 1);
102
- --color-surface-border-hover: hsla(0, 0%, 31%, 1);
103
- --color-surface-border-disabled: hsla(0, 0%, 61%, 1);
104
- --color-surface-border-accent: hsla(92, 49%, 47%, 1);
105
- --color-surface-border-active: hsla(40, 75%, 58%, 1);
106
-
107
- --color-error-primary: hsla(0, 100%, 44%, 1);
108
- --color-error-tertiary: hsla(0, 100%, 92%, 1);
109
-
110
- --color-error-text-primary: hsla(0, 100%, 44%, 1);
111
- --color-error-text-secondary: hsla(0, 0%, 100%, 1);
112
-
113
- --color-error-border-primary: hsla(0, 100%, 44%, 1);
114
- --color-error-border-secondary: hsla(0, 0%, 100%, 1);
115
-
116
- --color-error-item-primary: hsla(0, 100%, 44%, 1);
117
- --color-error-item-secondary: hsla(0, 0%, 100%, 1);
118
-
119
- --color-success-primary: hsla(92, 56%, 38%, 1);
120
-
121
- --color-success-text-primary: hsla(92, 56%, 38%, 1);
122
- --color-success-text-secondary: hsla(0, 0%, 100%, 1);
123
-
124
- --color-success-item-primary: hsla(92, 56%, 38%, 1);
125
- --color-success-item-secondary: hsla(0, 0%, 100%, 1);
126
-
127
- --color-success-border-primary: hsla(92, 56%, 38%, 1);
128
- --color-success-border-secondary: hsla(0, 0%, 100%, 1);
129
-
130
- --color-warning-text-primary: hsla(43, 68%, 50%, 1);
131
- --color-warning-text-secondary: hsla(0, 0%, 100%, 1);
132
-
133
- --color-warning-primary: hsla(43, 68%, 50%, 1);
134
-
135
- --color-warning-border-primary: hsla(43, 68%, 50%, 1);
136
-
137
- --color-warning-item-primary: hsla(43, 68%, 50%, 1);
138
-
139
- --color-info-primary: hsla(211, 83%, 47%, 1);
140
- --color-info-text-primary: hsla(0, 0%, 100%, 1);
141
-
142
- --color-danger-primary: hsla(349, 96%, 44%, 1);
143
- --color-danger-text-primary: hsla(0, 0%, 100%, 1);
144
-
145
- --color-disabled-primary: hsla(0, 0%, 93%, 1);
146
- --color-disabled-text-primary: hsla(0, 0%, 47%, 1);
147
- --color-disabled-item-primary: hsla(0, 0%, 47%, 1);
148
- --color-disabled-border-primary: hsla(0, 0%, 47%, 1);
1
+ :root.am {
2
+ --color-accent-primary: hsl(92, 49%, 47%, 1);
3
+ --color-accent-primary-hover: hsl(92, 70%, 47%, 1);
4
+ --color-accent-secondary: hsl(92, 29%, 62%, 1);
5
+ --color-accent-secondary-hover: hsl(90, 28%, 88%, 1);
6
+ --color-accent-tertiary: hsl(93, 53%, 93%, 1);
7
+ --color-accent-active: hsl(92, 46%, 41%, 1);
8
+ --color-accent-disabled: hsl(93, 45%, 80%, 1);
9
+
10
+ --color-accent-text-primary: hsl(0, 0%, 100%, 1);
11
+ --color-accent-text-secondary: hsl(92, 49%, 47%, 1);
12
+ --color-accent-text-disable: hsl(92, 49%, 47%, 1);
13
+
14
+ --color-accent-item-primary: hsl(0, 0%, 100%, 1);
15
+ --color-accent-item-secondary: hsl(92, 49%, 47%, 1);
16
+ --color-accent-item-disabled: hsl(92, 49%, 47%, 1);
17
+
18
+ --color-accent-border-primary: hsl(0, 0%, 100%, 1);
19
+ --color-accent-border-secondary: hsl(92, 50%, 42%, 1);
20
+ --color-accent-border-tertiary: hsl(94, 53%, 68%, 1);
21
+ --color-accent-border-hover: hsl(92, 70%, 47%, 1);
22
+ --color-accent-border-quaternary: hsl(92, 37%, 35%, 1);
23
+ --color-accent-border-disabled: hsl(93, 45%, 80%, 1);
24
+
25
+ --color-primary-primary: hsl(36, 95%, 45%, 1);
26
+ --color-primary-primary-hover: hsl(36, 94%, 60%, 1);
27
+ --color-primary-secondary: hsl(36, 95%, 45%, 1);
28
+ --color-primary-secondary-hover: hsl(36, 88%, 87%, 1);
29
+ --color-primary-disabled: hsl(32, 13%, 81%, 1);
30
+ --color-primary-active: hsl(36, 95%, 40%, 1);
31
+
32
+ --color-primary-text-primary: hsl(0, 0%, 100%, 1);
33
+ --color-primary-text-secondary: hsl(36, 95%, 45%, 1);
34
+ --color-primary-text-disabled: hsl(36, 60%, 65%, 1);
35
+
36
+ --color-primary-item-primary: hsl(0, 0%, 100%, 1);
37
+ --color-primary-item-secondary: hsl(36, 95%, 45%, 1);
38
+ --color-primary-item-disabled: hsl(36, 60%, 65%, 1);
39
+
40
+ --color-primary-border-primary: hsl(0, 0%, 100%, 1);
41
+ --color-primary-border-secondary: hsl(36, 95%, 45%, 1);
42
+ --color-primary-border-tertiary: hsl(36, 96%, 70%, 1);
43
+ --color-primary-border-quaternary: hsl(36, 95%, 36%, 1);
44
+ --color-primary-border-hover: hsl(36, 94%, 60%, 1);
45
+ --color-primary-border-disabled: hsl(32, 13%, 81%, 1);
46
+
47
+ --color-secondary-primary: hsl(349, 96%, 44%, 1);
48
+ --color-secondary-primary-hover: hsl(349, 100%, 51%, 1);
49
+ --color-secondary-secondary: hsl(349, 70%, 74%, 1);
50
+ --color-secondary-secondary-hover: hsl(348, 68%, 85%, 1);
51
+ --color-secondary-disabled: hsl(348, 59%, 90%, 1);
52
+ --color-secondary-active: hsl(349, 95%, 34%, 1);
53
+
54
+ --color-secondary-item-primary: hsl(0, 0%, 100%, 1);
55
+ --color-secondary-item-secondary: hsl(349, 96%, 44%, 1);
56
+ --color-secondary-item-disabled: hsl(348, 53%, 68%, 1);
57
+
58
+ --color-secondary-text-primary: hsl(0, 0%, 100%, 1);
59
+ --color-secondary-text-secondary: hsl(349, 96%, 44%, 1);
60
+ --color-secondary-text-disabled: hsl(348, 53%, 68%, 1);
61
+
62
+ --color-secondary-border-primary: hsl(0, 0%, 100%, 1);
63
+ --color-secondary-border-secondary: hsl(349, 90%, 54%, 1);
64
+ --color-secondary-border-tertiary: hsl(349, 94%, 72%, 1);
65
+ --color-secondary-border-quaternary: hsl(349, 87%, 28%, 1);
66
+ --color-secondary-border-hover: hsl(349, 100%, 51%, 1);
67
+ --color-secondary-border-disabled: hsl(348, 59%, 90%, 1);
68
+
69
+ --color-surface-primary: hsl(0, 0%, 100%, 1);
70
+ --color-surface-primary-hover: hsl(0, 0%, 82%, 1);
71
+ --color-surface-secondary: hsl(220, 14%, 96%, 1);
72
+ --color-surface-secondary-hover: hsl(0, 0%, 78%, 1);
73
+ --color-surface-tertiary: hsl(0, 0%, 85%, 1);
74
+ --color-surface-tertiary-hover: hsl(0, 0%, 73%, 1);
75
+ --color-surface-quaternary: hsl(0, 0%, 45%, 1);
76
+ --color-surface-quaternary-50: hsl(0, 0%, 45%, 0.5);
77
+ --color-surface-disabled: hsl(0, 0%, 79%, 1);
78
+ --color-surface-active: hsl(0, 0%, 64%, 1);
79
+
80
+ --color-surface-text-primary: hsl(0, 0%, 9%, 1);
81
+ --color-surface-text-secondary: hsl(0, 0%, 46%, 1);
82
+ --color-surface-text-tertiary: hsl(213, 5%, 45%, 1);
83
+ --color-surface-text-quaternary: hsl(0, 0%, 45%, 1);
84
+ --color-surface-text-disabled: hsl(0, 0%, 47%, 1);
85
+ --color-surface-text-accent: hsl(92, 49%, 47%, 1);
86
+ --color-surface-text-accent-hover: hsl(92, 70%, 47%, 1);
87
+ --color-surface-text-active: hsl(40, 75%, 58%, 1);
88
+ --color-surface-text-inverse: hsl(0, 0%, 100%, 1);
89
+
90
+ --color-surface-item-primary: hsl(36, 71%, 13%, 1);
91
+ --color-surface-item-secondary: hsl(0, 0%, 93%, 1);
92
+ --color-surface-item-tertiary: hsl(0, 0%, 85%, 1);
93
+ --color-surface-item-quaternary: hsl(0, 0%, 45%, 1);
94
+ --color-surface-item-disabled: hsl(0, 0%, 85%, 1);
95
+ --color-surface-item-inverse: hsl(0, 0%, 100%, 1);
96
+ --color-surface-item-accent: hsl(92, 49%, 47%, 1);
97
+
98
+ --color-surface-border-primary: hsl(36, 71%, 13%, 1);
99
+ --color-surface-border-secondary: hsl(0, 0%, 93%, 1);
100
+ --color-surface-border-tertiary: hsl(0, 0%, 85%, 1);
101
+ --color-surface-border-quaternary: hsl(0, 0%, 45%, 1);
102
+ --color-surface-border-hover: hsl(0, 0%, 31%, 1);
103
+ --color-surface-border-disabled: hsl(0, 0%, 61%, 1);
104
+ --color-surface-border-accent: hsl(92, 49%, 47%, 1);
105
+ --color-surface-border-active: hsl(40, 75%, 58%, 1);
106
+
107
+ --color-error-primary: hsl(0, 100%, 44%, 1);
108
+ --color-error-tertiary: hsl(0, 100%, 92%, 1);
109
+
110
+ --color-error-text-primary: hsl(0, 100%, 44%, 1);
111
+ --color-error-text-secondary: hsl(0, 0%, 100%, 1);
112
+
113
+ --color-error-border-primary: hsl(0, 100%, 44%, 1);
114
+ --color-error-border-secondary: hsl(0, 0%, 100%, 1);
115
+
116
+ --color-error-item-primary: hsl(0, 100%, 44%, 1);
117
+ --color-error-item-secondary: hsl(0, 0%, 100%, 1);
118
+
119
+ --color-success-primary: hsl(92, 56%, 38%, 1);
120
+
121
+ --color-success-text-primary: hsl(92, 56%, 38%, 1);
122
+ --color-success-text-secondary: hsl(0, 0%, 100%, 1);
123
+
124
+ --color-success-item-primary: hsl(92, 56%, 38%, 1);
125
+ --color-success-item-secondary: hsl(0, 0%, 100%, 1);
126
+
127
+ --color-success-border-primary: hsl(92, 56%, 38%, 1);
128
+ --color-success-border-secondary: hsl(0, 0%, 100%, 1);
129
+
130
+ --color-warning-text-primary: hsl(43, 68%, 50%, 1);
131
+ --color-warning-text-secondary: hsl(0, 0%, 100%, 1);
132
+
133
+ --color-warning-primary: hsl(43, 68%, 50%, 1);
134
+
135
+ --color-warning-border-primary: hsl(43, 68%, 50%, 1);
136
+
137
+ --color-warning-item-primary: hsl(43, 68%, 50%, 1);
138
+
139
+ --color-info-primary: hsl(211, 83%, 47%, 1);
140
+ --color-info-text-primary: hsl(0, 0%, 100%, 1);
141
+
142
+ --color-danger-primary: hsl(349, 96%, 44%, 1);
143
+ --color-danger-text-primary: hsl(0, 0%, 100%, 1);
144
+
145
+ --color-disabled-primary: hsl(0, 0%, 93%, 1);
146
+ --color-disabled-text-primary: hsl(0, 0%, 47%, 1);
147
+ --color-disabled-item-primary: hsl(0, 0%, 47%, 1);
148
+ --color-disabled-border-primary: hsl(0, 0%, 47%, 1);
149
149
 
150
150
  --color-gradient-primary: linear-gradient(
151
151
  to right,
152
- hsla(0, 100%, 44%, 1) 0%,
153
- hsla(27, 78%, 54%, 1) 50%,
154
- hsla(92, 56%, 38%, 1) 100%
152
+ hsl(0, 100%, 44%, 1) 0%,
153
+ hsl(27, 78%, 54%, 1) 50%,
154
+ hsl(92, 56%, 38%, 1) 100%
155
155
  );
156
- --elevation-1: 0px 1px 1px rgba(0, 0, 0, 0.24);
157
- --elevation-2: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
158
- --elevation-4: 0px 2px 6px rgba(0, 0, 0, 0.24);
159
- --elevation-6: 0px 2px 6px rgba(0, 0, 0, 0.24);
160
- --elevation-8: 0px 4px 12px 0px rgba(0, 0, 0, 0.2);
161
- --elevation-12: 0px 6px 12px rgba(0, 0, 0, 0.16);
162
- --elevation-16: 0px 8px 16px rgba(0, 0, 0, 0.16);
163
- --elevation-24: 0px 16px 24px rgba(0, 0, 0, 0.12);
156
+ --elevation-1: 0px 1px 1px rgb(0, 0, 0, 0.24);
157
+ --elevation-2: 0px 2px 8px 0px rgb(0, 0, 0, 0.1);
158
+ --elevation-4: 0px 2px 6px rgb(0, 0, 0, 0.24);
159
+ --elevation-6: 0px 2px 6px rgb(0, 0, 0, 0.24);
160
+ --elevation-8: 0px 4px 12px 0px rgb(0, 0, 0, 0.2);
161
+ --elevation-12: 0px 6px 12px rgb(0, 0, 0, 0.16);
162
+ --elevation-16: 0px 8px 16px rgb(0, 0, 0, 0.16);
163
+ --elevation-24: 0px 16px 24px rgb(0, 0, 0, 0.12);
164
164
  --min-max: 360px 1440px;
165
165
  --min: 360px;
166
166
  --max: 1440px;
167
+ --font-primary: 'Wix Madefor Display', sans-serif, system-ui;
168
+ --font-email: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
169
+ }
170
+ :root {
167
171
  --typography-min-viewport: 360px;
168
172
  --typography-max-viewport: 1920px;
169
173
 
174
+ --typography-hero1-max: 128px;
175
+ --typography-hero1-min: 72px;
176
+ --typography-hero1-max-line-height: 156px;
177
+ --typography-hero1-min-line-height: 88px;
178
+ --typography-hero1-font: var(--font-primary);
179
+
180
+ --typography-hero2-max: 96px;
181
+ --typography-hero2-min: 56px;
182
+ --typography-hero2-max-line-height: 112px;
183
+ --typography-hero2-min-line-height: 72px;
184
+ --typography-hero2-font: var(--font-primary);
185
+
186
+ --typography-hero3-max: 72px;
187
+ --typography-hero3-min: 48px;
188
+ --typography-hero3-max-line-height: 88px;
189
+ --typography-hero3-min-line-height: 56px;
190
+ --typography-hero3-font: var(--font-primary);
191
+
192
+ --typography-hero4-max: 56px;
193
+ --typography-hero4-min: 40px;
194
+ --typography-hero4-max-line-height: 72px;
195
+ --typography-hero4-min-line-height: 48px;
196
+ --typography-hero4-font: var(--font-primary);
197
+
198
+ --typography-hero5-max: 40px;
199
+ --typography-hero5-min: 32px;
200
+ --typography-hero5-max-line-height: 48px;
201
+ --typography-hero5-min-line-height: 40px;
202
+ --typography-hero5-font: var(--font-primary);
203
+
204
+ --typography-hero6-max: 32px;
205
+ --typography-hero6-min: 28px;
206
+ --typography-hero6-max-line-height: 40px;
207
+ --typography-hero6-min-line-height: 32px;
208
+ --typography-hero6-font: var(--font-primary);
209
+
170
210
  --typography-h1-max: 64px;
171
- --typography-h1-min: 32px;
172
- --typography-h1-max-line-height: 64px;
173
- --typography-h1-min-line-height: 40px;
211
+ --typography-h1-min: 56px;
212
+ --typography-h1-max-line-height: 80px;
213
+ --typography-h1-min-line-height: 60px;
174
214
  --typography-h1-font: var(--font-primary);
175
215
 
176
216
  --typography-h2-max: 48px;
177
- --typography-h2-min: 28px;
178
- --typography-h2-max-line-height: 48px;
179
- --typography-h2-min-line-height: 32px;
217
+ --typography-h2-min: 40px;
218
+ --typography-h2-max-line-height: 56px;
219
+ --typography-h2-min-line-height: 48px;
180
220
  --typography-h2-font: var(--font-primary);
181
221
 
182
222
  --typography-h3-max: 32px;
183
- --typography-h3-min: 18px;
184
- --typography-h3-max-line-height: 32px;
185
- --typography-h3-min-line-height: 24px;
223
+ --typography-h3-min: 28px;
224
+ --typography-h3-max-line-height: 40px;
225
+ --typography-h3-min-line-height: 32px;
186
226
  --typography-h3-font: var(--font-primary);
187
227
 
188
228
  --typography-h4-max: 24px;
189
- --typography-h4-min: 16px;
190
- --typography-h4-max-line-height: 24px;
191
- --typography-h4-min-line-height: 18px;
229
+ --typography-h4-min: 24px;
230
+ --typography-h4-max-line-height: 32px;
231
+ --typography-h4-min-line-height: 32px;
192
232
  --typography-h4-font: var(--font-primary);
193
233
 
194
234
  --typography-h5-max: 18px;
195
- --typography-h5-min: 14px;
235
+ --typography-h5-min: 18px;
196
236
  --typography-h5-max-line-height: 18px;
197
237
  --typography-h5-min-line-height: 16px;
198
238
  --typography-h5-font: var(--font-primary);
199
239
 
200
240
  --typography-h6-max: 16px;
201
- --typography-h6-min: 12px;
202
- --typography-h6-max-line-height: 16px;
203
- --typography-h6-min-line-height: 14px;
241
+ --typography-h6-min: 16px;
242
+ --typography-h6-max-line-height: 24px;
243
+ --typography-h6-min-line-height: 24px;
204
244
  --typography-h6-font: var(--font-primary);
205
245
 
206
- --typography-p-max: 16px;
207
- --typography-p-min: 14px;
208
- --typography-p-max-line-height: 20px;
209
- --typography-p-min-line-height: 18px;
246
+ --typography-p-max: 24px;
247
+ --typography-p-min: 20px;
248
+ --typography-p-max-line-height: 24px;
249
+ --typography-p-min-line-height: 28px;
210
250
  --typography-p-font: var(--font-primary);
211
251
 
212
- --typography-text-xxl-min: 20px;
213
252
  --typography-text-xxl-max: 24px;
214
- --typography-text-xxl-min-line-height: 24px;
253
+ --typography-text-xxl-min: 20px;
215
254
  --typography-text-xxl-max-line-height: 28px;
255
+ --typography-text-xxl-min-line-height: 24px;
216
256
  --typography-text-xxl-font: var(--font-primary);
217
257
 
218
- --typography-text-xl-min: 18px;
219
258
  --typography-text-xl-max: 20px;
220
- --typography-text-xl-min-line-height: 22px;
221
- --typography-text-xl-max-line-height: 24px;
259
+ --typography-text-xl-min: 18px;
260
+ --typography-text-xl-min-line-height: 24px;
261
+ --typography-text-xl-max-line-height: 20px;
222
262
  --typography-text-xl-font: var(--font-primary);
223
263
 
224
- --typography-text-l-min: 16px;
225
264
  --typography-text-l-max: 18px;
226
- --typography-text-l-min-line-height: 20px;
227
- --typography-text-l-max-line-height: 22px;
265
+ --typography-text-l-min: 16px;
266
+ --typography-text-l-max-line-height: 20px;
267
+ --typography-text-l-min-line-height: 18px;
228
268
  --typography-text-l-font: var(--font-primary);
229
269
 
230
- --typography-text-m-min: 14px;
231
270
  --typography-text-m-max: 16px;
232
- --typography-text-m-min-line-height: 18px;
233
- --typography-text-m-max-line-height: 20px;
271
+ --typography-text-m-min: 14px;
272
+ --typography-text-m-max-line-height: 18px;
273
+ --typography-text-m-min-line-height: 16px;
234
274
  --typography-text-m-font: var(--font-primary);
235
275
 
236
276
  --typography-text-s-min: 14px;
@@ -239,16 +279,16 @@ html:is(.am):root {
239
279
  --typography-text-s-max-line-height: 18px;
240
280
  --typography-text-s-font: var(--font-primary);
241
281
 
242
- --typography-text-xs-min: 12px;
243
282
  --typography-text-xs-max: 12px;
283
+ --typography-text-xs-min: 10px;
284
+ --typography-text-xs-max-line-height: 12px;
244
285
  --typography-text-xs-min-line-height: 12px;
245
- --typography-text-xs-max-line-height: 16px;
246
286
  --typography-text-xs-font: var(--font-primary);
247
287
 
248
- --typography-text-xxs-min: 10px;
249
288
  --typography-text-xxs-max: 10px;
250
- --typography-text-xxs-min-line-height: 12px;
251
- --typography-text-xxs-max-line-height: 12px;
289
+ --typography-text-xxs-min: 8px;
290
+ --typography-text-xxs-max-line-height: 10px;
291
+ --typography-text-xxs-min-line-height: 10px;
252
292
  --typography-text-xxs-font: var(--font-primary);
253
293
 
254
294
  --typography-email-h1: 32px;
@@ -293,14 +333,9 @@ html:is(.am):root {
293
333
  --typography-email-text-xxs: 10px;
294
334
  --typography-email-text-xxs-line-height: 14px;
295
335
  }
336
+ /* stylelint-disable prettier/prettier */
296
337
  /* stylelint-disable at-rule-descriptor-no-unknown */
297
338
  /* stylelint-disable value-keyword-case */
298
- :root {
299
- --font-primary: 'Wix Madefor Display', sans-serif;
300
- --font-email:
301
- -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu,
302
- Cantarell, 'Helvetica Neue', sans-serif;
303
- }
304
339
  @font-face {
305
340
  font-family: 'Wix Madefor Display';
306
341
  src: url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Bold.eot');
@@ -366,7 +401,7 @@ html:is(.am):root {
366
401
  font-optical-sizing: auto;
367
402
  }
368
403
  @media (--desktop) {
369
- html:is(.am):root {
404
+ :root.am {
370
405
  --wrapper-margin: 40px;
371
406
 
372
407
  /* Warning first column 1fr by default */
@@ -376,7 +411,7 @@ html:is(.am):root {
376
411
  }
377
412
  }
378
413
  @media (--mobile) {
379
- html:is(.am):root {
414
+ :root.am {
380
415
  --wrapper-margin: 12px;
381
416
 
382
417
  /* Warning first column 1fr by default */
@@ -386,7 +421,7 @@ html:is(.am):root {
386
421
  }
387
422
  }
388
423
  @media (--tablet) {
389
- html:is(.am):root {
424
+ :root.am {
390
425
  --wrapper-margin: 24px;
391
426
 
392
427
  /* Warning first column 1fr by default */
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@itcase/tokens-am",
3
3
  "description": "",
4
- "version": "1.0.30",
4
+ "version": "1.1.1",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "private": false,
@@ -25,5 +25,5 @@
25
25
  "access": "public",
26
26
  "registry": "https://registry.npmjs.org/"
27
27
  },
28
- "gitHead": "3efa012e7219443262ce76c5ba5073308e9e92fe"
28
+ "gitHead": "0cc85d6eee3ae3c9826454eca1d6042538ddf03c"
29
29
  }
package/dist/fonts/fonts.css DELETED
@@ -1,77 +0,0 @@
1
- /* stylelint-disable at-rule-descriptor-no-unknown */
2
- /* stylelint-disable value-keyword-case */
3
-
4
- :root {
5
- --font-primary: 'Wix Madefor Display', sans-serif;
6
- --font-email:
7
- -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu,
8
- Cantarell, 'Helvetica Neue', sans-serif;
9
- }
10
-
11
- @font-face {
12
- font-family: 'Wix Madefor Display';
13
- src: url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Bold.eot');
14
- src:
15
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Bold.eot?#iefix')
16
- format('embedded-opentype'),
17
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Bold.woff2')
18
- format('woff2'),
19
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Bold.woff')
20
- format('woff'),
21
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Bold.ttf')
22
- format('truetype');
23
- font-weight: 700;
24
- font-style: normal;
25
- font-optical-sizing: auto;
26
- }
27
-
28
- @font-face {
29
- font-family: 'Wix Madefor Display';
30
- src: url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-SemiBold.eot');
31
- src:
32
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-SemiBold.eot?#iefix')
33
- format('embedded-opentype'),
34
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-SemiBold.woff2')
35
- format('woff2'),
36
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-SemiBold.woff')
37
- format('woff'),
38
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-SemiBold.ttf')
39
- format('truetype');
40
- font-weight: 600;
41
- font-style: normal;
42
- font-optical-sizing: auto;
43
- }
44
-
45
- @font-face {
46
- font-family: 'Wix Madefor Display';
47
- src: url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Medium.eot');
48
- src:
49
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Medium.eot?#iefix')
50
- format('embedded-opentype'),
51
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Medium.woff2')
52
- format('woff2'),
53
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Medium.woff')
54
- format('woff'),
55
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Medium.ttf')
56
- format('truetype');
57
- font-weight: 500;
58
- font-style: normal;
59
- font-optical-sizing: auto;
60
- }
61
-
62
- @font-face {
63
- font-family: 'Wix Madefor Display';
64
- src: url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Regular.eot');
65
- src:
66
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Regular.eot?#iefix')
67
- format('embedded-opentype'),
68
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Regular.woff2')
69
- format('woff2'),
70
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Regular.woff')
71
- format('woff'),
72
- url('@itcase/tokens-am/dist/fonts/WixMadeforDisplay/WixMadeforDisplay-Regular.ttf')
73
- format('truetype');
74
- font-weight: 400;
75
- font-style: normal;
76
- font-optical-sizing: auto;
77
- }