@withlayers/tokens 0.20.0 → 0.22.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/dist/index.css +220 -65
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -25,6 +25,7 @@
|
|
|
25
25
|
--l--breakpoint--md: 768px;
|
|
26
26
|
--l--breakpoint--lg: 1040px;
|
|
27
27
|
--l--breakpoint--xl: 1440px;
|
|
28
|
+
--l--color--primary--0: #fff0f6;
|
|
28
29
|
--l--color--primary--10: #ffe3ec;
|
|
29
30
|
--l--color--primary--20: #ffb8d2;
|
|
30
31
|
--l--color--primary--30: #ff8cba;
|
|
@@ -46,6 +47,29 @@
|
|
|
46
47
|
--l--color--neutral--80: #334e68;
|
|
47
48
|
--l--color--neutral--90: #243b53;
|
|
48
49
|
--l--color--neutral--100: #102a43;
|
|
50
|
+
--l--color--neutral--alpha--dark--0: rgba(16, 42, 67, 0);
|
|
51
|
+
--l--color--neutral--alpha--dark--10: rgba(16, 42, 67, 0.1);
|
|
52
|
+
--l--color--neutral--alpha--dark--20: rgba(16, 42, 67, 0.2);
|
|
53
|
+
--l--color--neutral--alpha--dark--30: rgba(16, 42, 67, 0.3);
|
|
54
|
+
--l--color--neutral--alpha--dark--40: rgba(16, 42, 67, 0.4);
|
|
55
|
+
--l--color--neutral--alpha--dark--50: rgba(16, 42, 67, 0.5);
|
|
56
|
+
--l--color--neutral--alpha--dark--60: rgba(16, 42, 67, 0.6);
|
|
57
|
+
--l--color--neutral--alpha--dark--70: rgba(16, 42, 67, 0.7);
|
|
58
|
+
--l--color--neutral--alpha--dark--80: rgba(16, 42, 67, 0.8);
|
|
59
|
+
--l--color--neutral--alpha--dark--90: rgba(16, 42, 67, 0.9);
|
|
60
|
+
--l--color--neutral--alpha--dark--100: rgba(16, 42, 67, 1);
|
|
61
|
+
--l--color--neutral--alpha--light--0: rgba(240, 244, 248, 0);
|
|
62
|
+
--l--color--neutral--alpha--light--10: rgba(240, 244, 248, 0.1);
|
|
63
|
+
--l--color--neutral--alpha--light--20: rgba(240, 244, 248, 0.2);
|
|
64
|
+
--l--color--neutral--alpha--light--30: rgba(240, 244, 248, 0.3);
|
|
65
|
+
--l--color--neutral--alpha--light--40: rgba(240, 244, 248, 0.4);
|
|
66
|
+
--l--color--neutral--alpha--light--50: rgba(240, 244, 248, 0.5);
|
|
67
|
+
--l--color--neutral--alpha--light--60: rgba(240, 244, 248, 0.6);
|
|
68
|
+
--l--color--neutral--alpha--light--70: rgba(240, 244, 248, 0.7);
|
|
69
|
+
--l--color--neutral--alpha--light--80: rgba(240, 244, 248, 0.8);
|
|
70
|
+
--l--color--neutral--alpha--light--90: rgba(240, 244, 248, 0.9);
|
|
71
|
+
--l--color--neutral--alpha--light--100: rgba(240, 244, 248, 1);
|
|
72
|
+
--l--color--red--0: #fff5f5;
|
|
49
73
|
--l--color--red--10: #ffe3e3;
|
|
50
74
|
--l--color--red--20: #ffbdbd;
|
|
51
75
|
--l--color--red--30: #ff9b9b;
|
|
@@ -56,6 +80,7 @@
|
|
|
56
80
|
--l--color--red--80: #ab091e;
|
|
57
81
|
--l--color--red--90: #8a041a;
|
|
58
82
|
--l--color--red--100: #610316;
|
|
83
|
+
--l--color--blue--0: #f5fbff;
|
|
59
84
|
--l--color--blue--10: #ebf8ff;
|
|
60
85
|
--l--color--blue--20: #d1eefc;
|
|
61
86
|
--l--color--blue--30: #a7d8f0;
|
|
@@ -66,6 +91,7 @@
|
|
|
66
91
|
--l--color--blue--80: #1d6f98;
|
|
67
92
|
--l--color--blue--90: #166086;
|
|
68
93
|
--l--color--blue--100: #0b4f71;
|
|
94
|
+
--l--color--green--0: #f6fef9;
|
|
69
95
|
--l--color--green--10: #effcf6;
|
|
70
96
|
--l--color--green--20: #c6f7e2;
|
|
71
97
|
--l--color--green--30: #8eedc7;
|
|
@@ -76,6 +102,7 @@
|
|
|
76
102
|
--l--color--green--80: #147d64;
|
|
77
103
|
--l--color--green--90: #0c6b58;
|
|
78
104
|
--l--color--green--100: #014d40;
|
|
105
|
+
--l--color--yellow--0: #fffdf5;
|
|
79
106
|
--l--color--yellow--10: #fffbeb;
|
|
80
107
|
--l--color--yellow--20: #fff3c4;
|
|
81
108
|
--l--color--yellow--30: #fce588;
|
|
@@ -86,28 +113,6 @@
|
|
|
86
113
|
--l--color--yellow--80: #cb6e17;
|
|
87
114
|
--l--color--yellow--90: #b44d12;
|
|
88
115
|
--l--color--yellow--100: #8d2b0b;
|
|
89
|
-
--l--color--dark-alpha--0: rgba(0, 0, 0, 0);
|
|
90
|
-
--l--color--dark-alpha--10: rgba(0, 0, 0, 0.1);
|
|
91
|
-
--l--color--dark-alpha--20: rgba(0, 0, 0, 0.2);
|
|
92
|
-
--l--color--dark-alpha--30: rgba(0, 0, 0, 0.3);
|
|
93
|
-
--l--color--dark-alpha--40: rgba(0, 0, 0, 0.4);
|
|
94
|
-
--l--color--dark-alpha--50: rgba(0, 0, 0, 0.5);
|
|
95
|
-
--l--color--dark-alpha--60: rgba(0, 0, 0, 0.6);
|
|
96
|
-
--l--color--dark-alpha--70: rgba(0, 0, 0, 0.7);
|
|
97
|
-
--l--color--dark-alpha--80: rgba(0, 0, 0, 0.8);
|
|
98
|
-
--l--color--dark-alpha--90: rgba(0, 0, 0, 0.9);
|
|
99
|
-
--l--color--dark-alpha--100: rgba(0, 0, 0, 1);
|
|
100
|
-
--l--color--light-alpha--0: rgba(255, 255, 255, 0);
|
|
101
|
-
--l--color--light-alpha--10: rgba(255, 255, 255, 0.1);
|
|
102
|
-
--l--color--light-alpha--20: rgba(255, 255, 255, 0.2);
|
|
103
|
-
--l--color--light-alpha--30: rgba(255, 255, 255, 0.3);
|
|
104
|
-
--l--color--light-alpha--40: rgba(255, 255, 255, 0.4);
|
|
105
|
-
--l--color--light-alpha--50: rgba(255, 255, 255, 0.5);
|
|
106
|
-
--l--color--light-alpha--60: rgba(255, 255, 255, 0.6);
|
|
107
|
-
--l--color--light-alpha--70: rgba(255, 255, 255, 0.7);
|
|
108
|
-
--l--color--light-alpha--80: rgba(255, 255, 255, 0.8);
|
|
109
|
-
--l--color--light-alpha--90: rgba(255, 255, 255, 0.9);
|
|
110
|
-
--l--color--light-alpha--100: rgba(255, 255, 255, 1);
|
|
111
116
|
--l--typography--font-family--primary: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times, Source Serif Pro, serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
|
|
112
117
|
--l--typography--font-family--secondary: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
|
|
113
118
|
--l--typography--font-family--monospace: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace;
|
|
@@ -241,41 +246,57 @@
|
|
|
241
246
|
--l--theme--border--dialog--style: var(--l--border--style--none);
|
|
242
247
|
--l--theme--border--text-highlight--style: var(--l--border--style--none);
|
|
243
248
|
--l--theme--color--background--default: var(--l--color--neutral--0);
|
|
249
|
+
--l--theme--color--background--knockout: var(--l--color--neutral--90);
|
|
244
250
|
--l--theme--color--border--primary--on-default: var(--l--color--neutral--60);
|
|
251
|
+
--l--theme--color--border--primary--on-knockout: var(--l--color--neutral--40);
|
|
245
252
|
--l--theme--color--border--secondary--on-default: var(--l--color--neutral--20);
|
|
253
|
+
--l--theme--color--border--secondary--on-knockout: var(--l--color--neutral--70);
|
|
246
254
|
--l--theme--color--content--primary--on-default: var(--l--color--neutral--90);
|
|
255
|
+
--l--theme--color--content--primary--on-knockout: var(--l--color--neutral--0);
|
|
247
256
|
--l--theme--color--content--secondary--on-default: var(--l--color--neutral--60);
|
|
257
|
+
--l--theme--color--content--secondary--on-knockout: var(--l--color--neutral--30);
|
|
248
258
|
--l--theme--color--outline--on-default: var(--l--color--neutral--90);
|
|
249
|
-
--l--theme--color--
|
|
259
|
+
--l--theme--color--outline--on-knockout: var(--l--color--neutral--0);
|
|
260
|
+
--l--theme--color--overlay--on-default: var(--l--color--neutral--alpha--dark--70);
|
|
261
|
+
--l--theme--color--overlay--on-knockout: var(--l--color--neutral--alpha--dark--70);
|
|
250
262
|
--l--theme--color--code--background--on-default: var(--l--color--neutral--10);
|
|
263
|
+
--l--theme--color--code--background--on-knockout: var(--l--color--neutral--80);
|
|
251
264
|
--l--theme--color--code--content--on-default: var(--l--color--neutral--90);
|
|
252
|
-
--l--theme--color--
|
|
265
|
+
--l--theme--color--code--content--on-knockout: var(--l--color--neutral--0);
|
|
266
|
+
--l--theme--color--dialog--border--on-default: var(--l--color--neutral--alpha--dark--0);
|
|
267
|
+
--l--theme--color--dialog--border--on-knockout: var(--l--color--neutral--alpha--light--0);
|
|
253
268
|
--l--theme--color--feedback--background--destructive--on-default: var(--l--color--red--20);
|
|
269
|
+
--l--theme--color--feedback--background--destructive--on-knockout: var(--l--color--red--90);
|
|
254
270
|
--l--theme--color--feedback--background--informative--on-default: var(--l--color--blue--20);
|
|
271
|
+
--l--theme--color--feedback--background--informative--on-knockout: var(--l--color--blue--90);
|
|
255
272
|
--l--theme--color--feedback--background--positive--on-default: var(--l--color--green--20);
|
|
273
|
+
--l--theme--color--feedback--background--positive--on-knockout: var(--l--color--green--90);
|
|
256
274
|
--l--theme--color--feedback--background--warning--on-default: var(--l--color--yellow--20);
|
|
275
|
+
--l--theme--color--feedback--background--warning--on-knockout: var(--l--color--yellow--90);
|
|
257
276
|
--l--theme--color--feedback--border--destructive--on-default: var(--l--color--red--30);
|
|
277
|
+
--l--theme--color--feedback--border--destructive--on-knockout: var(--l--color--red--70);
|
|
258
278
|
--l--theme--color--feedback--border--informative--on-default: var(--l--color--blue--30);
|
|
279
|
+
--l--theme--color--feedback--border--informative--on-knockout: var(--l--color--blue--70);
|
|
259
280
|
--l--theme--color--feedback--border--positive--on-default: var(--l--color--green--30);
|
|
281
|
+
--l--theme--color--feedback--border--positive--on-knockout: var(--l--color--green--70);
|
|
260
282
|
--l--theme--color--feedback--border--warning--on-default: var(--l--color--yellow--30);
|
|
261
|
-
--l--theme--color--feedback--
|
|
262
|
-
--l--theme--color--feedback--content--destructive--on-
|
|
263
|
-
--l--theme--color--feedback--content--
|
|
264
|
-
--l--theme--color--feedback--content--informative--on-
|
|
265
|
-
--l--theme--color--feedback--content--
|
|
266
|
-
--l--theme--color--feedback--content--positive--on-
|
|
267
|
-
--l--theme--color--feedback--content--
|
|
268
|
-
--l--theme--color--feedback--content--warning--on-
|
|
269
|
-
--l--theme--color--feedback--
|
|
270
|
-
--l--theme--color--feedback--outline--destructive--on-
|
|
271
|
-
--l--theme--color--feedback--outline--
|
|
272
|
-
--l--theme--color--feedback--outline--informative--on-
|
|
273
|
-
--l--theme--color--feedback--outline--
|
|
274
|
-
--l--theme--color--feedback--outline--positive--on-
|
|
275
|
-
--l--theme--color--feedback--outline--
|
|
276
|
-
--l--theme--color--feedback--outline--warning--on-
|
|
277
|
-
--l--theme--color--
|
|
278
|
-
--l--theme--color--interactive--background--on-default--focus: var(--l--color--neutral--0);
|
|
283
|
+
--l--theme--color--feedback--border--warning--on-knockout: var(--l--color--yellow--70);
|
|
284
|
+
--l--theme--color--feedback--content--destructive--on-default: var(--l--color--red--90);
|
|
285
|
+
--l--theme--color--feedback--content--destructive--on-knockout: var(--l--color--red--0);
|
|
286
|
+
--l--theme--color--feedback--content--informative--on-default: var(--l--color--blue--90);
|
|
287
|
+
--l--theme--color--feedback--content--informative--on-knockout: var(--l--color--blue--0);
|
|
288
|
+
--l--theme--color--feedback--content--positive--on-default: var(--l--color--green--90);
|
|
289
|
+
--l--theme--color--feedback--content--positive--on-knockout: var(--l--color--green--0);
|
|
290
|
+
--l--theme--color--feedback--content--warning--on-default: var(--l--color--yellow--90);
|
|
291
|
+
--l--theme--color--feedback--content--warning--on-knockout: var(--l--color--yellow--0);
|
|
292
|
+
--l--theme--color--feedback--outline--destructive--on-default: var(--l--color--red--90);
|
|
293
|
+
--l--theme--color--feedback--outline--destructive--on-knockout: var(--l--color--red--10);
|
|
294
|
+
--l--theme--color--feedback--outline--informative--on-default: var(--l--color--blue--90);
|
|
295
|
+
--l--theme--color--feedback--outline--informative--on-knockout: var(--l--color--blue--10);
|
|
296
|
+
--l--theme--color--feedback--outline--positive--on-default: var(--l--color--green--90);
|
|
297
|
+
--l--theme--color--feedback--outline--positive--on-knockout: var(--l--color--green--10);
|
|
298
|
+
--l--theme--color--feedback--outline--warning--on-default: var(--l--color--yellow--90);
|
|
299
|
+
--l--theme--color--feedback--outline--warning--on-knockout: var(--l--color--yellow--10);
|
|
279
300
|
--l--theme--color--interactive--background--on-default--hover: var(--l--color--neutral--10);
|
|
280
301
|
--l--theme--color--interactive--background--on-default--checked--rest: var(--l--color--neutral--90);
|
|
281
302
|
--l--theme--color--interactive--background--on-default--checked--focus: var(--l--color--neutral--90);
|
|
@@ -283,30 +304,50 @@
|
|
|
283
304
|
--l--theme--color--interactive--background--on-default--checked--invalid--rest: var(--l--color--red--70);
|
|
284
305
|
--l--theme--color--interactive--background--on-default--checked--invalid--focus: var(--l--color--red--70);
|
|
285
306
|
--l--theme--color--interactive--background--on-default--checked--invalid--hover: var(--l--color--red--60);
|
|
286
|
-
--l--theme--color--interactive--background--on-default--invalid--
|
|
287
|
-
--l--theme--color--interactive--background--on-default--invalid--hover: var(--l--color--red--10);
|
|
288
|
-
--l--theme--color--interactive--background--on-default--invalid--focus: var(--l--color--red--10);
|
|
307
|
+
--l--theme--color--interactive--background--on-default--invalid--hover: var(--l--color--neutral--10);
|
|
289
308
|
--l--theme--color--interactive--background--on-default--disabled: var(--l--color--neutral--10);
|
|
290
|
-
--l--theme--color--interactive--
|
|
291
|
-
--l--theme--color--interactive--
|
|
292
|
-
--l--theme--color--interactive--
|
|
309
|
+
--l--theme--color--interactive--background--on-knockout--hover: var(--l--color--neutral--80);
|
|
310
|
+
--l--theme--color--interactive--background--on-knockout--checked--rest: var(--l--color--neutral--0);
|
|
311
|
+
--l--theme--color--interactive--background--on-knockout--checked--focus: var(--l--color--neutral--0);
|
|
312
|
+
--l--theme--color--interactive--background--on-knockout--checked--hover: var(--l--color--neutral--10);
|
|
313
|
+
--l--theme--color--interactive--background--on-knockout--checked--invalid--rest: var(--l--color--red--30);
|
|
314
|
+
--l--theme--color--interactive--background--on-knockout--checked--invalid--focus: var(--l--color--red--30);
|
|
315
|
+
--l--theme--color--interactive--background--on-knockout--checked--invalid--hover: var(--l--color--red--40);
|
|
316
|
+
--l--theme--color--interactive--background--on-knockout--invalid--hover: var(--l--color--neutral--80);
|
|
317
|
+
--l--theme--color--interactive--background--on-knockout--disabled: var(--l--color--neutral--80);
|
|
318
|
+
--l--theme--color--interactive--border--on-default--rest: var(--l--color--neutral--70);
|
|
319
|
+
--l--theme--color--interactive--border--on-default--focus: var(--l--color--neutral--70);
|
|
320
|
+
--l--theme--color--interactive--border--on-default--hover: var(--l--color--neutral--80);
|
|
293
321
|
--l--theme--color--interactive--border--on-default--checked--rest: var(--l--color--neutral--90);
|
|
294
322
|
--l--theme--color--interactive--border--on-default--checked--focus: var(--l--color--neutral--90);
|
|
295
323
|
--l--theme--color--interactive--border--on-default--checked--hover: var(--l--color--neutral--80);
|
|
296
324
|
--l--theme--color--interactive--border--on-default--checked--invalid--rest: var(--l--color--red--70);
|
|
297
325
|
--l--theme--color--interactive--border--on-default--checked--invalid--focus: var(--l--color--red--70);
|
|
298
326
|
--l--theme--color--interactive--border--on-default--checked--invalid--hover: var(--l--color--red--60);
|
|
299
|
-
--l--theme--color--interactive--border--on-default--invalid--rest: var(--l--color--red--
|
|
300
|
-
--l--theme--color--interactive--border--on-default--invalid--focus: var(--l--color--red--
|
|
327
|
+
--l--theme--color--interactive--border--on-default--invalid--rest: var(--l--color--red--60);
|
|
328
|
+
--l--theme--color--interactive--border--on-default--invalid--focus: var(--l--color--red--60);
|
|
301
329
|
--l--theme--color--interactive--border--on-default--invalid--hover: var(--l--color--red--70);
|
|
302
330
|
--l--theme--color--interactive--border--on-default--disabled: var(--l--color--neutral--20);
|
|
331
|
+
--l--theme--color--interactive--border--on-knockout--rest: var(--l--color--neutral--30);
|
|
332
|
+
--l--theme--color--interactive--border--on-knockout--focus: var(--l--color--neutral--30);
|
|
333
|
+
--l--theme--color--interactive--border--on-knockout--hover: var(--l--color--neutral--40);
|
|
334
|
+
--l--theme--color--interactive--border--on-knockout--checked--rest: var(--l--color--neutral--0);
|
|
335
|
+
--l--theme--color--interactive--border--on-knockout--checked--focus: var(--l--color--neutral--0);
|
|
336
|
+
--l--theme--color--interactive--border--on-knockout--checked--hover: var(--l--color--neutral--10);
|
|
337
|
+
--l--theme--color--interactive--border--on-knockout--checked--invalid--rest: var(--l--color--red--30);
|
|
338
|
+
--l--theme--color--interactive--border--on-knockout--checked--invalid--focus: var(--l--color--red--30);
|
|
339
|
+
--l--theme--color--interactive--border--on-knockout--checked--invalid--hover: var(--l--color--red--40);
|
|
340
|
+
--l--theme--color--interactive--border--on-knockout--invalid--rest: var(--l--color--red--30);
|
|
341
|
+
--l--theme--color--interactive--border--on-knockout--invalid--focus: var(--l--color--red--30);
|
|
342
|
+
--l--theme--color--interactive--border--on-knockout--invalid--hover: var(--l--color--red--40);
|
|
343
|
+
--l--theme--color--interactive--border--on-knockout--disabled: var(--l--color--neutral--70);
|
|
303
344
|
--l--theme--color--interactive--content--on-default--rest: var(--l--color--neutral--90);
|
|
304
345
|
--l--theme--color--interactive--content--on-default--hover: var(--l--color--neutral--90);
|
|
305
346
|
--l--theme--color--interactive--content--on-default--focus: var(--l--color--neutral--90);
|
|
306
347
|
--l--theme--color--interactive--content--on-default--disabled: var(--l--color--neutral--40);
|
|
307
|
-
--l--theme--color--interactive--content--on-default--invalid--rest: var(--l--color--
|
|
308
|
-
--l--theme--color--interactive--content--on-default--invalid--hover: var(--l--color--
|
|
309
|
-
--l--theme--color--interactive--content--on-default--invalid--focus: var(--l--color--
|
|
348
|
+
--l--theme--color--interactive--content--on-default--invalid--rest: var(--l--color--neutral--90);
|
|
349
|
+
--l--theme--color--interactive--content--on-default--invalid--hover: var(--l--color--neutral--90);
|
|
350
|
+
--l--theme--color--interactive--content--on-default--invalid--focus: var(--l--color--neutral--90);
|
|
310
351
|
--l--theme--color--interactive--content--on-default--checked--rest: var(--l--color--neutral--10);
|
|
311
352
|
--l--theme--color--interactive--content--on-default--checked--hover: var(--l--color--neutral--10);
|
|
312
353
|
--l--theme--color--interactive--content--on-default--checked--focus: var(--l--color--neutral--10);
|
|
@@ -314,30 +355,68 @@
|
|
|
314
355
|
--l--theme--color--interactive--content--on-default--checked--invalid--rest: var(--l--color--neutral--0);
|
|
315
356
|
--l--theme--color--interactive--content--on-default--checked--invalid--hover: var(--l--color--neutral--0);
|
|
316
357
|
--l--theme--color--interactive--content--on-default--checked--invalid--focus: var(--l--color--neutral--0);
|
|
358
|
+
--l--theme--color--interactive--content--on-knockout--rest: var(--l--color--neutral--0);
|
|
359
|
+
--l--theme--color--interactive--content--on-knockout--hover: var(--l--color--neutral--0);
|
|
360
|
+
--l--theme--color--interactive--content--on-knockout--focus: var(--l--color--neutral--0);
|
|
361
|
+
--l--theme--color--interactive--content--on-knockout--disabled: var(--l--color--neutral--50);
|
|
362
|
+
--l--theme--color--interactive--content--on-knockout--invalid--rest: var(--l--color--neutral--0);
|
|
363
|
+
--l--theme--color--interactive--content--on-knockout--invalid--hover: var(--l--color--neutral--0);
|
|
364
|
+
--l--theme--color--interactive--content--on-knockout--invalid--focus: var(--l--color--neutral--0);
|
|
365
|
+
--l--theme--color--interactive--content--on-knockout--checked--rest: var(--l--color--neutral--90);
|
|
366
|
+
--l--theme--color--interactive--content--on-knockout--checked--hover: var(--l--color--neutral--90);
|
|
367
|
+
--l--theme--color--interactive--content--on-knockout--checked--focus: var(--l--color--neutral--90);
|
|
368
|
+
--l--theme--color--interactive--content--on-knockout--checked--disabled: var(--l--color--neutral--50);
|
|
369
|
+
--l--theme--color--interactive--content--on-knockout--checked--invalid--rest: var(--l--color--neutral--90);
|
|
370
|
+
--l--theme--color--interactive--content--on-knockout--checked--invalid--hover: var(--l--color--neutral--90);
|
|
371
|
+
--l--theme--color--interactive--content--on-knockout--checked--invalid--focus: var(--l--color--neutral--90);
|
|
317
372
|
--l--theme--color--interactive--placeholder--on-default--rest: var(--l--color--neutral--60);
|
|
318
373
|
--l--theme--color--interactive--placeholder--on-default--hover: var(--l--color--neutral--60);
|
|
319
374
|
--l--theme--color--interactive--placeholder--on-default--focus: var(--l--color--neutral--60);
|
|
320
375
|
--l--theme--color--interactive--placeholder--on-default--disabled: var(--l--color--neutral--40);
|
|
321
|
-
--l--theme--color--interactive--placeholder--on-default--invalid--rest: var(--l--color--
|
|
322
|
-
--l--theme--color--interactive--placeholder--on-default--invalid--hover: var(--l--color--
|
|
323
|
-
--l--theme--color--interactive--placeholder--on-default--invalid--focus: var(--l--color--
|
|
376
|
+
--l--theme--color--interactive--placeholder--on-default--invalid--rest: var(--l--color--neutral--60);
|
|
377
|
+
--l--theme--color--interactive--placeholder--on-default--invalid--hover: var(--l--color--neutral--60);
|
|
378
|
+
--l--theme--color--interactive--placeholder--on-default--invalid--focus: var(--l--color--neutral--60);
|
|
379
|
+
--l--theme--color--interactive--placeholder--on-knockout--rest: var(--l--color--neutral--30);
|
|
380
|
+
--l--theme--color--interactive--placeholder--on-knockout--hover: var(--l--color--neutral--30);
|
|
381
|
+
--l--theme--color--interactive--placeholder--on-knockout--focus: var(--l--color--neutral--30);
|
|
382
|
+
--l--theme--color--interactive--placeholder--on-knockout--disabled: var(--l--color--neutral--50);
|
|
383
|
+
--l--theme--color--interactive--placeholder--on-knockout--invalid--rest: var(--l--color--neutral--30);
|
|
384
|
+
--l--theme--color--interactive--placeholder--on-knockout--invalid--hover: var(--l--color--neutral--30);
|
|
385
|
+
--l--theme--color--interactive--placeholder--on-knockout--invalid--focus: var(--l--color--neutral--30);
|
|
324
386
|
--l--theme--color--link--content--primary--on-default--rest: var(--l--color--primary--80);
|
|
325
387
|
--l--theme--color--link--content--primary--on-default--hover: var(--l--color--primary--60);
|
|
326
388
|
--l--theme--color--link--content--primary--on-default--focus: var(--l--color--primary--60);
|
|
327
389
|
--l--theme--color--link--content--primary--on-default--active: var(--l--color--primary--60);
|
|
328
390
|
--l--theme--color--link--content--primary--on-default--visited: var(--l--color--primary--80);
|
|
329
|
-
--l--theme--color--link--content--
|
|
391
|
+
--l--theme--color--link--content--primary--on-knockout--rest: var(--l--color--primary--30);
|
|
392
|
+
--l--theme--color--link--content--primary--on-knockout--hover: var(--l--color--primary--20);
|
|
393
|
+
--l--theme--color--link--content--primary--on-knockout--focus: var(--l--color--primary--20);
|
|
394
|
+
--l--theme--color--link--content--primary--on-knockout--active: var(--l--color--primary--20);
|
|
395
|
+
--l--theme--color--link--content--primary--on-knockout--visited: var(--l--color--primary--30);
|
|
330
396
|
--l--theme--color--link--content--secondary--on-default--hover: var(--l--color--neutral--60);
|
|
331
397
|
--l--theme--color--link--content--secondary--on-default--focus: var(--l--color--neutral--60);
|
|
332
398
|
--l--theme--color--link--content--secondary--on-default--active: var(--l--color--neutral--60);
|
|
333
|
-
--l--theme--color--link--content--secondary--on-
|
|
334
|
-
--l--theme--color--link--content--
|
|
399
|
+
--l--theme--color--link--content--secondary--on-knockout--hover: var(--l--color--neutral--30);
|
|
400
|
+
--l--theme--color--link--content--secondary--on-knockout--focus: var(--l--color--neutral--30);
|
|
401
|
+
--l--theme--color--link--content--secondary--on-knockout--active: var(--l--color--neutral--30);
|
|
335
402
|
--l--theme--color--link--content--tertiary--on-default--hover: var(--l--color--neutral--90);
|
|
336
|
-
--l--theme--color--link--content--tertiary--on-default--focus: var(--l--color--neutral--
|
|
403
|
+
--l--theme--color--link--content--tertiary--on-default--focus: var(--l--color--neutral--90);
|
|
337
404
|
--l--theme--color--link--content--tertiary--on-default--active: var(--l--color--neutral--90);
|
|
338
|
-
--l--theme--color--link--content--tertiary--on-
|
|
405
|
+
--l--theme--color--link--content--tertiary--on-knockout--hover: var(--l--color--neutral--0);
|
|
406
|
+
--l--theme--color--link--content--tertiary--on-knockout--focus: var(--l--color--neutral--0);
|
|
407
|
+
--l--theme--color--link--content--tertiary--on-knockout--active: var(--l--color--neutral--0);
|
|
408
|
+
--l--theme--color--messaging--content--destructive--on-default: var(--l--color--red--80);
|
|
409
|
+
--l--theme--color--messaging--content--destructive--on-knockout: var(--l--color--red--30);
|
|
410
|
+
--l--theme--color--messaging--content--informative--on-default: var(--l--color--blue--80);
|
|
411
|
+
--l--theme--color--messaging--content--informative--on-knockout: var(--l--color--blue--30);
|
|
412
|
+
--l--theme--color--messaging--content--positive--on-default: var(--l--color--green--80);
|
|
413
|
+
--l--theme--color--messaging--content--positive--on-knockout: var(--l--color--green--30);
|
|
414
|
+
--l--theme--color--messaging--content--warning--on-default: var(--l--color--yellow--90);
|
|
415
|
+
--l--theme--color--messaging--content--warning--on-knockout: var(--l--color--yellow--30);
|
|
339
416
|
--l--theme--color--selection--background--on-default: var(--l--color--neutral--90);
|
|
417
|
+
--l--theme--color--selection--background--on-knockout: var(--l--color--neutral--0);
|
|
340
418
|
--l--theme--color--selection--content--on-default: var(--l--color--neutral--10);
|
|
419
|
+
--l--theme--color--selection--content--on-knockout: var(--l--color--neutral--90);
|
|
341
420
|
--l--typography--text-decoration-thickness--sm: var(--l--units--1);
|
|
342
421
|
--l--typography--text-decoration-thickness--md: var(--l--units--2);
|
|
343
422
|
--l--typography--text-decoration-thickness--lg: var(--l--units--4);
|
|
@@ -548,61 +627,121 @@
|
|
|
548
627
|
--l--theme--button--color--background--primary--on-default--disabled: var(--l--color--neutral--80);
|
|
549
628
|
--l--theme--button--color--background--primary--on-default--focus: var(--l--color--neutral--100);
|
|
550
629
|
--l--theme--button--color--background--primary--on-default--hover: var(--l--color--neutral--80);
|
|
551
|
-
--l--theme--button--color--background--
|
|
552
|
-
--l--theme--button--color--background--
|
|
553
|
-
--l--theme--button--color--background--
|
|
630
|
+
--l--theme--button--color--background--primary--on-knockout--rest: var(--l--color--neutral--0);
|
|
631
|
+
--l--theme--button--color--background--primary--on-knockout--active: var(--l--color--neutral--10);
|
|
632
|
+
--l--theme--button--color--background--primary--on-knockout--disabled: var(--l--color--neutral--10);
|
|
633
|
+
--l--theme--button--color--background--primary--on-knockout--focus: var(--l--color--neutral--0);
|
|
634
|
+
--l--theme--button--color--background--primary--on-knockout--hover: var(--l--color--neutral--10);
|
|
635
|
+
--l--theme--button--color--background--secondary--on-default--rest: var(--l--color--neutral--alpha--dark--0);
|
|
636
|
+
--l--theme--button--color--background--secondary--on-default--active: var(--l--color--neutral--alpha--dark--10);
|
|
637
|
+
--l--theme--button--color--background--secondary--on-default--disabled: var(--l--color--neutral--alpha--dark--0);
|
|
554
638
|
--l--theme--button--color--background--secondary--on-default--focus: var(--l--color--neutral--0);
|
|
555
|
-
--l--theme--button--color--background--secondary--on-default--hover: var(--l--color--
|
|
639
|
+
--l--theme--button--color--background--secondary--on-default--hover: var(--l--color--neutral--alpha--dark--10);
|
|
640
|
+
--l--theme--button--color--background--secondary--on-knockout--rest: var(--l--color--neutral--alpha--light--0);
|
|
641
|
+
--l--theme--button--color--background--secondary--on-knockout--active: var(--l--color--neutral--alpha--light--10);
|
|
642
|
+
--l--theme--button--color--background--secondary--on-knockout--disabled: var(--l--color--neutral--alpha--light--0);
|
|
643
|
+
--l--theme--button--color--background--secondary--on-knockout--focus: var(--l--color--neutral--90);
|
|
644
|
+
--l--theme--button--color--background--secondary--on-knockout--hover: var(--l--color--neutral--alpha--light--10);
|
|
556
645
|
--l--theme--button--color--background--tertiary--on-default--rest: var(--l--color--neutral--10);
|
|
557
646
|
--l--theme--button--color--background--tertiary--on-default--active: var(--l--color--neutral--20);
|
|
558
647
|
--l--theme--button--color--background--tertiary--on-default--disabled: var(--l--color--neutral--10);
|
|
559
648
|
--l--theme--button--color--background--tertiary--on-default--focus: var(--l--color--neutral--20);
|
|
560
649
|
--l--theme--button--color--background--tertiary--on-default--hover: var(--l--color--neutral--20);
|
|
650
|
+
--l--theme--button--color--background--tertiary--on-knockout--rest: var(--l--color--neutral--80);
|
|
651
|
+
--l--theme--button--color--background--tertiary--on-knockout--active: var(--l--color--neutral--70);
|
|
652
|
+
--l--theme--button--color--background--tertiary--on-knockout--disabled: var(--l--color--neutral--80);
|
|
653
|
+
--l--theme--button--color--background--tertiary--on-knockout--focus: var(--l--color--neutral--70);
|
|
654
|
+
--l--theme--button--color--background--tertiary--on-knockout--hover: var(--l--color--neutral--70);
|
|
561
655
|
--l--theme--button--color--background--destructive--on-default--rest: var(--l--color--red--70);
|
|
562
656
|
--l--theme--button--color--background--destructive--on-default--active: var(--l--color--red--60);
|
|
563
657
|
--l--theme--button--color--background--destructive--on-default--disabled: var(--l--color--red--40);
|
|
564
658
|
--l--theme--button--color--background--destructive--on-default--focus: var(--l--color--red--70);
|
|
565
659
|
--l--theme--button--color--background--destructive--on-default--hover: var(--l--color--red--60);
|
|
660
|
+
--l--theme--button--color--background--destructive--on-knockout--rest: var(--l--color--red--30);
|
|
661
|
+
--l--theme--button--color--background--destructive--on-knockout--active: var(--l--color--red--40);
|
|
662
|
+
--l--theme--button--color--background--destructive--on-knockout--disabled: var(--l--color--red--50);
|
|
663
|
+
--l--theme--button--color--background--destructive--on-knockout--focus: var(--l--color--red--30);
|
|
664
|
+
--l--theme--button--color--background--destructive--on-knockout--hover: var(--l--color--red--40);
|
|
566
665
|
--l--theme--button--color--border--primary--on-default--rest: var(--l--color--neutral--100);
|
|
567
666
|
--l--theme--button--color--border--primary--on-default--active: var(--l--color--neutral--80);
|
|
568
667
|
--l--theme--button--color--border--primary--on-default--disabled: var(--l--color--neutral--80);
|
|
569
668
|
--l--theme--button--color--border--primary--on-default--focus: var(--l--color--neutral--100);
|
|
570
669
|
--l--theme--button--color--border--primary--on-default--hover: var(--l--color--neutral--80);
|
|
670
|
+
--l--theme--button--color--border--primary--on-knockout--rest: var(--l--color--neutral--0);
|
|
671
|
+
--l--theme--button--color--border--primary--on-knockout--active: var(--l--color--neutral--10);
|
|
672
|
+
--l--theme--button--color--border--primary--on-knockout--disabled: var(--l--color--neutral--10);
|
|
673
|
+
--l--theme--button--color--border--primary--on-knockout--focus: var(--l--color--neutral--0);
|
|
674
|
+
--l--theme--button--color--border--primary--on-knockout--hover: var(--l--color--neutral--10);
|
|
571
675
|
--l--theme--button--color--border--secondary--on-default--rest: var(--l--color--neutral--90);
|
|
572
676
|
--l--theme--button--color--border--secondary--on-default--active: var(--l--color--neutral--90);
|
|
573
677
|
--l--theme--button--color--border--secondary--on-default--disabled: var(--l--color--neutral--40);
|
|
574
678
|
--l--theme--button--color--border--secondary--on-default--focus: var(--l--color--neutral--90);
|
|
575
679
|
--l--theme--button--color--border--secondary--on-default--hover: var(--l--color--neutral--90);
|
|
680
|
+
--l--theme--button--color--border--secondary--on-knockout--rest: var(--l--color--neutral--0);
|
|
681
|
+
--l--theme--button--color--border--secondary--on-knockout--active: var(--l--color--neutral--0);
|
|
682
|
+
--l--theme--button--color--border--secondary--on-knockout--disabled: var(--l--color--neutral--50);
|
|
683
|
+
--l--theme--button--color--border--secondary--on-knockout--focus: var(--l--color--neutral--0);
|
|
684
|
+
--l--theme--button--color--border--secondary--on-knockout--hover: var(--l--color--neutral--0);
|
|
576
685
|
--l--theme--button--color--border--tertiary--on-default--rest: var(--l--color--neutral--10);
|
|
577
686
|
--l--theme--button--color--border--tertiary--on-default--active: var(--l--color--neutral--20);
|
|
578
687
|
--l--theme--button--color--border--tertiary--on-default--disabled: var(--l--color--neutral--10);
|
|
579
688
|
--l--theme--button--color--border--tertiary--on-default--focus: var(--l--color--neutral--20);
|
|
580
689
|
--l--theme--button--color--border--tertiary--on-default--hover: var(--l--color--neutral--20);
|
|
690
|
+
--l--theme--button--color--border--tertiary--on-knockout--rest: var(--l--color--neutral--80);
|
|
691
|
+
--l--theme--button--color--border--tertiary--on-knockout--active: var(--l--color--neutral--70);
|
|
692
|
+
--l--theme--button--color--border--tertiary--on-knockout--disabled: var(--l--color--neutral--80);
|
|
693
|
+
--l--theme--button--color--border--tertiary--on-knockout--focus: var(--l--color--neutral--70);
|
|
694
|
+
--l--theme--button--color--border--tertiary--on-knockout--hover: var(--l--color--neutral--70);
|
|
581
695
|
--l--theme--button--color--border--destructive--on-default--rest: var(--l--color--red--70);
|
|
582
696
|
--l--theme--button--color--border--destructive--on-default--active: var(--l--color--red--60);
|
|
583
697
|
--l--theme--button--color--border--destructive--on-default--disabled: var(--l--color--red--40);
|
|
584
698
|
--l--theme--button--color--border--destructive--on-default--focus: var(--l--color--red--70);
|
|
585
699
|
--l--theme--button--color--border--destructive--on-default--hover: var(--l--color--red--60);
|
|
700
|
+
--l--theme--button--color--border--destructive--on-knockout--rest: var(--l--color--red--30);
|
|
701
|
+
--l--theme--button--color--border--destructive--on-knockout--active: var(--l--color--red--40);
|
|
702
|
+
--l--theme--button--color--border--destructive--on-knockout--disabled: var(--l--color--red--50);
|
|
703
|
+
--l--theme--button--color--border--destructive--on-knockout--focus: var(--l--color--red--30);
|
|
704
|
+
--l--theme--button--color--border--destructive--on-knockout--hover: var(--l--color--red--40);
|
|
586
705
|
--l--theme--button--color--content--primary--on-default--rest: var(--l--color--neutral--10);
|
|
587
706
|
--l--theme--button--color--content--primary--on-default--active: var(--l--color--neutral--10);
|
|
588
707
|
--l--theme--button--color--content--primary--on-default--disabled: var(--l--color--neutral--40);
|
|
589
708
|
--l--theme--button--color--content--primary--on-default--focus: var(--l--color--neutral--10);
|
|
590
709
|
--l--theme--button--color--content--primary--on-default--hover: var(--l--color--neutral--10);
|
|
710
|
+
--l--theme--button--color--content--primary--on-knockout--rest: var(--l--color--neutral--90);
|
|
711
|
+
--l--theme--button--color--content--primary--on-knockout--active: var(--l--color--neutral--90);
|
|
712
|
+
--l--theme--button--color--content--primary--on-knockout--disabled: var(--l--color--neutral--50);
|
|
713
|
+
--l--theme--button--color--content--primary--on-knockout--focus: var(--l--color--neutral--90);
|
|
714
|
+
--l--theme--button--color--content--primary--on-knockout--hover: var(--l--color--neutral--90);
|
|
591
715
|
--l--theme--button--color--content--secondary--on-default--rest: var(--l--color--neutral--90);
|
|
592
716
|
--l--theme--button--color--content--secondary--on-default--active: var(--l--color--neutral--90);
|
|
593
717
|
--l--theme--button--color--content--secondary--on-default--disabled: var(--l--color--neutral--40);
|
|
594
718
|
--l--theme--button--color--content--secondary--on-default--focus: var(--l--color--neutral--90);
|
|
595
719
|
--l--theme--button--color--content--secondary--on-default--hover: var(--l--color--neutral--90);
|
|
720
|
+
--l--theme--button--color--content--secondary--on-knockout--rest: var(--l--color--neutral--0);
|
|
721
|
+
--l--theme--button--color--content--secondary--on-knockout--active: var(--l--color--neutral--0);
|
|
722
|
+
--l--theme--button--color--content--secondary--on-knockout--disabled: var(--l--color--neutral--50);
|
|
723
|
+
--l--theme--button--color--content--secondary--on-knockout--focus: var(--l--color--neutral--0);
|
|
724
|
+
--l--theme--button--color--content--secondary--on-knockout--hover: var(--l--color--neutral--0);
|
|
596
725
|
--l--theme--button--color--content--tertiary--on-default--rest: var(--l--color--neutral--90);
|
|
597
726
|
--l--theme--button--color--content--tertiary--on-default--active: var(--l--color--neutral--90);
|
|
598
727
|
--l--theme--button--color--content--tertiary--on-default--disabled: var(--l--color--neutral--40);
|
|
599
728
|
--l--theme--button--color--content--tertiary--on-default--focus: var(--l--color--neutral--90);
|
|
600
729
|
--l--theme--button--color--content--tertiary--on-default--hover: var(--l--color--neutral--90);
|
|
730
|
+
--l--theme--button--color--content--tertiary--on-knockout--rest: var(--l--color--neutral--0);
|
|
731
|
+
--l--theme--button--color--content--tertiary--on-knockout--active: var(--l--color--neutral--0);
|
|
732
|
+
--l--theme--button--color--content--tertiary--on-knockout--disabled: var(--l--color--neutral--50);
|
|
733
|
+
--l--theme--button--color--content--tertiary--on-knockout--focus: var(--l--color--neutral--0);
|
|
734
|
+
--l--theme--button--color--content--tertiary--on-knockout--hover: var(--l--color--neutral--0);
|
|
601
735
|
--l--theme--button--color--content--destructive--on-default--rest: var(--l--color--red--10);
|
|
602
736
|
--l--theme--button--color--content--destructive--on-default--active: var(--l--color--red--10);
|
|
603
737
|
--l--theme--button--color--content--destructive--on-default--disabled: var(--l--color--red--20);
|
|
604
738
|
--l--theme--button--color--content--destructive--on-default--focus: var(--l--color--red--10);
|
|
605
739
|
--l--theme--button--color--content--destructive--on-default--hover: var(--l--color--red--10);
|
|
740
|
+
--l--theme--button--color--content--destructive--on-knockout--rest: var(--l--color--red--90);
|
|
741
|
+
--l--theme--button--color--content--destructive--on-knockout--active: var(--l--color--red--90);
|
|
742
|
+
--l--theme--button--color--content--destructive--on-knockout--disabled: var(--l--color--red--70);
|
|
743
|
+
--l--theme--button--color--content--destructive--on-knockout--focus: var(--l--color--red--90);
|
|
744
|
+
--l--theme--button--color--content--destructive--on-knockout--hover: var(--l--color--red--90);
|
|
606
745
|
--l--theme--checkbox-control--border--style: var(--l--border--style--solid);
|
|
607
746
|
--l--theme--checkbox-control--size: clamp(1.3125rem, 0.27778vw + 1.2500rem, var(--l--units--24));
|
|
608
747
|
--l--theme--notification--border--style: var(--l--border--style--solid);
|
|
@@ -711,6 +850,22 @@
|
|
|
711
850
|
--l--theme--border--media--radius: var(--l--theme--border--radius--md);
|
|
712
851
|
--l--theme--border--text-highlight--radius: var(--l--theme--border--radius--sm);
|
|
713
852
|
--l--theme--border--text-highlight--width: var(--l--theme--border--width--none);
|
|
853
|
+
--l--theme--color--interactive--background--on-default--rest: var(--l--theme--color--background--default);
|
|
854
|
+
--l--theme--color--interactive--background--on-default--focus: var(--l--theme--color--background--default);
|
|
855
|
+
--l--theme--color--interactive--background--on-default--invalid--rest: var(--l--theme--color--background--default);
|
|
856
|
+
--l--theme--color--interactive--background--on-default--invalid--focus: var(--l--theme--color--background--default);
|
|
857
|
+
--l--theme--color--interactive--background--on-knockout--rest: var(--l--theme--color--background--knockout);
|
|
858
|
+
--l--theme--color--interactive--background--on-knockout--focus: var(--l--theme--color--background--knockout);
|
|
859
|
+
--l--theme--color--interactive--background--on-knockout--invalid--rest: var(--l--theme--color--background--knockout);
|
|
860
|
+
--l--theme--color--interactive--background--on-knockout--invalid--focus: var(--l--theme--color--background--knockout);
|
|
861
|
+
--l--theme--color--link--content--secondary--on-default--rest: var(--l--theme--color--content--primary--on-default);
|
|
862
|
+
--l--theme--color--link--content--secondary--on-default--visited: var(--l--theme--color--content--primary--on-default);
|
|
863
|
+
--l--theme--color--link--content--secondary--on-knockout--rest: var(--l--theme--color--content--primary--on-knockout);
|
|
864
|
+
--l--theme--color--link--content--secondary--on-knockout--visited: var(--l--theme--color--content--primary--on-knockout);
|
|
865
|
+
--l--theme--color--link--content--tertiary--on-default--rest: var(--l--theme--color--content--secondary--on-default);
|
|
866
|
+
--l--theme--color--link--content--tertiary--on-default--visited: var(--l--theme--color--content--secondary--on-default);
|
|
867
|
+
--l--theme--color--link--content--tertiary--on-knockout--rest: var(--l--theme--color--content--secondary--on-knockout);
|
|
868
|
+
--l--theme--color--link--content--tertiary--on-knockout--visited: var(--l--theme--color--content--secondary--on-knockout);
|
|
714
869
|
--l--theme--space--gutter: var(--l--theme--space--70);
|
|
715
870
|
--l--theme--space--text-highlight--inset--block: var(--l--theme--space--10);
|
|
716
871
|
--l--theme--space--text-highlight--inset--inline: var(--l--theme--space--20);
|