@qw-ui/tokens 0.3.0-next.17 → 0.3.0-next.18

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/tokens.css +149 -130
  2. package/package.json +1 -1
package/dist/tokens.css CHANGED
@@ -1,15 +1,5 @@
1
1
  /* @qw-ui/tokens — 由 seed derive() 生成，请勿手改。 */
2
2
  :root {
3
- --qw-ref-color-brand-50: #F2F6FF;
4
- --qw-ref-color-brand-100: #E6ECFF;
5
- --qw-ref-color-brand-200: #C4D8FF;
6
- --qw-ref-color-brand-300: #9DBDFF;
7
- --qw-ref-color-brand-400: #6C9AFF;
8
- --qw-ref-color-brand-500: #426EFF;
9
- --qw-ref-color-brand-600: #1B57FF;
10
- --qw-ref-color-brand-700: #002CE8;
11
- --qw-ref-color-brand-800: #001A99;
12
- --qw-ref-color-brand-900: #000540;
13
3
  --qw-ref-color-brand-a5: rgba(0, 17, 255, 0.05);
14
4
  --qw-ref-color-brand-a10: rgba(0, 17, 255, 0.1);
15
5
  --qw-ref-color-brand-a20: rgba(0, 17, 255, 0.2);
@@ -21,17 +11,17 @@
21
11
  --qw-ref-color-brand-a80: rgba(0, 17, 255, 0.8);
22
12
  --qw-ref-color-brand-a90: rgba(0, 17, 255, 0.9);
23
13
  --qw-ref-color-brand-a100: #0011ff;
14
+ --qw-ref-color-brand-50: #F2F6FF;
15
+ --qw-ref-color-brand-100: #E6ECFF;
16
+ --qw-ref-color-brand-200: #C4D8FF;
17
+ --qw-ref-color-brand-300: #9DBDFF;
18
+ --qw-ref-color-brand-400: #6C9AFF;
19
+ --qw-ref-color-brand-500: #426EFF;
20
+ --qw-ref-color-brand-600: #1B57FF;
21
+ --qw-ref-color-brand-700: #002CE8;
22
+ --qw-ref-color-brand-800: #001A99;
23
+ --qw-ref-color-brand-900: #000540;
24
24
  --qw-ref-color-brand-base: #0011ff;
25
- --qw-ref-color-black-50: #F6F6F6;
26
- --qw-ref-color-black-100: #EBEBEB;
27
- --qw-ref-color-black-200: #D7D7D7;
28
- --qw-ref-color-black-300: #BEBEBE;
29
- --qw-ref-color-black-400: #9E9E9E;
30
- --qw-ref-color-black-500: #868686;
31
- --qw-ref-color-black-600: #6F6F6F;
32
- --qw-ref-color-black-700: #555555;
33
- --qw-ref-color-black-800: #353535;
34
- --qw-ref-color-black-900: #121212;
35
25
  --qw-ref-color-black-a5: rgba(34, 34, 34, 0.05);
36
26
  --qw-ref-color-black-a10: rgba(34, 34, 34, 0.1);
37
27
  --qw-ref-color-black-a20: rgba(34, 34, 34, 0.2);
@@ -43,17 +33,17 @@
43
33
  --qw-ref-color-black-a80: rgba(34, 34, 34, 0.8);
44
34
  --qw-ref-color-black-a90: rgba(34, 34, 34, 0.9);
45
35
  --qw-ref-color-black-a100: #222222;
36
+ --qw-ref-color-black-50: #F6F6F6;
37
+ --qw-ref-color-black-100: #EBEBEB;
38
+ --qw-ref-color-black-200: #D7D7D7;
39
+ --qw-ref-color-black-300: #BEBEBE;
40
+ --qw-ref-color-black-400: #9E9E9E;
41
+ --qw-ref-color-black-500: #868686;
42
+ --qw-ref-color-black-600: #6F6F6F;
43
+ --qw-ref-color-black-700: #555555;
44
+ --qw-ref-color-black-800: #353535;
45
+ --qw-ref-color-black-900: #121212;
46
46
  --qw-ref-color-black-base: #222222;
47
- --qw-ref-color-white-50: #F6F6F6;
48
- --qw-ref-color-white-100: #EBEBEB;
49
- --qw-ref-color-white-200: #D7D7D7;
50
- --qw-ref-color-white-300: #BEBEBE;
51
- --qw-ref-color-white-400: #9E9E9E;
52
- --qw-ref-color-white-500: #868686;
53
- --qw-ref-color-white-600: #6F6F6F;
54
- --qw-ref-color-white-700: #555555;
55
- --qw-ref-color-white-800: #353535;
56
- --qw-ref-color-white-900: #121212;
57
47
  --qw-ref-color-white-a5: rgba(255, 255, 255, 0.05);
58
48
  --qw-ref-color-white-a10: rgba(255, 255, 255, 0.1);
59
49
  --qw-ref-color-white-a20: rgba(255, 255, 255, 0.2);
@@ -65,17 +55,17 @@
65
55
  --qw-ref-color-white-a80: rgba(255, 255, 255, 0.8);
66
56
  --qw-ref-color-white-a90: rgba(255, 255, 255, 0.9);
67
57
  --qw-ref-color-white-a100: #ffffff;
58
+ --qw-ref-color-white-50: #F6F6F6;
59
+ --qw-ref-color-white-100: #EBEBEB;
60
+ --qw-ref-color-white-200: #D7D7D7;
61
+ --qw-ref-color-white-300: #BEBEBE;
62
+ --qw-ref-color-white-400: #9E9E9E;
63
+ --qw-ref-color-white-500: #868686;
64
+ --qw-ref-color-white-600: #6F6F6F;
65
+ --qw-ref-color-white-700: #555555;
66
+ --qw-ref-color-white-800: #353535;
67
+ --qw-ref-color-white-900: #121212;
68
68
  --qw-ref-color-white-base: #ffffff;
69
- --qw-ref-color-gray-50: #F6F6F6;
70
- --qw-ref-color-gray-100: #EEEEEE;
71
- --qw-ref-color-gray-200: #E0E0E0;
72
- --qw-ref-color-gray-300: #CCCCCC;
73
- --qw-ref-color-gray-400: #A2A9B6;
74
- --qw-ref-color-gray-500: #888E99;
75
- --qw-ref-color-gray-600: #666666;
76
- --qw-ref-color-gray-700: #3A3A3A;
77
- --qw-ref-color-gray-800: #2D2D2D;
78
- --qw-ref-color-gray-900: #202020;
79
69
  --qw-ref-color-gray-a5: rgba(153, 153, 153, 0.05);
80
70
  --qw-ref-color-gray-a10: rgba(153, 153, 153, 0.1);
81
71
  --qw-ref-color-gray-a20: rgba(153, 153, 153, 0.2);
@@ -87,17 +77,17 @@
87
77
  --qw-ref-color-gray-a80: rgba(153, 153, 153, 0.8);
88
78
  --qw-ref-color-gray-a90: rgba(153, 153, 153, 0.9);
89
79
  --qw-ref-color-gray-a100: #999999;
80
+ --qw-ref-color-gray-50: #F6F6F6;
81
+ --qw-ref-color-gray-100: #EEEEEE;
82
+ --qw-ref-color-gray-200: #E0E0E0;
83
+ --qw-ref-color-gray-300: #CCCCCC;
84
+ --qw-ref-color-gray-400: #A2A9B6;
85
+ --qw-ref-color-gray-500: #888E99;
86
+ --qw-ref-color-gray-600: #666666;
87
+ --qw-ref-color-gray-700: #3A3A3A;
88
+ --qw-ref-color-gray-800: #2D2D2D;
89
+ --qw-ref-color-gray-900: #202020;
90
90
  --qw-ref-color-gray-base: #999999;
91
- --qw-ref-color-red-50: #FFF3F1;
92
- --qw-ref-color-red-100: #FFE7E4;
93
- --qw-ref-color-red-200: #FFC8C2;
94
- --qw-ref-color-red-300: #FFA097;
95
- --qw-ref-color-red-400: #FF5745;
96
- --qw-ref-color-red-500: #FF4D4D;
97
- --qw-ref-color-red-600: #CF081E;
98
- --qw-ref-color-red-700: #A30013;
99
- --qw-ref-color-red-800: #6A0009;
100
- --qw-ref-color-red-900: #2A0001;
101
91
  --qw-ref-color-red-a5: rgba(255, 64, 64, 0.05);
102
92
  --qw-ref-color-red-a10: rgba(255, 64, 64, 0.1);
103
93
  --qw-ref-color-red-a20: rgba(255, 64, 64, 0.2);
@@ -109,17 +99,17 @@
109
99
  --qw-ref-color-red-a80: rgba(255, 64, 64, 0.8);
110
100
  --qw-ref-color-red-a90: rgba(255, 64, 64, 0.9);
111
101
  --qw-ref-color-red-a100: #ff4040;
102
+ --qw-ref-color-red-50: #FFF3F1;
103
+ --qw-ref-color-red-100: #FFE7E4;
104
+ --qw-ref-color-red-200: #FFC8C2;
105
+ --qw-ref-color-red-300: #FFA097;
106
+ --qw-ref-color-red-400: #FF5745;
107
+ --qw-ref-color-red-500: #FF4D4D;
108
+ --qw-ref-color-red-600: #CF081E;
109
+ --qw-ref-color-red-700: #A30013;
110
+ --qw-ref-color-red-800: #6A0009;
111
+ --qw-ref-color-red-900: #2A0001;
112
112
  --qw-ref-color-red-base: #ff4040;
113
- --qw-ref-color-orange-50: #FFF3EF;
114
- --qw-ref-color-orange-100: #FFE5DD;
115
- --qw-ref-color-orange-200: #FFC9B9;
116
- --qw-ref-color-orange-300: #FFA287;
117
- --qw-ref-color-orange-400: #F76F47;
118
- --qw-ref-color-orange-500: #FF764D;
119
- --qw-ref-color-orange-600: #C03800;
120
- --qw-ref-color-orange-700: #962A00;
121
- --qw-ref-color-orange-800: #611800;
122
- --qw-ref-color-orange-900: #260500;
123
113
  --qw-ref-color-orange-a5: rgba(255, 107, 63, 0.05);
124
114
  --qw-ref-color-orange-a10: rgba(255, 107, 63, 0.1);
125
115
  --qw-ref-color-orange-a20: rgba(255, 107, 63, 0.2);
@@ -131,17 +121,17 @@
131
121
  --qw-ref-color-orange-a80: rgba(255, 107, 63, 0.8);
132
122
  --qw-ref-color-orange-a90: rgba(255, 107, 63, 0.9);
133
123
  --qw-ref-color-orange-a100: #ff6b3f;
124
+ --qw-ref-color-orange-50: #FFF3EF;
125
+ --qw-ref-color-orange-100: #FFE5DD;
126
+ --qw-ref-color-orange-200: #FFC9B9;
127
+ --qw-ref-color-orange-300: #FFA287;
128
+ --qw-ref-color-orange-400: #F76F47;
129
+ --qw-ref-color-orange-500: #FF764D;
130
+ --qw-ref-color-orange-600: #C03800;
131
+ --qw-ref-color-orange-700: #962A00;
132
+ --qw-ref-color-orange-800: #611800;
133
+ --qw-ref-color-orange-900: #260500;
134
134
  --qw-ref-color-orange-base: #ff6b3f;
135
- --qw-ref-color-yellow-50: #FFF5DF;
136
- --qw-ref-color-yellow-100: #FFE9B9;
137
- --qw-ref-color-yellow-200: #F4D38B;
138
- --qw-ref-color-yellow-300: #DCB96B;
139
- --qw-ref-color-yellow-400: #BE9940;
140
- --qw-ref-color-yellow-500: #A78013;
141
- --qw-ref-color-yellow-600: #8B6900;
142
- --qw-ref-color-yellow-700: #6C5100;
143
- --qw-ref-color-yellow-800: #453200;
144
- --qw-ref-color-yellow-900: #191000;
145
135
  --qw-ref-color-yellow-a5: rgba(255, 213, 117, 0.05);
146
136
  --qw-ref-color-yellow-a10: rgba(255, 213, 117, 0.1);
147
137
  --qw-ref-color-yellow-a20: rgba(255, 213, 117, 0.2);
@@ -153,17 +143,17 @@
153
143
  --qw-ref-color-yellow-a80: rgba(255, 213, 117, 0.8);
154
144
  --qw-ref-color-yellow-a90: rgba(255, 213, 117, 0.9);
155
145
  --qw-ref-color-yellow-a100: #ffd575;
146
+ --qw-ref-color-yellow-50: #FFF5DF;
147
+ --qw-ref-color-yellow-100: #FFE9B9;
148
+ --qw-ref-color-yellow-200: #F4D38B;
149
+ --qw-ref-color-yellow-300: #DCB96B;
150
+ --qw-ref-color-yellow-400: #BE9940;
151
+ --qw-ref-color-yellow-500: #A78013;
152
+ --qw-ref-color-yellow-600: #8B6900;
153
+ --qw-ref-color-yellow-700: #6C5100;
154
+ --qw-ref-color-yellow-800: #453200;
155
+ --qw-ref-color-yellow-900: #191000;
156
156
  --qw-ref-color-yellow-base: #ffd575;
157
- --qw-ref-color-green-50: #E2FFE4;
158
- --qw-ref-color-green-100: #BCFFC3;
159
- --qw-ref-color-green-200: #9BEFA5;
160
- --qw-ref-color-green-300: #7BD688;
161
- --qw-ref-color-green-400: #52B764;
162
- --qw-ref-color-green-500: #2C9F47;
163
- --qw-ref-color-green-600: #068631;
164
- --qw-ref-color-green-700: #006823;
165
- --qw-ref-color-green-800: #004213;
166
- --qw-ref-color-green-900: #001704;
167
157
  --qw-ref-color-green-a5: rgba(31, 153, 63, 0.05);
168
158
  --qw-ref-color-green-a10: rgba(31, 153, 63, 0.1);
169
159
  --qw-ref-color-green-a20: rgba(31, 153, 63, 0.2);
@@ -175,17 +165,17 @@
175
165
  --qw-ref-color-green-a80: rgba(31, 153, 63, 0.8);
176
166
  --qw-ref-color-green-a90: rgba(31, 153, 63, 0.9);
177
167
  --qw-ref-color-green-a100: #1f993f;
168
+ --qw-ref-color-green-50: #E2FFE4;
169
+ --qw-ref-color-green-100: #BCFFC3;
170
+ --qw-ref-color-green-200: #9BEFA5;
171
+ --qw-ref-color-green-300: #7BD688;
172
+ --qw-ref-color-green-400: #52B764;
173
+ --qw-ref-color-green-500: #2C9F47;
174
+ --qw-ref-color-green-600: #068631;
175
+ --qw-ref-color-green-700: #006823;
176
+ --qw-ref-color-green-800: #004213;
177
+ --qw-ref-color-green-900: #001704;
178
178
  --qw-ref-color-green-base: #1f993f;
179
- --qw-ref-color-cyan-50: #E0FCFF;
180
- --qw-ref-color-cyan-100: #BAF8FF;
181
- --qw-ref-color-cyan-200: #91EAF2;
182
- --qw-ref-color-cyan-300: #65D0DC;
183
- --qw-ref-color-cyan-400: #2FB2BE;
184
- --qw-ref-color-cyan-500: #0098A4;
185
- --qw-ref-color-cyan-600: #007E88;
186
- --qw-ref-color-cyan-700: #006169;
187
- --qw-ref-color-cyan-800: #003D43;
188
- --qw-ref-color-cyan-900: #001518;
189
179
  --qw-ref-color-cyan-a5: rgba(41, 190, 204, 0.05);
190
180
  --qw-ref-color-cyan-a10: rgba(41, 190, 204, 0.1);
191
181
  --qw-ref-color-cyan-a20: rgba(41, 190, 204, 0.2);
@@ -197,17 +187,17 @@
197
187
  --qw-ref-color-cyan-a80: rgba(41, 190, 204, 0.8);
198
188
  --qw-ref-color-cyan-a90: rgba(41, 190, 204, 0.9);
199
189
  --qw-ref-color-cyan-a100: #29becc;
190
+ --qw-ref-color-cyan-50: #E0FCFF;
191
+ --qw-ref-color-cyan-100: #BAF8FF;
192
+ --qw-ref-color-cyan-200: #91EAF2;
193
+ --qw-ref-color-cyan-300: #65D0DC;
194
+ --qw-ref-color-cyan-400: #2FB2BE;
195
+ --qw-ref-color-cyan-500: #0098A4;
196
+ --qw-ref-color-cyan-600: #007E88;
197
+ --qw-ref-color-cyan-700: #006169;
198
+ --qw-ref-color-cyan-800: #003D43;
199
+ --qw-ref-color-cyan-900: #001518;
200
200
  --qw-ref-color-cyan-base: #29becc;
201
- --qw-ref-color-blue-50: #EBF5FF;
202
- --qw-ref-color-blue-100: #E7F1FF;
203
- --qw-ref-color-blue-200: #D6EBFF;
204
- --qw-ref-color-blue-300: #9CBEFF;
205
- --qw-ref-color-blue-400: #3086FF;
206
- --qw-ref-color-blue-500: #1677FF;
207
- --qw-ref-color-blue-600: #266FFF;
208
- --qw-ref-color-blue-700: #003DB8;
209
- --qw-ref-color-blue-800: #001D66;
210
- --qw-ref-color-blue-900: #000A3A;
211
201
  --qw-ref-color-blue-a5: rgba(13, 83, 255, 0.05);
212
202
  --qw-ref-color-blue-a10: rgba(13, 83, 255, 0.1);
213
203
  --qw-ref-color-blue-a20: rgba(13, 83, 255, 0.2);
@@ -219,17 +209,17 @@
219
209
  --qw-ref-color-blue-a80: rgba(13, 83, 255, 0.8);
220
210
  --qw-ref-color-blue-a90: rgba(13, 83, 255, 0.9);
221
211
  --qw-ref-color-blue-a100: #0d53ff;
212
+ --qw-ref-color-blue-50: #EBF5FF;
213
+ --qw-ref-color-blue-100: #E7F1FF;
214
+ --qw-ref-color-blue-200: #D6EBFF;
215
+ --qw-ref-color-blue-300: #9CBEFF;
216
+ --qw-ref-color-blue-400: #3086FF;
217
+ --qw-ref-color-blue-500: #1677FF;
218
+ --qw-ref-color-blue-600: #266FFF;
219
+ --qw-ref-color-blue-700: #003DB8;
220
+ --qw-ref-color-blue-800: #001D66;
221
+ --qw-ref-color-blue-900: #000A3A;
222
222
  --qw-ref-color-blue-base: #0d53ff;
223
- --qw-ref-color-purple-50: #F3F5FF;
224
- --qw-ref-color-purple-100: #E6EAFF;
225
- --qw-ref-color-purple-200: #CDD5FF;
226
- --qw-ref-color-purple-300: #A699FF;
227
- --qw-ref-color-purple-400: #8692FF;
228
- --qw-ref-color-purple-500: #6B71FF;
229
- --qw-ref-color-purple-600: #5550F2;
230
- --qw-ref-color-purple-700: #4135C9;
231
- --qw-ref-color-purple-800: #280B96;
232
- --qw-ref-color-purple-900: #0C0041;
233
223
  --qw-ref-color-purple-a5: rgba(67, 44, 219, 0.05);
234
224
  --qw-ref-color-purple-a10: rgba(67, 44, 219, 0.1);
235
225
  --qw-ref-color-purple-a20: rgba(67, 44, 219, 0.2);
@@ -241,17 +231,17 @@
241
231
  --qw-ref-color-purple-a80: rgba(67, 44, 219, 0.8);
242
232
  --qw-ref-color-purple-a90: rgba(67, 44, 219, 0.9);
243
233
  --qw-ref-color-purple-a100: #432cdb;
234
+ --qw-ref-color-purple-50: #F3F5FF;
235
+ --qw-ref-color-purple-100: #E6EAFF;
236
+ --qw-ref-color-purple-200: #CDD5FF;
237
+ --qw-ref-color-purple-300: #A699FF;
238
+ --qw-ref-color-purple-400: #8692FF;
239
+ --qw-ref-color-purple-500: #6B71FF;
240
+ --qw-ref-color-purple-600: #5550F2;
241
+ --qw-ref-color-purple-700: #4135C9;
242
+ --qw-ref-color-purple-800: #280B96;
243
+ --qw-ref-color-purple-900: #0C0041;
244
244
  --qw-ref-color-purple-base: #432cdb;
245
- --qw-ref-color-brown-50: #FFF3EC;
246
- --qw-ref-color-brown-100: #FFE6D5;
247
- --qw-ref-color-brown-200: #FFCBA8;
248
- --qw-ref-color-brown-300: #F8A971;
249
- --qw-ref-color-brown-400: #DA8749;
250
- --qw-ref-color-brown-500: #C36D24;
251
- --qw-ref-color-brown-600: #A75600;
252
- --qw-ref-color-brown-700: #824100;
253
- --qw-ref-color-brown-800: #542800;
254
- --qw-ref-color-brown-900: #200B00;
255
245
  --qw-ref-color-brown-a5: rgba(180, 94, 6, 0.05);
256
246
  --qw-ref-color-brown-a10: rgba(180, 94, 6, 0.1);
257
247
  --qw-ref-color-brown-a20: rgba(180, 94, 6, 0.2);
@@ -263,6 +253,16 @@
263
253
  --qw-ref-color-brown-a80: rgba(180, 94, 6, 0.8);
264
254
  --qw-ref-color-brown-a90: rgba(180, 94, 6, 0.9);
265
255
  --qw-ref-color-brown-a100: #b45e06;
256
+ --qw-ref-color-brown-50: #FFF3EC;
257
+ --qw-ref-color-brown-100: #FFE6D5;
258
+ --qw-ref-color-brown-200: #FFCBA8;
259
+ --qw-ref-color-brown-300: #F8A971;
260
+ --qw-ref-color-brown-400: #DA8749;
261
+ --qw-ref-color-brown-500: #C36D24;
262
+ --qw-ref-color-brown-600: #A75600;
263
+ --qw-ref-color-brown-700: #824100;
264
+ --qw-ref-color-brown-800: #542800;
265
+ --qw-ref-color-brown-900: #200B00;
266
266
  --qw-ref-color-brown-base: #b45e06;
267
267
  --qw-ref-size-spacing-1: 4px;
268
268
  --qw-ref-size-spacing-2: 8px;
@@ -297,17 +297,23 @@
297
297
  --qw-ref-size-avatar-diameter-sm: 40px;
298
298
  --qw-ref-size-avatar-diameter-md: 50px;
299
299
  --qw-ref-size-avatar-diameter-lg: 58px;
300
+ --qw-ref-typography-line-height-tight: 1.25;
301
+ --qw-ref-typography-line-height-normal: 1.5;
302
+ --qw-ref-typography-line-height-relaxed: 1.75;
300
303
  --qw-ref-size-opacity-disabled: 0.5;
301
304
  --qw-ref-size-z-index-1: 10;
302
305
  --qw-ref-size-z-index-2: 20;
303
306
  --qw-ref-size-z-index-3: 30;
304
307
  --qw-ref-size-z-index-4: 40;
305
- --qw-ref-typography-line-height-tight: 1.25;
306
- --qw-ref-typography-line-height-normal: 1.5;
307
- --qw-ref-typography-line-height-relaxed: 1.75;
308
308
  --qw-ref-typography-font-family-text: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
309
309
  --qw-ref-typography-font-family-number: PlusJakartaSans, system-ui, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
310
310
  --qw-ref-typography-font-family-code: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
311
+ --qw-ref-typography-font-family-text-mac-latin: -apple-system, BlinkMacSystemFont, 'SF Pro Text', system-ui, 'Helvetica Neue', Helvetica, Arial, sans-serif;
312
+ --qw-ref-typography-font-family-text-mac-zh: 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Hiragino Sans GB', 'Hiragino Sans', 'SF Pro Text', system-ui, 'Noto Sans SC', 'Helvetica Neue', Helvetica, Arial, sans-serif;
313
+ --qw-ref-typography-font-family-text-mac-ja: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'SF Pro Text', system-ui, 'Noto Sans JP', 'Helvetica Neue', Helvetica, Arial, sans-serif;
314
+ --qw-ref-typography-font-family-text-windows-latin: 'Segoe UI', system-ui, Roboto, 'Noto Sans', 'Helvetica Neue', Arial, sans-serif;
315
+ --qw-ref-typography-font-family-text-windows-zh: 'Microsoft YaHei', 'Segoe UI', system-ui, Roboto, 'Noto Sans SC', 'Helvetica Neue', Arial, sans-serif;
316
+ --qw-ref-typography-font-family-text-windows-ja: Meiryo, 'Yu Gothic UI', 'Segoe UI', system-ui, Roboto, 'Noto Sans JP', 'Helvetica Neue', Arial, sans-serif;
311
317
  --qw-ref-typography-font-weight-regular: 400;
312
318
  --qw-ref-typography-font-weight-medium: 500;
313
319
  --qw-ref-typography-font-weight-semibold: 600;
@@ -372,10 +378,10 @@
372
378
  --qw-sem-size-avatar-diameter-md: 50px;
373
379
  --qw-sem-size-avatar-diameter-lg: 58px;
374
380
  --qw-sem-size-inset-sm: 8px;
375
- --qw-sem-size-inset-md: 16px;
376
- --qw-sem-size-inset-lg: 24px;
377
381
  --qw-sem-size-stack-sm: 8px;
382
+ --qw-sem-size-inset-md: 16px;
378
383
  --qw-sem-size-stack-md: 16px;
384
+ --qw-sem-size-inset-lg: 24px;
379
385
  --qw-sem-size-stack-lg: 24px;
380
386
  --qw-sem-size-opacity-disabled: 0.5;
381
387
  --qw-sem-size-z-index-dropdown: 10;
@@ -395,11 +401,6 @@
395
401
  --qw-sem-typography-body-strong-font-weight: 500;
396
402
  --qw-sem-typography-body-strong-line-height: 1.5;
397
403
  --qw-sem-typography-body-strong-letter-spacing: 0px;
398
- --qw-sem-typography-body-lg-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
399
- --qw-sem-typography-body-lg-font-size: 16px;
400
- --qw-sem-typography-body-lg-font-weight: 400;
401
- --qw-sem-typography-body-lg-line-height: 1.5;
402
- --qw-sem-typography-body-lg-letter-spacing: 0px;
403
404
  --qw-sem-typography-heading-sm-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
404
405
  --qw-sem-typography-heading-sm-font-size: 16px;
405
406
  --qw-sem-typography-heading-sm-font-weight: 600;
@@ -420,6 +421,11 @@
420
421
  --qw-sem-typography-caption-font-weight: 400;
421
422
  --qw-sem-typography-caption-line-height: 1.5;
422
423
  --qw-sem-typography-caption-letter-spacing: 0px;
424
+ --qw-sem-typography-body-lg-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
425
+ --qw-sem-typography-body-lg-font-size: 16px;
426
+ --qw-sem-typography-body-lg-font-weight: 400;
427
+ --qw-sem-typography-body-lg-line-height: 1.5;
428
+ --qw-sem-typography-body-lg-letter-spacing: 0px;
423
429
  --qw-sem-typography-label-sm-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
424
430
  --qw-sem-typography-label-sm-font-size: 11px;
425
431
  --qw-sem-typography-label-sm-font-weight: 500;
@@ -443,6 +449,7 @@
443
449
  --qw-sem-color-surface-sunken: #EEEEEE;
444
450
  --qw-sem-color-surface-selected: rgba(34, 34, 34, 0.05);
445
451
  --qw-sem-color-surface-inverse: #353535;
452
+ --qw-sem-color-surface-canvas-subtle: #F6F6F6;
446
453
  --qw-sem-color-content-primary: #222222;
447
454
  --qw-sem-color-content-secondary: #666666;
448
455
  --qw-sem-color-content-tertiary: #999999;
@@ -481,11 +488,18 @@
481
488
  --qw-sem-color-status-warning: #ffd575;
482
489
  --qw-sem-color-status-danger: #FF5745;
483
490
  --qw-sem-color-status-info: #0d53ff;
491
+ --qw-sem-color-status-success-subtle: rgba(31, 153, 63, 0.1);
492
+ --qw-sem-color-status-warning-subtle: rgba(255, 213, 117, 0.2);
493
+ --qw-sem-color-status-danger-subtle: rgba(255, 64, 64, 0.1);
494
+ --qw-sem-color-status-info-subtle: rgba(13, 83, 255, 0.1);
484
495
  --qw-sem-color-overlay-scrim: rgba(34, 34, 34, 0.5);
485
496
  --qw-sem-color-overlay-guide: rgba(13, 83, 255, 0.1);
486
497
  --qw-sem-color-overlay-media-subtle: rgba(34, 34, 34, 0.4);
487
498
  --qw-sem-color-overlay-media-strong: rgba(34, 34, 34, 0.5);
488
499
  --qw-sem-color-shadow: rgba(34, 34, 34, 0.1);
500
+ --qw-sem-effect-shadow-card-color: rgba(34, 34, 34, 0.1);
501
+ --qw-sem-effect-shadow-floating-color: rgba(34, 34, 34, 0.1);
502
+ --qw-sem-effect-shadow-dialog-color: rgba(34, 34, 34, 0.1);
489
503
  --qw-sem-effect-shadow-card: 0px 1px 2px 0px rgba(34, 34, 34, 0.1);
490
504
  --qw-sem-effect-shadow-floating: 0px 4px 12px 0px rgba(34, 34, 34, 0.1);
491
505
  --qw-sem-effect-shadow-dialog: 0px 8px 24px 0px rgba(34, 34, 34, 0.1);
@@ -500,6 +514,7 @@
500
514
  --qw-sem-color-surface-canvas: #121212;
501
515
  --qw-sem-color-surface-sunken: #2D2D2D;
502
516
  --qw-sem-color-surface-selected: rgba(255, 255, 255, 0.1);
517
+ --qw-sem-color-surface-canvas-subtle: #121212;
503
518
  --qw-sem-color-content-primary: #ffffff;
504
519
  --qw-sem-color-content-secondary: #999999;
505
520
  --qw-sem-color-content-tertiary: #666666;
@@ -534,9 +549,13 @@
534
549
  --qw-sem-color-status-info: #266FFF;
535
550
  --qw-sem-color-status-success-subtle: rgba(31, 153, 63, 0.2);
536
551
  --qw-sem-color-status-danger-subtle: rgba(255, 64, 64, 0.2);
552
+ --qw-sem-color-status-info-subtle: rgba(13, 83, 255, 0.2);
537
553
  --qw-sem-color-overlay-scrim: rgba(34, 34, 34, 0.7);
538
554
  --qw-sem-color-overlay-guide: rgba(13, 83, 255, 0.2);
539
555
  --qw-sem-color-shadow: rgba(34, 34, 34, 0.5);
556
+ --qw-sem-effect-shadow-card-color: rgba(34, 34, 34, 0.5);
557
+ --qw-sem-effect-shadow-floating-color: rgba(34, 34, 34, 0.5);
558
+ --qw-sem-effect-shadow-dialog-color: rgba(34, 34, 34, 0.5);
540
559
  --qw-sem-effect-shadow-card: 0px 1px 2px 0px rgba(34, 34, 34, 0.5);
541
560
  --qw-sem-effect-shadow-floating: 0px 4px 12px 0px rgba(34, 34, 34, 0.5);
542
561
  --qw-sem-effect-shadow-dialog: 0px 8px 24px 0px rgba(34, 34, 34, 0.5);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@qw-ui/tokens",
3
- "version": "0.3.0-next.17",
3
+ "version": "0.3.0-next.18",
4
4
  "description": "QW token pipeline: Figma Color variables are the color source of truth; code validates snapshots and builds CSS / TS exits.",
5
5
  "license": "MIT",
6
6
  "author": "qw-ui contributors",