@workday/canvas-tokens-web 1.1.1 → 1.3.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/css/base/_variables.css +1 -1
- package/css/brand/_variables.css +1 -1
- package/css/system/_variables.css +118 -2
- package/dist/common-js/base/index.d.ts +1 -1
- package/dist/common-js/base/index.js +1 -1
- package/dist/common-js/brand/index.d.ts +1 -1
- package/dist/common-js/brand/index.js +1 -1
- package/dist/common-js/index.d.ts +1 -1
- package/dist/common-js/index.js +1 -1
- package/dist/common-js/system/index.d.ts +757 -2
- package/dist/common-js/system/index.js +198 -2
- package/dist/es6/base/index.d.ts +1 -1
- package/dist/es6/base/index.js +1 -1
- package/dist/es6/brand/index.d.ts +1 -1
- package/dist/es6/brand/index.js +1 -1
- package/dist/es6/index.d.ts +1 -1
- package/dist/es6/index.js +1 -1
- package/dist/es6/system/index.d.ts +757 -2
- package/dist/es6/system/index.js +198 -2
- package/less/base/_variables.less +1 -1
- package/less/brand/_variables.less +1 -1
- package/less/system/_variables.less +118 -2
- package/package.json +1 -1
- package/scss/base/_variables.sass +1 -1
- package/scss/base/_variables.scss +1 -1
- package/scss/brand/_variables.sass +1 -1
- package/scss/brand/_variables.scss +1 -1
- package/scss/system/_variables.sass +118 -2
- package/scss/system/_variables.scss +118 -2
|
@@ -1,8 +1,725 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Mon,
|
|
3
|
+
* Generated on Mon, 01 Apr 2024 22:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
+
export declare const color = {
|
|
7
|
+
"bg": {
|
|
8
|
+
/**
|
|
9
|
+
* #ffffff
|
|
10
|
+
*
|
|
11
|
+
* Main background color
|
|
12
|
+
*
|
|
13
|
+
*/
|
|
14
|
+
"default": "--cnvs-sys-color-bg-default",
|
|
15
|
+
/**
|
|
16
|
+
* rgba(#ffffff, 0)
|
|
17
|
+
*
|
|
18
|
+
* Transparent background
|
|
19
|
+
*/
|
|
20
|
+
"transparent": "--cnvs-sys-color-bg-transparent",
|
|
21
|
+
/**
|
|
22
|
+
* rgba(#000000,0.64)
|
|
23
|
+
*
|
|
24
|
+
* Overlay background
|
|
25
|
+
*/
|
|
26
|
+
"overlay": "--cnvs-sys-color-bg-overlay",
|
|
27
|
+
/**
|
|
28
|
+
* rgba(#000000 ,0.84)
|
|
29
|
+
*
|
|
30
|
+
* Tooltip, Status Indicator
|
|
31
|
+
*/
|
|
32
|
+
"translucent": "--cnvs-sys-color-bg-translucent",
|
|
33
|
+
"alt": {
|
|
34
|
+
/**
|
|
35
|
+
* #e8ebed
|
|
36
|
+
*
|
|
37
|
+
* Hover states
|
|
38
|
+
*/
|
|
39
|
+
"default": "--cnvs-sys-color-bg-alt-default",
|
|
40
|
+
/**
|
|
41
|
+
* #F0F1F2
|
|
42
|
+
*
|
|
43
|
+
* Page background
|
|
44
|
+
*/
|
|
45
|
+
"soft": "--cnvs-sys-color-bg-alt-soft",
|
|
46
|
+
/**
|
|
47
|
+
* #f6f7f8
|
|
48
|
+
*
|
|
49
|
+
* Disabled inputs and column headers
|
|
50
|
+
*/
|
|
51
|
+
"softer": "--cnvs-sys-color-bg-alt-softer",
|
|
52
|
+
/**
|
|
53
|
+
* #DFE2E6
|
|
54
|
+
*
|
|
55
|
+
* Active states
|
|
56
|
+
*/
|
|
57
|
+
"strong": "--cnvs-sys-color-bg-alt-strong",
|
|
58
|
+
/**
|
|
59
|
+
* #ced3d9
|
|
60
|
+
*
|
|
61
|
+
* Active states
|
|
62
|
+
*/
|
|
63
|
+
"stronger": "--cnvs-sys-color-bg-alt-stronger",
|
|
64
|
+
},
|
|
65
|
+
"muted": {
|
|
66
|
+
/** #A1AAB3 */
|
|
67
|
+
"softer": "--cnvs-sys-color-bg-muted-softer",
|
|
68
|
+
/** #7b858f */
|
|
69
|
+
"soft": "--cnvs-sys-color-bg-muted-soft",
|
|
70
|
+
/** #5E6A75 */
|
|
71
|
+
"default": "--cnvs-sys-color-bg-muted-default",
|
|
72
|
+
/** #333d47 */
|
|
73
|
+
"strong": "--cnvs-sys-color-bg-muted-strong",
|
|
74
|
+
},
|
|
75
|
+
"contrast": {
|
|
76
|
+
/**
|
|
77
|
+
* #333333
|
|
78
|
+
*
|
|
79
|
+
* Contrast backgrounds, like Secondary Buttons
|
|
80
|
+
*/
|
|
81
|
+
"default": "--cnvs-sys-color-bg-contrast-default",
|
|
82
|
+
/**
|
|
83
|
+
* #1e1e1e
|
|
84
|
+
*
|
|
85
|
+
* Contrast backgrounds, like Secondary Buttons
|
|
86
|
+
*/
|
|
87
|
+
"strong": "--cnvs-sys-color-bg-contrast-strong",
|
|
88
|
+
},
|
|
89
|
+
"primary": {
|
|
90
|
+
/**
|
|
91
|
+
* #0875E1
|
|
92
|
+
*
|
|
93
|
+
* Primary brand color
|
|
94
|
+
*/
|
|
95
|
+
"default": "--cnvs-sys-color-bg-primary-default",
|
|
96
|
+
/**
|
|
97
|
+
* #A6D2FF
|
|
98
|
+
*
|
|
99
|
+
* Brand selected background
|
|
100
|
+
*/
|
|
101
|
+
"soft": "--cnvs-sys-color-bg-primary-soft",
|
|
102
|
+
/**
|
|
103
|
+
* #005cb9
|
|
104
|
+
*
|
|
105
|
+
* Brand hover background
|
|
106
|
+
*/
|
|
107
|
+
"strong": "--cnvs-sys-color-bg-primary-strong",
|
|
108
|
+
/**
|
|
109
|
+
* #004387
|
|
110
|
+
*
|
|
111
|
+
* Brand active background
|
|
112
|
+
*/
|
|
113
|
+
"stronger": "--cnvs-sys-color-bg-primary-stronger",
|
|
114
|
+
},
|
|
115
|
+
"positive": {
|
|
116
|
+
/**
|
|
117
|
+
* #43c463
|
|
118
|
+
*
|
|
119
|
+
* Disabled success background
|
|
120
|
+
*/
|
|
121
|
+
"default": "--cnvs-sys-color-bg-positive-default",
|
|
122
|
+
/**
|
|
123
|
+
* #ebfff0
|
|
124
|
+
*
|
|
125
|
+
* Default success background
|
|
126
|
+
*/
|
|
127
|
+
"soft": "--cnvs-sys-color-bg-positive-soft",
|
|
128
|
+
/**
|
|
129
|
+
* #319c4c
|
|
130
|
+
*
|
|
131
|
+
* Hover success background
|
|
132
|
+
*/
|
|
133
|
+
"strong": "--cnvs-sys-color-bg-positive-strong",
|
|
134
|
+
/**
|
|
135
|
+
* #217a37
|
|
136
|
+
*
|
|
137
|
+
* Active success background
|
|
138
|
+
*/
|
|
139
|
+
"stronger": "--cnvs-sys-color-bg-positive-stronger",
|
|
140
|
+
},
|
|
141
|
+
"caution": {
|
|
142
|
+
/**
|
|
143
|
+
* #ffa126
|
|
144
|
+
*
|
|
145
|
+
* Default warning background
|
|
146
|
+
*/
|
|
147
|
+
"default": "--cnvs-sys-color-bg-caution-default",
|
|
148
|
+
/**
|
|
149
|
+
* #ffeed9
|
|
150
|
+
*
|
|
151
|
+
* Disabled warning background
|
|
152
|
+
*/
|
|
153
|
+
"softer": "--cnvs-sys-color-bg-caution-softer",
|
|
154
|
+
/**
|
|
155
|
+
* #f38b00
|
|
156
|
+
*
|
|
157
|
+
* Strong warning background
|
|
158
|
+
*/
|
|
159
|
+
"strong": "--cnvs-sys-color-bg-caution-strong",
|
|
160
|
+
/**
|
|
161
|
+
* #c06c00
|
|
162
|
+
*
|
|
163
|
+
* Stronger warning background
|
|
164
|
+
*/
|
|
165
|
+
"stronger": "--cnvs-sys-color-bg-caution-stronger",
|
|
166
|
+
},
|
|
167
|
+
"critical": {
|
|
168
|
+
/**
|
|
169
|
+
* #de2e21
|
|
170
|
+
*
|
|
171
|
+
* Default error background
|
|
172
|
+
*/
|
|
173
|
+
"default": "--cnvs-sys-color-bg-critical-default",
|
|
174
|
+
/**
|
|
175
|
+
* #ffefee
|
|
176
|
+
*
|
|
177
|
+
* Disabled error background
|
|
178
|
+
*/
|
|
179
|
+
"softer": "--cnvs-sys-color-bg-critical-softer",
|
|
180
|
+
/**
|
|
181
|
+
* #a31b12
|
|
182
|
+
*
|
|
183
|
+
* Strong error background
|
|
184
|
+
*/
|
|
185
|
+
"strong": "--cnvs-sys-color-bg-critical-strong",
|
|
186
|
+
/**
|
|
187
|
+
* #80160E
|
|
188
|
+
*
|
|
189
|
+
* Stronger error background
|
|
190
|
+
*/
|
|
191
|
+
"stronger": "--cnvs-sys-color-bg-critical-stronger",
|
|
192
|
+
},
|
|
193
|
+
},
|
|
194
|
+
"text": {
|
|
195
|
+
/**
|
|
196
|
+
* #494949
|
|
197
|
+
*
|
|
198
|
+
* Default text color
|
|
199
|
+
*/
|
|
200
|
+
"default": "--cnvs-sys-color-text-default",
|
|
201
|
+
/**
|
|
202
|
+
* #A1AAB3
|
|
203
|
+
*
|
|
204
|
+
* Disabled text color
|
|
205
|
+
*/
|
|
206
|
+
"disabled": "--cnvs-sys-color-text-disabled",
|
|
207
|
+
/**
|
|
208
|
+
* #5E6A75
|
|
209
|
+
*
|
|
210
|
+
* Hint text color
|
|
211
|
+
*/
|
|
212
|
+
"hint": "--cnvs-sys-color-text-hint",
|
|
213
|
+
/**
|
|
214
|
+
* #333333
|
|
215
|
+
*
|
|
216
|
+
* Heading text color
|
|
217
|
+
*/
|
|
218
|
+
"strong": "--cnvs-sys-color-text-strong",
|
|
219
|
+
/**
|
|
220
|
+
* #1e1e1e
|
|
221
|
+
*
|
|
222
|
+
* Heading hover text color
|
|
223
|
+
*/
|
|
224
|
+
"stronger": "--cnvs-sys-color-text-stronger",
|
|
225
|
+
/**
|
|
226
|
+
* #ffffff
|
|
227
|
+
*
|
|
228
|
+
* Inverse text color
|
|
229
|
+
*/
|
|
230
|
+
"inverse": "--cnvs-sys-color-text-inverse",
|
|
231
|
+
"critical": {
|
|
232
|
+
/**
|
|
233
|
+
* #de2e21
|
|
234
|
+
*
|
|
235
|
+
* Error text
|
|
236
|
+
*/
|
|
237
|
+
"default": "--cnvs-sys-color-text-critical-default",
|
|
238
|
+
},
|
|
239
|
+
"primary": {
|
|
240
|
+
/**
|
|
241
|
+
* #0875E1
|
|
242
|
+
*
|
|
243
|
+
* Branded text
|
|
244
|
+
*/
|
|
245
|
+
"default": "--cnvs-sys-color-text-primary-default",
|
|
246
|
+
/**
|
|
247
|
+
* #005cb9
|
|
248
|
+
*
|
|
249
|
+
* Branded hover text
|
|
250
|
+
*/
|
|
251
|
+
"strong": "--cnvs-sys-color-text-primary-strong",
|
|
252
|
+
/**
|
|
253
|
+
* #004387
|
|
254
|
+
*
|
|
255
|
+
* Active links
|
|
256
|
+
*/
|
|
257
|
+
"stronger": "--cnvs-sys-color-text-primary-stronger",
|
|
258
|
+
},
|
|
259
|
+
"caution": {
|
|
260
|
+
/**
|
|
261
|
+
* #333333
|
|
262
|
+
*
|
|
263
|
+
* Warning text
|
|
264
|
+
*/
|
|
265
|
+
"default": "--cnvs-sys-color-text-caution-default",
|
|
266
|
+
/**
|
|
267
|
+
* #1e1e1e
|
|
268
|
+
*
|
|
269
|
+
* Strong warning text
|
|
270
|
+
*/
|
|
271
|
+
"strong": "--cnvs-sys-color-text-caution-strong",
|
|
272
|
+
},
|
|
273
|
+
},
|
|
274
|
+
"icon": {
|
|
275
|
+
/**
|
|
276
|
+
* #7b858f
|
|
277
|
+
*
|
|
278
|
+
* Default icon color
|
|
279
|
+
*/
|
|
280
|
+
"default": "--cnvs-sys-color-icon-default",
|
|
281
|
+
/**
|
|
282
|
+
* #A1AAB3
|
|
283
|
+
*
|
|
284
|
+
* Disabled icon color
|
|
285
|
+
*/
|
|
286
|
+
"soft": "--cnvs-sys-color-icon-soft",
|
|
287
|
+
/**
|
|
288
|
+
* #333d47
|
|
289
|
+
*
|
|
290
|
+
* Hover icon color
|
|
291
|
+
*/
|
|
292
|
+
"strong": "--cnvs-sys-color-icon-strong",
|
|
293
|
+
/**
|
|
294
|
+
* #ffffff
|
|
295
|
+
*
|
|
296
|
+
* Inverse icon color
|
|
297
|
+
*/
|
|
298
|
+
"inverse": "--cnvs-sys-color-icon-inverse",
|
|
299
|
+
"primary": {
|
|
300
|
+
/**
|
|
301
|
+
* #0875E1
|
|
302
|
+
*
|
|
303
|
+
* Brand icon color
|
|
304
|
+
*/
|
|
305
|
+
"default": "--cnvs-sys-color-icon-primary-default",
|
|
306
|
+
/**
|
|
307
|
+
* #005cb9
|
|
308
|
+
*
|
|
309
|
+
* Stronger brand icon color
|
|
310
|
+
*/
|
|
311
|
+
"strong": "--cnvs-sys-color-icon-primary-strong",
|
|
312
|
+
},
|
|
313
|
+
"positive": {
|
|
314
|
+
/**
|
|
315
|
+
* #319c4c
|
|
316
|
+
*
|
|
317
|
+
* Success icon color
|
|
318
|
+
*/
|
|
319
|
+
"default": "--cnvs-sys-color-icon-positive-default",
|
|
320
|
+
},
|
|
321
|
+
"critical": {
|
|
322
|
+
/**
|
|
323
|
+
* #de2e21
|
|
324
|
+
*
|
|
325
|
+
* Error icon color
|
|
326
|
+
*/
|
|
327
|
+
"default": "--cnvs-sys-color-icon-critical-default",
|
|
328
|
+
},
|
|
329
|
+
"caution": {
|
|
330
|
+
/**
|
|
331
|
+
* #333333
|
|
332
|
+
*
|
|
333
|
+
* Caution icon color
|
|
334
|
+
*/
|
|
335
|
+
"default": "--cnvs-sys-color-icon-caution-default",
|
|
336
|
+
/**
|
|
337
|
+
* #1e1e1e
|
|
338
|
+
*
|
|
339
|
+
* Strong caution icon color
|
|
340
|
+
*/
|
|
341
|
+
"strong": "--cnvs-sys-color-icon-caution-strong",
|
|
342
|
+
},
|
|
343
|
+
},
|
|
344
|
+
"fg": {
|
|
345
|
+
/**
|
|
346
|
+
* #494949
|
|
347
|
+
*
|
|
348
|
+
* Body
|
|
349
|
+
*/
|
|
350
|
+
"default": "--cnvs-sys-color-fg-default",
|
|
351
|
+
/**
|
|
352
|
+
* #333333
|
|
353
|
+
*
|
|
354
|
+
* Headings
|
|
355
|
+
*/
|
|
356
|
+
"strong": "--cnvs-sys-color-fg-strong",
|
|
357
|
+
/**
|
|
358
|
+
* #1e1e1e
|
|
359
|
+
*
|
|
360
|
+
* Heading on hover
|
|
361
|
+
*/
|
|
362
|
+
"stronger": "--cnvs-sys-color-fg-stronger",
|
|
363
|
+
/**
|
|
364
|
+
* #A1AAB3
|
|
365
|
+
*
|
|
366
|
+
* Disabled
|
|
367
|
+
*/
|
|
368
|
+
"disabled": "--cnvs-sys-color-fg-disabled",
|
|
369
|
+
/**
|
|
370
|
+
* #ffffff
|
|
371
|
+
*
|
|
372
|
+
* Inverse
|
|
373
|
+
*/
|
|
374
|
+
"inverse": "--cnvs-sys-color-fg-inverse",
|
|
375
|
+
"critical": {
|
|
376
|
+
/**
|
|
377
|
+
* #de2e21
|
|
378
|
+
*
|
|
379
|
+
* Error
|
|
380
|
+
*/
|
|
381
|
+
"default": "--cnvs-sys-color-fg-critical-default",
|
|
382
|
+
},
|
|
383
|
+
"muted": {
|
|
384
|
+
/**
|
|
385
|
+
* #7b858f
|
|
386
|
+
*
|
|
387
|
+
* Tab item text
|
|
388
|
+
*/
|
|
389
|
+
"soft": "--cnvs-sys-color-fg-muted-soft",
|
|
390
|
+
/**
|
|
391
|
+
* #5E6A75
|
|
392
|
+
*
|
|
393
|
+
* Hint text
|
|
394
|
+
*/
|
|
395
|
+
"default": "--cnvs-sys-color-fg-muted-default",
|
|
396
|
+
/** #4a5561 */
|
|
397
|
+
"strong": "--cnvs-sys-color-fg-muted-strong",
|
|
398
|
+
/** #333d47 */
|
|
399
|
+
"stronger": "--cnvs-sys-color-fg-muted-stronger",
|
|
400
|
+
},
|
|
401
|
+
"primary": {
|
|
402
|
+
/**
|
|
403
|
+
* #0875E1
|
|
404
|
+
*
|
|
405
|
+
* Interactive foreground elements
|
|
406
|
+
*/
|
|
407
|
+
"default": "--cnvs-sys-color-fg-primary-default",
|
|
408
|
+
/**
|
|
409
|
+
* #005cb9
|
|
410
|
+
*
|
|
411
|
+
* Hover interactive foregrounds
|
|
412
|
+
*/
|
|
413
|
+
"strong": "--cnvs-sys-color-fg-primary-strong",
|
|
414
|
+
},
|
|
415
|
+
"caution": {
|
|
416
|
+
/**
|
|
417
|
+
* #333333
|
|
418
|
+
*
|
|
419
|
+
* Warning
|
|
420
|
+
*/
|
|
421
|
+
"default": "--cnvs-sys-color-fg-caution-default",
|
|
422
|
+
/**
|
|
423
|
+
* #1e1e1e
|
|
424
|
+
*
|
|
425
|
+
* Warning on hover
|
|
426
|
+
*/
|
|
427
|
+
"strong": "--cnvs-sys-color-fg-caution-strong",
|
|
428
|
+
},
|
|
429
|
+
"contrast": {
|
|
430
|
+
/**
|
|
431
|
+
* #333333
|
|
432
|
+
*
|
|
433
|
+
* Contrast
|
|
434
|
+
*/
|
|
435
|
+
"default": "--cnvs-sys-color-fg-contrast-default",
|
|
436
|
+
/**
|
|
437
|
+
* #1e1e1e
|
|
438
|
+
*
|
|
439
|
+
* Strong contrast
|
|
440
|
+
*/
|
|
441
|
+
"strong": "--cnvs-sys-color-fg-contrast-strong",
|
|
442
|
+
},
|
|
443
|
+
},
|
|
444
|
+
"border": {
|
|
445
|
+
"input": {
|
|
446
|
+
/**
|
|
447
|
+
* #A1AAB3
|
|
448
|
+
*
|
|
449
|
+
* Disabled inputs
|
|
450
|
+
*/
|
|
451
|
+
"disabled": "--cnvs-sys-color-border-input-disabled",
|
|
452
|
+
/**
|
|
453
|
+
* #7b858f
|
|
454
|
+
*
|
|
455
|
+
* Inputs
|
|
456
|
+
*/
|
|
457
|
+
"default": "--cnvs-sys-color-border-input-default",
|
|
458
|
+
/**
|
|
459
|
+
* #333d47
|
|
460
|
+
*
|
|
461
|
+
* Input hover
|
|
462
|
+
*/
|
|
463
|
+
"strong": "--cnvs-sys-color-border-input-strong",
|
|
464
|
+
/**
|
|
465
|
+
* #e8ebed
|
|
466
|
+
*
|
|
467
|
+
* Borders on checkboxes and radios
|
|
468
|
+
*/
|
|
469
|
+
"inverse": "--cnvs-sys-color-border-input-inverse",
|
|
470
|
+
},
|
|
471
|
+
"contrast": {
|
|
472
|
+
/**
|
|
473
|
+
* #333333
|
|
474
|
+
*
|
|
475
|
+
* Secondary Button
|
|
476
|
+
*/
|
|
477
|
+
"default": "--cnvs-sys-color-border-contrast-default",
|
|
478
|
+
/**
|
|
479
|
+
* #1e1e1e
|
|
480
|
+
*
|
|
481
|
+
* Secondary Button Hover
|
|
482
|
+
*/
|
|
483
|
+
"strong": "--cnvs-sys-color-border-contrast-strong",
|
|
484
|
+
},
|
|
485
|
+
"primary": {
|
|
486
|
+
/**
|
|
487
|
+
* #0875E1
|
|
488
|
+
*
|
|
489
|
+
* Brand, Focus
|
|
490
|
+
*/
|
|
491
|
+
"default": "--cnvs-sys-color-border-primary-default",
|
|
492
|
+
},
|
|
493
|
+
"critical": {
|
|
494
|
+
/**
|
|
495
|
+
* #de2e21
|
|
496
|
+
*
|
|
497
|
+
* Error
|
|
498
|
+
*/
|
|
499
|
+
"default": "--cnvs-sys-color-border-critical-default",
|
|
500
|
+
},
|
|
501
|
+
"caution": {
|
|
502
|
+
/**
|
|
503
|
+
* #ffa126
|
|
504
|
+
*
|
|
505
|
+
* Warning inner
|
|
506
|
+
*/
|
|
507
|
+
"default": "--cnvs-sys-color-border-caution-default",
|
|
508
|
+
/**
|
|
509
|
+
* #c06c00
|
|
510
|
+
*
|
|
511
|
+
* Warning outer (box shadow)
|
|
512
|
+
*/
|
|
513
|
+
"strong": "--cnvs-sys-color-border-caution-strong",
|
|
514
|
+
},
|
|
515
|
+
/**
|
|
516
|
+
* rgba(#ffffff, 0%)
|
|
517
|
+
*
|
|
518
|
+
* Transparent
|
|
519
|
+
*/
|
|
520
|
+
"transparent": "--cnvs-sys-color-border-transparent",
|
|
521
|
+
/**
|
|
522
|
+
* #ffffff
|
|
523
|
+
*
|
|
524
|
+
* Inverse
|
|
525
|
+
*/
|
|
526
|
+
"inverse": "--cnvs-sys-color-border-inverse",
|
|
527
|
+
/**
|
|
528
|
+
* #DFE2E6
|
|
529
|
+
*
|
|
530
|
+
* Dividers
|
|
531
|
+
*/
|
|
532
|
+
"divider": "--cnvs-sys-color-border-divider",
|
|
533
|
+
/**
|
|
534
|
+
* #ced3d9
|
|
535
|
+
*
|
|
536
|
+
* Cards, Toasts
|
|
537
|
+
*/
|
|
538
|
+
"container": "--cnvs-sys-color-border-container",
|
|
539
|
+
},
|
|
540
|
+
"shadow": {
|
|
541
|
+
/**
|
|
542
|
+
* #1f262e
|
|
543
|
+
*
|
|
544
|
+
* First shadow color
|
|
545
|
+
*/
|
|
546
|
+
"1": "--cnvs-sys-color-shadow-1",
|
|
547
|
+
/**
|
|
548
|
+
* #1f262e
|
|
549
|
+
*
|
|
550
|
+
* Second shadow color
|
|
551
|
+
*/
|
|
552
|
+
"2": "--cnvs-sys-color-shadow-2",
|
|
553
|
+
/**
|
|
554
|
+
* #1f262e
|
|
555
|
+
*
|
|
556
|
+
* Main shadow color
|
|
557
|
+
*/
|
|
558
|
+
"default": "--cnvs-sys-color-shadow-default",
|
|
559
|
+
},
|
|
560
|
+
"static": {
|
|
561
|
+
"blue": {
|
|
562
|
+
/**
|
|
563
|
+
* #0875E1
|
|
564
|
+
*
|
|
565
|
+
* Blue
|
|
566
|
+
*/
|
|
567
|
+
"default": "--cnvs-sys-color-static-blue-default",
|
|
568
|
+
/**
|
|
569
|
+
* #D7EAFC
|
|
570
|
+
*
|
|
571
|
+
* Light blue
|
|
572
|
+
*/
|
|
573
|
+
"soft": "--cnvs-sys-color-static-blue-soft",
|
|
574
|
+
/**
|
|
575
|
+
* #005cb9
|
|
576
|
+
*
|
|
577
|
+
* Stronger blue
|
|
578
|
+
*/
|
|
579
|
+
"strong": "--cnvs-sys-color-static-blue-strong",
|
|
580
|
+
},
|
|
581
|
+
"gold": {
|
|
582
|
+
/**
|
|
583
|
+
* #8C6000
|
|
584
|
+
*
|
|
585
|
+
* Foregrounds in low emphasis status indicators
|
|
586
|
+
*/
|
|
587
|
+
"stronger": "--cnvs-sys-color-static-gold-stronger",
|
|
588
|
+
},
|
|
589
|
+
"green": {
|
|
590
|
+
/**
|
|
591
|
+
* #43c463
|
|
592
|
+
*
|
|
593
|
+
* Default green
|
|
594
|
+
*/
|
|
595
|
+
"default": "--cnvs-sys-color-static-green-default",
|
|
596
|
+
/**
|
|
597
|
+
* #ebfff0
|
|
598
|
+
*
|
|
599
|
+
* Light green
|
|
600
|
+
*/
|
|
601
|
+
"soft": "--cnvs-sys-color-static-green-soft",
|
|
602
|
+
/**
|
|
603
|
+
* #217a37
|
|
604
|
+
*
|
|
605
|
+
* Stronger green
|
|
606
|
+
*/
|
|
607
|
+
"strong": "--cnvs-sys-color-static-green-strong",
|
|
608
|
+
},
|
|
609
|
+
"red": {
|
|
610
|
+
/**
|
|
611
|
+
* #de2e21
|
|
612
|
+
*
|
|
613
|
+
* Red
|
|
614
|
+
*/
|
|
615
|
+
"default": "--cnvs-sys-color-static-red-default",
|
|
616
|
+
/**
|
|
617
|
+
* #ffefee
|
|
618
|
+
*
|
|
619
|
+
* Light red
|
|
620
|
+
*/
|
|
621
|
+
"soft": "--cnvs-sys-color-static-red-soft",
|
|
622
|
+
/**
|
|
623
|
+
* #a31b12
|
|
624
|
+
*
|
|
625
|
+
* Strong red
|
|
626
|
+
*/
|
|
627
|
+
"strong": "--cnvs-sys-color-static-red-strong",
|
|
628
|
+
},
|
|
629
|
+
"orange": {
|
|
630
|
+
/**
|
|
631
|
+
* #f38b00
|
|
632
|
+
*
|
|
633
|
+
* Orange
|
|
634
|
+
*/
|
|
635
|
+
"default": "--cnvs-sys-color-static-orange-default",
|
|
636
|
+
/**
|
|
637
|
+
* #ffeed9
|
|
638
|
+
*
|
|
639
|
+
* Soft orange
|
|
640
|
+
*/
|
|
641
|
+
"soft": "--cnvs-sys-color-static-orange-soft",
|
|
642
|
+
/**
|
|
643
|
+
* #c06c00
|
|
644
|
+
*
|
|
645
|
+
* Stronger orange
|
|
646
|
+
*/
|
|
647
|
+
"strong": "--cnvs-sys-color-static-orange-strong",
|
|
648
|
+
},
|
|
649
|
+
"gray": {
|
|
650
|
+
/**
|
|
651
|
+
* #5E6A75
|
|
652
|
+
*
|
|
653
|
+
* Gray
|
|
654
|
+
*/
|
|
655
|
+
"default": "--cnvs-sys-color-static-gray-default",
|
|
656
|
+
/**
|
|
657
|
+
* #e8ebed
|
|
658
|
+
*
|
|
659
|
+
* Light gray
|
|
660
|
+
*/
|
|
661
|
+
"soft": "--cnvs-sys-color-static-gray-soft",
|
|
662
|
+
/**
|
|
663
|
+
* #4a5561
|
|
664
|
+
*
|
|
665
|
+
* Stronger gray
|
|
666
|
+
*/
|
|
667
|
+
"strong": "--cnvs-sys-color-static-gray-strong",
|
|
668
|
+
/**
|
|
669
|
+
* #333d47
|
|
670
|
+
*
|
|
671
|
+
* Strongerer gray
|
|
672
|
+
*/
|
|
673
|
+
"stronger": "--cnvs-sys-color-static-gray-stronger",
|
|
674
|
+
},
|
|
675
|
+
/**
|
|
676
|
+
* #ffffff
|
|
677
|
+
*
|
|
678
|
+
* Just white
|
|
679
|
+
*/
|
|
680
|
+
"white": "--cnvs-sys-color-static-white",
|
|
681
|
+
/**
|
|
682
|
+
* #000000
|
|
683
|
+
*
|
|
684
|
+
* Just black
|
|
685
|
+
*/
|
|
686
|
+
"black": "--cnvs-sys-color-static-black",
|
|
687
|
+
},
|
|
688
|
+
} as const;
|
|
689
|
+
|
|
690
|
+
export declare const breakpoints = {
|
|
691
|
+
/**
|
|
692
|
+
* 0
|
|
693
|
+
*
|
|
694
|
+
* Use to set a media query `min-width` below small.
|
|
695
|
+
*/
|
|
696
|
+
"zero": "--cnvs-sys-breakpoints-zero",
|
|
697
|
+
/**
|
|
698
|
+
* 20rem (320px)
|
|
699
|
+
*
|
|
700
|
+
* The `min-width` for mobile devices, such as phones and tablets.
|
|
701
|
+
*/
|
|
702
|
+
"s": "--cnvs-sys-breakpoints-s",
|
|
703
|
+
/**
|
|
704
|
+
* 48rem (768px)
|
|
705
|
+
*
|
|
706
|
+
* Medium screens, such as laptops.
|
|
707
|
+
*/
|
|
708
|
+
"m": "--cnvs-sys-breakpoints-m",
|
|
709
|
+
/**
|
|
710
|
+
* 64rem (1024px)
|
|
711
|
+
*
|
|
712
|
+
* Large screens, such as desktops.
|
|
713
|
+
*/
|
|
714
|
+
"l": "--cnvs-sys-breakpoints-l",
|
|
715
|
+
/**
|
|
716
|
+
* 90rem (1440px)
|
|
717
|
+
*
|
|
718
|
+
* Used for extra large screens, such as wide monitors and TVs.
|
|
719
|
+
*/
|
|
720
|
+
"xl": "--cnvs-sys-breakpoints-xl",
|
|
721
|
+
} as const;
|
|
722
|
+
|
|
6
723
|
export declare const depth = {
|
|
7
724
|
/**
|
|
8
725
|
* 0 0.0625rem 0.25rem 0 rgba(#1f262e,0.12), 0 0.125rem 0.5rem 0 rgba(#1f262e,0.08)
|
|
@@ -45,12 +762,50 @@ export declare const depth = {
|
|
|
45
762
|
} as const;
|
|
46
763
|
|
|
47
764
|
export declare const opacity = {
|
|
765
|
+
/**
|
|
766
|
+
* 0
|
|
767
|
+
*
|
|
768
|
+
* Dev only
|
|
769
|
+
*/
|
|
770
|
+
"zero": "--cnvs-sys-opacity-zero",
|
|
48
771
|
/**
|
|
49
772
|
* 0.4
|
|
50
773
|
*
|
|
51
|
-
*
|
|
774
|
+
* Disabled states
|
|
52
775
|
*/
|
|
53
776
|
"disabled": "--cnvs-sys-opacity-disabled",
|
|
777
|
+
/**
|
|
778
|
+
* 0.64
|
|
779
|
+
*
|
|
780
|
+
* Overlay
|
|
781
|
+
*/
|
|
782
|
+
"overlay": "--cnvs-sys-opacity-overlay",
|
|
783
|
+
/**
|
|
784
|
+
* 0.84
|
|
785
|
+
*
|
|
786
|
+
* Tooltips, Status Indicator
|
|
787
|
+
*/
|
|
788
|
+
"contrast": "--cnvs-sys-opacity-contrast",
|
|
789
|
+
/**
|
|
790
|
+
* 1
|
|
791
|
+
*
|
|
792
|
+
* Dev only
|
|
793
|
+
*/
|
|
794
|
+
"full": "--cnvs-sys-opacity-full",
|
|
795
|
+
"shadow": {
|
|
796
|
+
/**
|
|
797
|
+
* 0.12
|
|
798
|
+
*
|
|
799
|
+
* Alpha on first shadow
|
|
800
|
+
*/
|
|
801
|
+
"first": "--cnvs-sys-opacity-shadow-first",
|
|
802
|
+
/**
|
|
803
|
+
* 0.08
|
|
804
|
+
*
|
|
805
|
+
* Alpha on second shadow
|
|
806
|
+
*/
|
|
807
|
+
"second": "--cnvs-sys-opacity-shadow-second",
|
|
808
|
+
},
|
|
54
809
|
} as const;
|
|
55
810
|
|
|
56
811
|
export declare const shape = {
|