@enovaui/core-tokens 0.8.2 → 0.10.0
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.
- package/CHANGELOG.md +28 -0
- package/css/color-primitive.css +51 -76
- package/css/radius-primitive.css +2 -1
- package/css/spacing-primitive.css +21 -0
- package/css/typography-primitive.css +15 -4
- package/json/color-primitive.json +9 -9
- package/json/radius-primitive.json +2 -1
- package/json/spacing-primitive.json +22 -1
- package/json/typography-primitive.json +12 -0
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,34 @@
|
|
|
2
2
|
|
|
3
3
|
The following is a curated list of changes in the core tokens module, newest changes on the top.
|
|
4
4
|
|
|
5
|
+
## [0.10.0] - 2025-11-20
|
|
6
|
+
|
|
7
|
+
### Added
|
|
8
|
+
|
|
9
|
+
- `primitive-radius-32`
|
|
10
|
+
|
|
11
|
+
## [0.9.0] - 2025-11-07
|
|
12
|
+
|
|
13
|
+
### Removed
|
|
14
|
+
|
|
15
|
+
- `primitive-radius-0`
|
|
16
|
+
|
|
17
|
+
### Changed
|
|
18
|
+
|
|
19
|
+
- `primitive-color-neutral-gray-25` value to `#4a4946`
|
|
20
|
+
- `primitive-color-warm-gray-35` value to `#646464`
|
|
21
|
+
- `primitive-color-warm-gray-85` value to `#f0ece4`
|
|
22
|
+
- `primitive-color-active-red-99` value to `#fef5f5`
|
|
23
|
+
- `primitive-color-yellow-green-35` value to `#316d15`
|
|
24
|
+
- `primitive-color-yellow-green-40` value to `#287d00`
|
|
25
|
+
- `primtivie-color-heritage-red` values to match the latest guide
|
|
26
|
+
|
|
27
|
+
### Added
|
|
28
|
+
|
|
29
|
+
- `primitive-radius-28`
|
|
30
|
+
- `spacing-primitive` values to match the latest guide
|
|
31
|
+
- `typograph-primitive` values to match the latest guide
|
|
32
|
+
|
|
5
33
|
## [0.8.2] - 2025-09-09
|
|
6
34
|
|
|
7
35
|
- No significant changes
|
package/css/color-primitive.css
CHANGED
|
@@ -10,18 +10,17 @@ Primitive Color Tokens
|
|
|
10
10
|
------------------------------------------- */
|
|
11
11
|
|
|
12
12
|
:root {
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
|
|
14
|
+
/* Basic Colors */
|
|
15
15
|
--primitive-color-black: #000000;
|
|
16
16
|
--primitive-color-white: #ffffff;
|
|
17
17
|
|
|
18
|
-
/* Neutral Gray
|
|
19
|
-
--------------------------------------- */
|
|
18
|
+
/* Neutral Gray Colors */
|
|
20
19
|
--primitive-color-neutral-gray-5: #1a1a1a;
|
|
21
20
|
--primitive-color-neutral-gray-10: #262626;
|
|
22
21
|
--primitive-color-neutral-gray-15: #303030;
|
|
23
22
|
--primitive-color-neutral-gray-20: #3b3b3b;
|
|
24
|
-
--primitive-color-neutral-gray-25: #
|
|
23
|
+
--primitive-color-neutral-gray-25: #4a4946;
|
|
25
24
|
--primitive-color-neutral-gray-30: #4f4f4f;
|
|
26
25
|
--primitive-color-neutral-gray-35: #5c5c5c;
|
|
27
26
|
--primitive-color-neutral-gray-40: #696969;
|
|
@@ -38,8 +37,7 @@ Primitive Color Tokens
|
|
|
38
37
|
--primitive-color-neutral-gray-95: #f2f2f2;
|
|
39
38
|
--primitive-color-neutral-gray-99: #fafafa;
|
|
40
39
|
|
|
41
|
-
/* Mist Gray
|
|
42
|
-
--------------------------------------- */
|
|
40
|
+
/* Mist Gray Colors */
|
|
43
41
|
--primitive-color-mist-gray-5: #090909;
|
|
44
42
|
--primitive-color-mist-gray-10: #111111;
|
|
45
43
|
--primitive-color-mist-gray-15: #1f1f1f;
|
|
@@ -61,8 +59,7 @@ Primitive Color Tokens
|
|
|
61
59
|
--primitive-color-mist-gray-95: #eff1f4;
|
|
62
60
|
--primitive-color-mist-gray-99: #f7f8fa;
|
|
63
61
|
|
|
64
|
-
/* Cool Gray
|
|
65
|
-
--------------------------------------- */
|
|
62
|
+
/* Cool Gray Colors */
|
|
66
63
|
--primitive-color-cool-gray-5: #1b1c1f;
|
|
67
64
|
--primitive-color-cool-gray-10: #26282b;
|
|
68
65
|
--primitive-color-cool-gray-15: #393a40;
|
|
@@ -84,8 +81,7 @@ Primitive Color Tokens
|
|
|
84
81
|
--primitive-color-cool-gray-95: #f2f3f5;
|
|
85
82
|
--primitive-color-cool-gray-99: #fcfcfc;
|
|
86
83
|
|
|
87
|
-
/* Blue Gray
|
|
88
|
-
--------------------------------------- */
|
|
84
|
+
/* Blue Gray Colors */
|
|
89
85
|
--primitive-color-blue-gray-5: #080e15;
|
|
90
86
|
--primitive-color-blue-gray-10: #111c2a;
|
|
91
87
|
--primitive-color-blue-gray-15: #1b2735;
|
|
@@ -107,15 +103,14 @@ Primitive Color Tokens
|
|
|
107
103
|
--primitive-color-blue-gray-95: #eef1fb;
|
|
108
104
|
--primitive-color-blue-gray-99: #fcfdff;
|
|
109
105
|
|
|
110
|
-
/* Warm Gray
|
|
111
|
-
--------------------------------------- */
|
|
106
|
+
/* Warm Gray Colors */
|
|
112
107
|
--primitive-color-warm-gray-5: #1a1a1a;
|
|
113
108
|
--primitive-color-warm-gray-10: #262626;
|
|
114
109
|
--primitive-color-warm-gray-15: #333333;
|
|
115
110
|
--primitive-color-warm-gray-20: #3d3d3d;
|
|
116
111
|
--primitive-color-warm-gray-25: #4a4a49;
|
|
117
112
|
--primitive-color-warm-gray-30: #5c5b5a;
|
|
118
|
-
--primitive-color-warm-gray-35: #
|
|
113
|
+
--primitive-color-warm-gray-35: #646464;
|
|
119
114
|
--primitive-color-warm-gray-40: #7e7c77;
|
|
120
115
|
--primitive-color-warm-gray-45: #878580;
|
|
121
116
|
--primitive-color-warm-gray-50: #94928d;
|
|
@@ -125,13 +120,34 @@ Primitive Color Tokens
|
|
|
125
120
|
--primitive-color-warm-gray-70: #cbc8c2;
|
|
126
121
|
--primitive-color-warm-gray-75: #dbd7ce;
|
|
127
122
|
--primitive-color-warm-gray-80: #e6e1d6;
|
|
128
|
-
--primitive-color-warm-gray-85: #
|
|
123
|
+
--primitive-color-warm-gray-85: #f0ece4;
|
|
129
124
|
--primitive-color-warm-gray-90: #f6f3eb;
|
|
130
125
|
--primitive-color-warm-gray-95: #faf9f5;
|
|
131
126
|
--primitive-color-warm-gray-99: #fcf9f6;
|
|
132
127
|
|
|
133
|
-
/*
|
|
134
|
-
|
|
128
|
+
/* Heritage Red Colors */
|
|
129
|
+
--primitive-color-heritage-red-5: #20000c;
|
|
130
|
+
--primitive-color-heritage-red-10: #400017;
|
|
131
|
+
--primitive-color-heritage-red-15: #530021;
|
|
132
|
+
--primitive-color-heritage-red-20: #66002a;
|
|
133
|
+
--primitive-color-heritage-red-25: #84002c;
|
|
134
|
+
--primitive-color-heritage-red-30: #98002f;
|
|
135
|
+
--primitive-color-heritage-red-35: #a50034;
|
|
136
|
+
--primitive-color-heritage-red-40: #c00045;
|
|
137
|
+
--primitive-color-heritage-red-45: #d91757;
|
|
138
|
+
--primitive-color-heritage-red-50: #db3265;
|
|
139
|
+
--primitive-color-heritage-red-55: #ed3f76;
|
|
140
|
+
--primitive-color-heritage-red-60: #fe4e87;
|
|
141
|
+
--primitive-color-heritage-red-65: #ff6997;
|
|
142
|
+
--primitive-color-heritage-red-70: #ff84a6;
|
|
143
|
+
--primitive-color-heritage-red-75: #ffa0b5;
|
|
144
|
+
--primitive-color-heritage-red-80: #ffb1c3;
|
|
145
|
+
--primitive-color-heritage-red-85: #ffc5d2;
|
|
146
|
+
--primitive-color-heritage-red-90: #ffd9e1;
|
|
147
|
+
--primitive-color-heritage-red-95: #ffecef;
|
|
148
|
+
--primitive-color-heritage-red-99: #fffbfe;
|
|
149
|
+
|
|
150
|
+
/* Active Red Colors */
|
|
135
151
|
--primitive-color-active-red-5: #210001;
|
|
136
152
|
--primitive-color-active-red-10: #410002;
|
|
137
153
|
--primitive-color-active-red-15: #550004;
|
|
@@ -151,10 +167,9 @@ Primitive Color Tokens
|
|
|
151
167
|
--primitive-color-active-red-85: #ffcdbf;
|
|
152
168
|
--primitive-color-active-red-90: #ffdad6;
|
|
153
169
|
--primitive-color-active-red-95: #ffedea;
|
|
154
|
-
--primitive-color-active-red-99: #
|
|
170
|
+
--primitive-color-active-red-99: #fef5f5;
|
|
155
171
|
|
|
156
|
-
/* Red Orange
|
|
157
|
-
--------------------------------------- */
|
|
172
|
+
/* Red Orange Colors */
|
|
158
173
|
--primitive-color-red-orange-5: #200200;
|
|
159
174
|
--primitive-color-red-orange-10: #3f0400;
|
|
160
175
|
--primitive-color-red-orange-15: #520700;
|
|
@@ -176,8 +191,7 @@ Primitive Color Tokens
|
|
|
176
191
|
--primitive-color-red-orange-95: #ffede8;
|
|
177
192
|
--primitive-color-red-orange-99: #fffcfb;
|
|
178
193
|
|
|
179
|
-
/* Deep Orange
|
|
180
|
-
--------------------------------------- */
|
|
194
|
+
/* Deep Orange Colors */
|
|
181
195
|
--primitive-color-deep-orange-5: #1a0b06;
|
|
182
196
|
--primitive-color-deep-orange-10: #33160d;
|
|
183
197
|
--primitive-color-deep-orange-15: #4a2114;
|
|
@@ -199,8 +213,7 @@ Primitive Color Tokens
|
|
|
199
213
|
--primitive-color-deep-orange-95: #fff0ec;
|
|
200
214
|
--primitive-color-deep-orange-99: #fffaf9;
|
|
201
215
|
|
|
202
|
-
/* Orange
|
|
203
|
-
--------------------------------------- */
|
|
216
|
+
/* Orange Colors */
|
|
204
217
|
--primitive-color-orange-5: #180a00;
|
|
205
218
|
--primitive-color-orange-10: #301300;
|
|
206
219
|
--primitive-color-orange-15: #401900;
|
|
@@ -222,8 +235,7 @@ Primitive Color Tokens
|
|
|
222
235
|
--primitive-color-orange-95: #ffede0;
|
|
223
236
|
--primitive-color-orange-99: #fffdfb;
|
|
224
237
|
|
|
225
|
-
/* Yellow
|
|
226
|
-
--------------------------------------- */
|
|
238
|
+
/* Yellow Colors */
|
|
227
239
|
--primitive-color-yellow-5: #110d03;
|
|
228
240
|
--primitive-color-yellow-10: #221b06;
|
|
229
241
|
--primitive-color-yellow-15: #301f04;
|
|
@@ -244,17 +256,14 @@ Primitive Color Tokens
|
|
|
244
256
|
--primitive-color-yellow-90: #ffdf8b;
|
|
245
257
|
--primitive-color-yellow-95: #feefca;
|
|
246
258
|
--primitive-color-yellow-99: #fffdf2;
|
|
247
|
-
|
|
248
|
-
/* Yellow Green
|
|
249
|
-
--------------------------------------- */
|
|
250
259
|
--primitive-color-yellow-green-5: #090f06;
|
|
251
260
|
--primitive-color-yellow-green-10: #121f0c;
|
|
252
261
|
--primitive-color-yellow-green-15: #1b2f11;
|
|
253
262
|
--primitive-color-yellow-green-20: #263e17;
|
|
254
263
|
--primitive-color-yellow-green-25: #2d4f1d;
|
|
255
264
|
--primitive-color-yellow-green-30: #375d23;
|
|
256
|
-
--primitive-color-yellow-green-35: #
|
|
257
|
-
--primitive-color-yellow-green-40: #
|
|
265
|
+
--primitive-color-yellow-green-35: #316d15;
|
|
266
|
+
--primitive-color-yellow-green-40: #287d00;
|
|
258
267
|
--primitive-color-yellow-green-45: #529233;
|
|
259
268
|
--primitive-color-yellow-green-50: #5b9a3a;
|
|
260
269
|
--primitive-color-yellow-green-55: #659b40;
|
|
@@ -268,8 +277,7 @@ Primitive Color Tokens
|
|
|
268
277
|
--primitive-color-yellow-green-95: #ddf6cf;
|
|
269
278
|
--primitive-color-yellow-green-99: #fbfff2;
|
|
270
279
|
|
|
271
|
-
/* Green
|
|
272
|
-
--------------------------------------- */
|
|
280
|
+
/* Green Colors */
|
|
273
281
|
--primitive-color-green-5: #03130b;
|
|
274
282
|
--primitive-color-green-10: #062516;
|
|
275
283
|
--primitive-color-green-15: #041e13;
|
|
@@ -291,8 +299,7 @@ Primitive Color Tokens
|
|
|
291
299
|
--primitive-color-green-95: #d9f6e6;
|
|
292
300
|
--primitive-color-green-99: #f2fffe;
|
|
293
301
|
|
|
294
|
-
/* Mint Green
|
|
295
|
-
--------------------------------------- */
|
|
302
|
+
/* Mint Green Colors */
|
|
296
303
|
--primitive-color-mint-green-5: #06130e;
|
|
297
304
|
--primitive-color-mint-green-10: #0c261d;
|
|
298
305
|
--primitive-color-mint-green-15: #101f18;
|
|
@@ -314,8 +321,7 @@ Primitive Color Tokens
|
|
|
314
321
|
--primitive-color-mint-green-95: #ebf8f3;
|
|
315
322
|
--primitive-color-mint-green-99: #f5fcfa;
|
|
316
323
|
|
|
317
|
-
/* Teal Green
|
|
318
|
-
--------------------------------------- */
|
|
324
|
+
/* Teal Green Colors */
|
|
319
325
|
--primitive-color-teal-green-5: #00100e;
|
|
320
326
|
--primitive-color-teal-green-10: #00201d;
|
|
321
327
|
--primitive-color-teal-green-15: #012d28;
|
|
@@ -337,8 +343,7 @@ Primitive Color Tokens
|
|
|
337
343
|
--primitive-color-teal-green-95: #d9f6f2;
|
|
338
344
|
--primitive-color-teal-green-99: #f2fffe;
|
|
339
345
|
|
|
340
|
-
/* Blue Green
|
|
341
|
-
--------------------------------------- */
|
|
346
|
+
/* Blue Green Colors */
|
|
342
347
|
--primitive-color-blue-green-5: #000f14;
|
|
343
348
|
--primitive-color-blue-green-10: #001f28;
|
|
344
349
|
--primitive-color-blue-green-15: #022c36;
|
|
@@ -360,8 +365,7 @@ Primitive Color Tokens
|
|
|
360
365
|
--primitive-color-blue-green-95: #eafaff;
|
|
361
366
|
--primitive-color-blue-green-99: #f9fdff;
|
|
362
367
|
|
|
363
|
-
/* Sky Blue
|
|
364
|
-
--------------------------------------- */
|
|
368
|
+
/* Sky Blue Colors */
|
|
365
369
|
--primitive-color-sky-blue-5: #000e1a;
|
|
366
370
|
--primitive-color-sky-blue-10: #001d34;
|
|
367
371
|
--primitive-color-sky-blue-15: #01253f;
|
|
@@ -383,8 +387,7 @@ Primitive Color Tokens
|
|
|
383
387
|
--primitive-color-sky-blue-95: #e8f2ff;
|
|
384
388
|
--primitive-color-sky-blue-99: #f2faff;
|
|
385
389
|
|
|
386
|
-
/* Cobalt Blue
|
|
387
|
-
--------------------------------------- */
|
|
390
|
+
/* Cobalt Blue Colors */
|
|
388
391
|
--primitive-color-cobalt-blue-5: #11142c;
|
|
389
392
|
--primitive-color-cobalt-blue-10: #232959;
|
|
390
393
|
--primitive-color-cobalt-blue-15: #2c328c;
|
|
@@ -406,8 +409,7 @@ Primitive Color Tokens
|
|
|
406
409
|
--primitive-color-cobalt-blue-95: #eaedff;
|
|
407
410
|
--primitive-color-cobalt-blue-99: #f7f8ff;
|
|
408
411
|
|
|
409
|
-
/* Navy
|
|
410
|
-
--------------------------------------- */
|
|
412
|
+
/* Navy Colors */
|
|
411
413
|
--primitive-color-navy-5: #030d19;
|
|
412
414
|
--primitive-color-navy-10: #051a32;
|
|
413
415
|
--primitive-color-navy-15: #101f3c;
|
|
@@ -429,8 +431,7 @@ Primitive Color Tokens
|
|
|
429
431
|
--primitive-color-navy-95: #e8effe;
|
|
430
432
|
--primitive-color-navy-99: #fcfcff;
|
|
431
433
|
|
|
432
|
-
/* Violet
|
|
433
|
-
--------------------------------------- */
|
|
434
|
+
/* Violet Colors */
|
|
434
435
|
--primitive-color-violet-5: #0e0031;
|
|
435
436
|
--primitive-color-violet-10: #1b0063;
|
|
436
437
|
--primitive-color-violet-15: #260082;
|
|
@@ -452,8 +453,7 @@ Primitive Color Tokens
|
|
|
452
453
|
--primitive-color-violet-95: #f5edff;
|
|
453
454
|
--primitive-color-violet-99: #fdfbff;
|
|
454
455
|
|
|
455
|
-
/* Purple
|
|
456
|
-
--------------------------------------- */
|
|
456
|
+
/* Purple Colors */
|
|
457
457
|
--primitive-color-purple-5: #1b0021;
|
|
458
458
|
--primitive-color-purple-10: #350042;
|
|
459
459
|
--primitive-color-purple-15: #450055;
|
|
@@ -475,31 +475,7 @@ Primitive Color Tokens
|
|
|
475
475
|
--primitive-color-purple-95: #feeafe;
|
|
476
476
|
--primitive-color-purple-99: #fefbff;
|
|
477
477
|
|
|
478
|
-
/*
|
|
479
|
-
--------------------------------------- */
|
|
480
|
-
--primitive-color-heritage-red-5: #20000c;
|
|
481
|
-
--primitive-color-heritage-red-10: #400017;
|
|
482
|
-
--primitive-color-heritage-red-15: #530021;
|
|
483
|
-
--primitive-color-heritage-red-20: #66002a;
|
|
484
|
-
--primitive-color-heritage-red-25: #780034;
|
|
485
|
-
--primitive-color-heritage-red-30: #8f003e;
|
|
486
|
-
--primitive-color-heritage-red-35: #a50034;
|
|
487
|
-
--primitive-color-heritage-red-40: #c60449;
|
|
488
|
-
--primitive-color-heritage-red-45: #d91757;
|
|
489
|
-
--primitive-color-heritage-red-50: #db3265;
|
|
490
|
-
--primitive-color-heritage-red-55: #ed3f76;
|
|
491
|
-
--primitive-color-heritage-red-60: #fe4e87;
|
|
492
|
-
--primitive-color-heritage-red-65: #ff6997;
|
|
493
|
-
--primitive-color-heritage-red-70: #ff84a6;
|
|
494
|
-
--primitive-color-heritage-red-75: #ffa0b5;
|
|
495
|
-
--primitive-color-heritage-red-80: #ffb1c3;
|
|
496
|
-
--primitive-color-heritage-red-85: #ffc5d2;
|
|
497
|
-
--primitive-color-heritage-red-90: #ffd9e1;
|
|
498
|
-
--primitive-color-heritage-red-95: #ffecef;
|
|
499
|
-
--primitive-color-heritage-red-99: #fffbfe;
|
|
500
|
-
|
|
501
|
-
/* Red Brown
|
|
502
|
-
--------------------------------------- */
|
|
478
|
+
/* Red Brown Colors */
|
|
503
479
|
--primitive-color-red-brown-5: #200001;
|
|
504
480
|
--primitive-color-red-brown-10: #410102;
|
|
505
481
|
--primitive-color-red-brown-15: #500d0b;
|
|
@@ -521,8 +497,7 @@ Primitive Color Tokens
|
|
|
521
497
|
--primitive-color-red-brown-95: #ffede9;
|
|
522
498
|
--primitive-color-red-brown-99: #fffbfb;
|
|
523
499
|
|
|
524
|
-
/* Brown
|
|
525
|
-
--------------------------------------- */
|
|
500
|
+
/* Brown Colors */
|
|
526
501
|
--primitive-color-brown-5: #150b07;
|
|
527
502
|
--primitive-color-brown-10: #2b160f;
|
|
528
503
|
--primitive-color-brown-15: #361f18;
|
package/css/radius-primitive.css
CHANGED
|
@@ -10,7 +10,6 @@ Primitive Radius Tokens
|
|
|
10
10
|
------------------------------------------- */
|
|
11
11
|
|
|
12
12
|
:root {
|
|
13
|
-
--primitive-radius-0: 0;
|
|
14
13
|
--primitive-radius-2: 2px;
|
|
15
14
|
--primitive-radius-4: 4px;
|
|
16
15
|
--primitive-radius-6: 6px;
|
|
@@ -20,7 +19,9 @@ Primitive Radius Tokens
|
|
|
20
19
|
--primitive-radius-16: 16px;
|
|
21
20
|
--primitive-radius-20: 20px;
|
|
22
21
|
--primitive-radius-24: 24px;
|
|
22
|
+
--primitive-radius-28: 28px;
|
|
23
23
|
--primitive-radius-30: 30px;
|
|
24
|
+
--primitive-radius-32: 32px;
|
|
24
25
|
--primitive-radius-36: 36px;
|
|
25
26
|
--primitive-radius-40: 40px;
|
|
26
27
|
--primitive-radius-44: 44px;
|
|
@@ -16,6 +16,7 @@ Primitive Spacing Tokens
|
|
|
16
16
|
--primitive-spacing-8: 8px;
|
|
17
17
|
--primitive-spacing-10: 10px;
|
|
18
18
|
--primitive-spacing-12: 12px;
|
|
19
|
+
--primitive-spacing-14: 14px;
|
|
19
20
|
--primitive-spacing-16: 16px;
|
|
20
21
|
--primitive-spacing-18: 18px;
|
|
21
22
|
--primitive-spacing-20: 20px;
|
|
@@ -28,17 +29,37 @@ Primitive Spacing Tokens
|
|
|
28
29
|
--primitive-spacing-42: 42px;
|
|
29
30
|
--primitive-spacing-44: 44px;
|
|
30
31
|
--primitive-spacing-48: 48px;
|
|
32
|
+
--primitive-spacing-50: 50px;
|
|
31
33
|
--primitive-spacing-54: 54px;
|
|
34
|
+
--primitive-spacing-56: 56px;
|
|
32
35
|
--primitive-spacing-60: 60px;
|
|
36
|
+
--primitive-spacing-64: 64px;
|
|
37
|
+
--primitive-spacing-66: 66px;
|
|
33
38
|
--primitive-spacing-72: 72px;
|
|
34
39
|
--primitive-spacing-80: 80px;
|
|
35
40
|
--primitive-spacing-84: 84px;
|
|
36
41
|
--primitive-spacing-90: 90px;
|
|
42
|
+
--primitive-spacing-92: 92px;
|
|
37
43
|
--primitive-spacing-96: 96px;
|
|
44
|
+
--primitive-spacing-100: 100px;
|
|
38
45
|
--primitive-spacing-102: 102px;
|
|
39
46
|
--primitive-spacing-108: 108px;
|
|
40
47
|
--primitive-spacing-120: 120px;
|
|
41
48
|
--primitive-spacing-132: 132px;
|
|
42
49
|
--primitive-spacing-144: 144px;
|
|
43
50
|
--primitive-spacing-156: 156px;
|
|
51
|
+
--primitive-spacing-160: 160px;
|
|
52
|
+
--primitive-spacing-168: 168px;
|
|
53
|
+
--primitive-spacing-180: 180px;
|
|
54
|
+
--primitive-spacing-204: 204px;
|
|
55
|
+
--primitive-spacing-228: 228px;
|
|
56
|
+
--primitive-spacing-240: 240px;
|
|
57
|
+
--primitive-spacing-252: 252px;
|
|
58
|
+
--primitive-spacing-276: 276px;
|
|
59
|
+
--primitive-spacing-300: 300px;
|
|
60
|
+
--primitive-spacing-324: 324px;
|
|
61
|
+
--primitive-spacing-348: 348px;
|
|
62
|
+
--primitive-spacing-372: 372px;
|
|
63
|
+
--primitive-spacing-396: 396px;
|
|
64
|
+
--primitive-spacing-420: 420px;
|
|
44
65
|
}
|
|
@@ -10,8 +10,8 @@ Primitive Typography Tokens
|
|
|
10
10
|
------------------------------------------- */
|
|
11
11
|
|
|
12
12
|
:root {
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
|
|
14
|
+
/* Font Sizes */
|
|
15
15
|
--primitive-font-size-10: 10px;
|
|
16
16
|
--primitive-font-size-11: 11px;
|
|
17
17
|
--primitive-font-size-12: 12px;
|
|
@@ -29,26 +29,37 @@ Primitive Typography Tokens
|
|
|
29
29
|
--primitive-font-size-32: 32px;
|
|
30
30
|
--primitive-font-size-34: 34px;
|
|
31
31
|
--primitive-font-size-36: 36px;
|
|
32
|
+
--primitive-font-size-38: 38px;
|
|
32
33
|
--primitive-font-size-40: 40px;
|
|
33
34
|
--primitive-font-size-42: 42px;
|
|
34
35
|
--primitive-font-size-44: 44px;
|
|
36
|
+
--primitive-font-size-46: 46px;
|
|
35
37
|
--primitive-font-size-48: 48px;
|
|
36
38
|
--primitive-font-size-50: 50px;
|
|
39
|
+
--primitive-font-size-52: 52px;
|
|
37
40
|
--primitive-font-size-54: 54px;
|
|
41
|
+
--primitive-font-size-56: 56px;
|
|
42
|
+
--primitive-font-size-58: 58px;
|
|
38
43
|
--primitive-font-size-60: 60px;
|
|
44
|
+
--primitive-font-size-64: 64px;
|
|
39
45
|
--primitive-font-size-66: 66px;
|
|
46
|
+
--primitive-font-size-68: 68px;
|
|
40
47
|
--primitive-font-size-72: 72px;
|
|
41
48
|
--primitive-font-size-78: 78px;
|
|
49
|
+
--primitive-font-size-80: 80px;
|
|
50
|
+
--primitive-font-size-82: 82px;
|
|
42
51
|
--primitive-font-size-84: 84px;
|
|
43
52
|
--primitive-font-size-90: 90px;
|
|
44
53
|
--primitive-font-size-96: 96px;
|
|
54
|
+
--primitive-font-size-100: 100px;
|
|
45
55
|
--primitive-font-size-102: 102px;
|
|
46
56
|
--primitive-font-size-108: 108px;
|
|
57
|
+
--primitive-font-size-120: 120px;
|
|
58
|
+
--primitive-font-size-140: 140px;
|
|
47
59
|
--primitive-font-size-156: 156px;
|
|
48
60
|
--primitive-font-size-180: 180px;
|
|
49
61
|
|
|
50
|
-
/* Font
|
|
51
|
-
--------------------------------------- */
|
|
62
|
+
/* Font Weights */
|
|
52
63
|
--primitive-font-weight-thin: 100;
|
|
53
64
|
--primitive-font-weight-extralight: 200;
|
|
54
65
|
--primitive-font-weight-light: 300;
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"neutral-gray-10": "#262626",
|
|
8
8
|
"neutral-gray-15": "#303030",
|
|
9
9
|
"neutral-gray-20": "#3b3b3b",
|
|
10
|
-
"neutral-gray-25": "#
|
|
10
|
+
"neutral-gray-25": "#4a4946",
|
|
11
11
|
"neutral-gray-30": "#4f4f4f",
|
|
12
12
|
"neutral-gray-35": "#5c5c5c",
|
|
13
13
|
"neutral-gray-40": "#696969",
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
"warm-gray-20": "#3d3d3d",
|
|
90
90
|
"warm-gray-25": "#4a4a49",
|
|
91
91
|
"warm-gray-30": "#5c5b5a",
|
|
92
|
-
"warm-gray-35": "#
|
|
92
|
+
"warm-gray-35": "#646464",
|
|
93
93
|
"warm-gray-40": "#7e7c77",
|
|
94
94
|
"warm-gray-45": "#878580",
|
|
95
95
|
"warm-gray-50": "#94928d",
|
|
@@ -99,7 +99,7 @@
|
|
|
99
99
|
"warm-gray-70": "#cbc8c2",
|
|
100
100
|
"warm-gray-75": "#dbd7ce",
|
|
101
101
|
"warm-gray-80": "#e6e1d6",
|
|
102
|
-
"warm-gray-85": "#
|
|
102
|
+
"warm-gray-85": "#f0ece4",
|
|
103
103
|
"warm-gray-90": "#f6f3eb",
|
|
104
104
|
"warm-gray-95": "#faf9f5",
|
|
105
105
|
"warm-gray-99": "#fcf9f6",
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
"active-red-85": "#ffcdbf",
|
|
123
123
|
"active-red-90": "#ffdad6",
|
|
124
124
|
"active-red-95": "#ffedea",
|
|
125
|
-
"active-red-99": "#
|
|
125
|
+
"active-red-99": "#fef5f5",
|
|
126
126
|
"red-orange-5": "#200200",
|
|
127
127
|
"red-orange-10": "#3f0400",
|
|
128
128
|
"red-orange-15": "#520700",
|
|
@@ -209,8 +209,8 @@
|
|
|
209
209
|
"yellow-green-20": "#263e17",
|
|
210
210
|
"yellow-green-25": "#2d4f1d",
|
|
211
211
|
"yellow-green-30": "#375d23",
|
|
212
|
-
"yellow-green-35": "#
|
|
213
|
-
"yellow-green-40": "#
|
|
212
|
+
"yellow-green-35": "#316d15",
|
|
213
|
+
"yellow-green-40": "#287d00",
|
|
214
214
|
"yellow-green-45": "#529233",
|
|
215
215
|
"yellow-green-50": "#5b9a3a",
|
|
216
216
|
"yellow-green-55": "#659b40",
|
|
@@ -407,10 +407,10 @@
|
|
|
407
407
|
"heritage-red-10": "#400017",
|
|
408
408
|
"heritage-red-15": "#530021",
|
|
409
409
|
"heritage-red-20": "#66002a",
|
|
410
|
-
"heritage-red-25": "#
|
|
411
|
-
"heritage-red-30": "#
|
|
410
|
+
"heritage-red-25": "#84002c",
|
|
411
|
+
"heritage-red-30": "#98002f",
|
|
412
412
|
"heritage-red-35": "#a50034",
|
|
413
|
-
"heritage-red-40": "#
|
|
413
|
+
"heritage-red-40": "#c00045",
|
|
414
414
|
"heritage-red-45": "#d91757",
|
|
415
415
|
"heritage-red-50": "#db3265",
|
|
416
416
|
"heritage-red-55": "#ed3f76",
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
{
|
|
2
2
|
"primitive": {
|
|
3
|
-
"radius-0": "0",
|
|
4
3
|
"radius-2": "2px",
|
|
5
4
|
"radius-4": "4px",
|
|
6
5
|
"radius-6": "6px",
|
|
@@ -10,7 +9,9 @@
|
|
|
10
9
|
"radius-16": "16px",
|
|
11
10
|
"radius-20": "20px",
|
|
12
11
|
"radius-24": "24px",
|
|
12
|
+
"radius-28": "28px",
|
|
13
13
|
"radius-30": "30px",
|
|
14
|
+
"radius-32": "32px",
|
|
14
15
|
"radius-36": "36px",
|
|
15
16
|
"radius-40": "40px",
|
|
16
17
|
"radius-44": "44px",
|
|
@@ -6,6 +6,7 @@
|
|
|
6
6
|
"spacing-8": "8px",
|
|
7
7
|
"spacing-10": "10px",
|
|
8
8
|
"spacing-12": "12px",
|
|
9
|
+
"spacing-14": "14px",
|
|
9
10
|
"spacing-16": "16px",
|
|
10
11
|
"spacing-18": "18px",
|
|
11
12
|
"spacing-20": "20px",
|
|
@@ -18,18 +19,38 @@
|
|
|
18
19
|
"spacing-42": "42px",
|
|
19
20
|
"spacing-44": "44px",
|
|
20
21
|
"spacing-48": "48px",
|
|
22
|
+
"spacing-50": "50px",
|
|
21
23
|
"spacing-54": "54px",
|
|
24
|
+
"spacing-56": "56px",
|
|
22
25
|
"spacing-60": "60px",
|
|
26
|
+
"spacing-64": "64px",
|
|
27
|
+
"spacing-66": "66px",
|
|
23
28
|
"spacing-72": "72px",
|
|
24
29
|
"spacing-80": "80px",
|
|
25
30
|
"spacing-84": "84px",
|
|
26
31
|
"spacing-90": "90px",
|
|
32
|
+
"spacing-92": "92px",
|
|
27
33
|
"spacing-96": "96px",
|
|
34
|
+
"spacing-100": "100px",
|
|
28
35
|
"spacing-102": "102px",
|
|
29
36
|
"spacing-108": "108px",
|
|
30
37
|
"spacing-120": "120px",
|
|
31
38
|
"spacing-132": "132px",
|
|
32
39
|
"spacing-144": "144px",
|
|
33
|
-
"spacing-156": "156px"
|
|
40
|
+
"spacing-156": "156px",
|
|
41
|
+
"spacing-160": "160px",
|
|
42
|
+
"spacing-168": "168px",
|
|
43
|
+
"spacing-180": "180px",
|
|
44
|
+
"spacing-204": "204px",
|
|
45
|
+
"spacing-228": "228px",
|
|
46
|
+
"spacing-240": "240px",
|
|
47
|
+
"spacing-252": "252px",
|
|
48
|
+
"spacing-276": "276px",
|
|
49
|
+
"spacing-300": "300px",
|
|
50
|
+
"spacing-324": "324px",
|
|
51
|
+
"spacing-348": "348px",
|
|
52
|
+
"spacing-372": "372px",
|
|
53
|
+
"spacing-396": "396px",
|
|
54
|
+
"spacing-420": "420px"
|
|
34
55
|
}
|
|
35
56
|
}
|
|
@@ -17,21 +17,33 @@
|
|
|
17
17
|
"font-size-32": "32px",
|
|
18
18
|
"font-size-34": "34px",
|
|
19
19
|
"font-size-36": "36px",
|
|
20
|
+
"font-size-38": "38px",
|
|
20
21
|
"font-size-40": "40px",
|
|
21
22
|
"font-size-42": "42px",
|
|
22
23
|
"font-size-44": "44px",
|
|
24
|
+
"font-size-46": "46px",
|
|
23
25
|
"font-size-48": "48px",
|
|
24
26
|
"font-size-50": "50px",
|
|
27
|
+
"font-size-52": "52px",
|
|
25
28
|
"font-size-54": "54px",
|
|
29
|
+
"font-size-56": "56px",
|
|
30
|
+
"font-size-58": "58px",
|
|
26
31
|
"font-size-60": "60px",
|
|
32
|
+
"font-size-64": "64px",
|
|
27
33
|
"font-size-66": "66px",
|
|
34
|
+
"font-size-68": "68px",
|
|
28
35
|
"font-size-72": "72px",
|
|
29
36
|
"font-size-78": "78px",
|
|
37
|
+
"font-size-80": "80px",
|
|
38
|
+
"font-size-82": "82px",
|
|
30
39
|
"font-size-84": "84px",
|
|
31
40
|
"font-size-90": "90px",
|
|
32
41
|
"font-size-96": "96px",
|
|
42
|
+
"font-size-100": "100px",
|
|
33
43
|
"font-size-102": "102px",
|
|
34
44
|
"font-size-108": "108px",
|
|
45
|
+
"font-size-120": "120px",
|
|
46
|
+
"font-size-140": "140px",
|
|
35
47
|
"font-size-156": "156px",
|
|
36
48
|
"font-size-180": "180px",
|
|
37
49
|
"font-weight": {
|