@spectrum-web-components/styles 0.42.3 → 0.42.5

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 (41) hide show
  1. package/package.json +13 -7
  2. package/src/spectrum-body.css +22 -22
  3. package/src/spectrum-body.css.dev.js +1 -1
  4. package/src/spectrum-body.css.dev.js.map +1 -1
  5. package/src/spectrum-body.css.js +1 -1
  6. package/src/spectrum-body.css.js.map +1 -1
  7. package/src/spectrum-code.css +18 -18
  8. package/src/spectrum-code.css.dev.js +1 -1
  9. package/src/spectrum-code.css.dev.js.map +1 -1
  10. package/src/spectrum-code.css.js +1 -1
  11. package/src/spectrum-code.css.js.map +1 -1
  12. package/src/spectrum-detail.css +42 -42
  13. package/src/spectrum-detail.css.dev.js +1 -1
  14. package/src/spectrum-detail.css.dev.js.map +1 -1
  15. package/src/spectrum-detail.css.js +1 -1
  16. package/src/spectrum-detail.css.js.map +1 -1
  17. package/src/spectrum-heading.css +83 -83
  18. package/src/spectrum-heading.css.dev.js +1 -1
  19. package/src/spectrum-heading.css.dev.js.map +1 -1
  20. package/src/spectrum-heading.css.js +1 -1
  21. package/src/spectrum-heading.css.js.map +1 -1
  22. package/src/spectrum-lang.css +101 -101
  23. package/src/spectrum-lang.css.dev.js +1 -1
  24. package/src/spectrum-lang.css.dev.js.map +1 -1
  25. package/src/spectrum-lang.css.js +1 -1
  26. package/src/spectrum-lang.css.js.map +1 -1
  27. package/tokens/spectrum/custom-large-vars.css +0 -7
  28. package/tokens/spectrum/custom-medium-vars.css +0 -7
  29. package/tokens-v2/dark-vars.css +723 -0
  30. package/tokens-v2/global-vars.css +1248 -0
  31. package/tokens-v2/large-vars.css +562 -0
  32. package/tokens-v2/light-vars.css +723 -0
  33. package/tokens-v2/medium-vars.css +562 -0
  34. package/tokens-v2/spectrum/custom-dark-vars.css +108 -0
  35. package/tokens-v2/spectrum/custom-darkest-vars.css +109 -0
  36. package/tokens-v2/spectrum/custom-large-vars.css +120 -0
  37. package/tokens-v2/spectrum/custom-light-vars.css +108 -0
  38. package/tokens-v2/spectrum/custom-medium-vars.css +121 -0
  39. package/tokens-v2/spectrum/custom-vars.css +52 -0
  40. package/tokens-v2/spectrum/global-vars.css +1352 -0
  41. package/typography.css +167 -167
@@ -0,0 +1,1352 @@
1
+ :host,
2
+ :root {
3
+ --system-spectrum-actionbutton-background-color-default: var(
4
+ --spectrum-gray-75
5
+ );
6
+ --system-spectrum-actionbutton-background-color-hover: var(
7
+ --spectrum-gray-200
8
+ );
9
+ --system-spectrum-actionbutton-background-color-down: var(
10
+ --spectrum-gray-300
11
+ );
12
+ --system-spectrum-actionbutton-background-color-focus: var(
13
+ --spectrum-gray-200
14
+ );
15
+ --system-spectrum-actionbutton-border-color-default: var(
16
+ --spectrum-gray-400
17
+ );
18
+ --system-spectrum-actionbutton-border-color-hover: var(--spectrum-gray-500);
19
+ --system-spectrum-actionbutton-border-color-down: var(--spectrum-gray-600);
20
+ --system-spectrum-actionbutton-border-color-focus: var(--spectrum-gray-500);
21
+ --system-spectrum-actionbutton-background-color-disabled: transparent;
22
+ --system-spectrum-actionbutton-border-color-disabled: var(
23
+ --spectrum-disabled-border-color
24
+ );
25
+ --system-spectrum-actionbutton-content-color-disabled: var(
26
+ --spectrum-disabled-content-color
27
+ );
28
+ --system-spectrum-actionbutton-quiet-background-color-default: transparent;
29
+ --system-spectrum-actionbutton-quiet-background-color-hover: var(
30
+ --spectrum-gray-200
31
+ );
32
+ --system-spectrum-actionbutton-quiet-background-color-down: var(
33
+ --spectrum-gray-300
34
+ );
35
+ --system-spectrum-actionbutton-quiet-background-color-focus: var(
36
+ --spectrum-gray-200
37
+ );
38
+ --system-spectrum-actionbutton-quiet-border-color-default: transparent;
39
+ --system-spectrum-actionbutton-quiet-border-color-hover: transparent;
40
+ --system-spectrum-actionbutton-quiet-border-color-down: transparent;
41
+ --system-spectrum-actionbutton-quiet-border-color-focus: transparent;
42
+ --system-spectrum-actionbutton-quiet-background-color-disabled: transparent;
43
+ --system-spectrum-actionbutton-quiet-border-color-disabled: transparent;
44
+ --system-spectrum-actionbutton-selected-border-color-default: transparent;
45
+ --system-spectrum-actionbutton-selected-border-color-hover: transparent;
46
+ --system-spectrum-actionbutton-selected-border-color-down: transparent;
47
+ --system-spectrum-actionbutton-selected-border-color-focus: transparent;
48
+ --system-spectrum-actionbutton-selected-background-color-disabled: var(
49
+ --spectrum-disabled-background-color
50
+ );
51
+ --system-spectrum-actionbutton-selected-border-color-disabled: transparent;
52
+ --system-spectrum-actionbutton-staticblack-quiet-border-color-default: transparent;
53
+ --system-spectrum-actionbutton-staticwhite-quiet-border-color-default: transparent;
54
+ --system-spectrum-actionbutton-staticblack-quiet-border-color-hover: transparent;
55
+ --system-spectrum-actionbutton-staticwhite-quiet-border-color-hover: transparent;
56
+ --system-spectrum-actionbutton-staticblack-quiet-border-color-down: transparent;
57
+ --system-spectrum-actionbutton-staticwhite-quiet-border-color-down: transparent;
58
+ --system-spectrum-actionbutton-staticblack-quiet-border-color-focus: transparent;
59
+ --system-spectrum-actionbutton-staticwhite-quiet-border-color-focus: transparent;
60
+ --system-spectrum-actionbutton-staticblack-quiet-border-color-disabled: transparent;
61
+ --system-spectrum-actionbutton-staticwhite-quiet-border-color-disabled: transparent;
62
+ --system-spectrum-actionbutton-staticblack-background-color-default: transparent;
63
+ --system-spectrum-actionbutton-staticblack-background-color-hover: var(
64
+ --spectrum-transparent-black-300
65
+ );
66
+ --system-spectrum-actionbutton-staticblack-background-color-down: var(
67
+ --spectrum-transparent-black-400
68
+ );
69
+ --system-spectrum-actionbutton-staticblack-background-color-focus: var(
70
+ --spectrum-transparent-black-300
71
+ );
72
+ --system-spectrum-actionbutton-staticblack-border-color-default: var(
73
+ --spectrum-transparent-black-400
74
+ );
75
+ --system-spectrum-actionbutton-staticblack-border-color-hover: var(
76
+ --spectrum-transparent-black-500
77
+ );
78
+ --system-spectrum-actionbutton-staticblack-border-color-down: var(
79
+ --spectrum-transparent-black-600
80
+ );
81
+ --system-spectrum-actionbutton-staticblack-border-color-focus: var(
82
+ --spectrum-transparent-black-500
83
+ );
84
+ --system-spectrum-actionbutton-staticblack-content-color-default: var(
85
+ --spectrum-black
86
+ );
87
+ --system-spectrum-actionbutton-staticblack-content-color-hover: var(
88
+ --spectrum-black
89
+ );
90
+ --system-spectrum-actionbutton-staticblack-content-color-down: var(
91
+ --spectrum-black
92
+ );
93
+ --system-spectrum-actionbutton-staticblack-content-color-focus: var(
94
+ --spectrum-black
95
+ );
96
+ --system-spectrum-actionbutton-staticblack-focus-indicator-color: var(
97
+ --spectrum-static-black-focus-indicator-color
98
+ );
99
+ --system-spectrum-actionbutton-staticblack-background-color-disabled: transparent;
100
+ --system-spectrum-actionbutton-staticblack-border-color-disabled: var(
101
+ --spectrum-disabled-static-black-border-color
102
+ );
103
+ --system-spectrum-actionbutton-staticblack-content-color-disabled: var(
104
+ --spectrum-disabled-static-black-content-color
105
+ );
106
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-background-color-default: var(
107
+ --spectrum-transparent-black-800
108
+ );
109
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-background-color-hover: var(
110
+ --spectrum-transparent-black-900
111
+ );
112
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-background-color-down: var(
113
+ --spectrum-transparent-black-900
114
+ );
115
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-background-color-focus: var(
116
+ --spectrum-transparent-black-900
117
+ );
118
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-content-color-default: var(
119
+ --spectrum-white
120
+ );
121
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-content-color-hover: var(
122
+ --spectrum-white
123
+ );
124
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-content-color-down: var(
125
+ --spectrum-white
126
+ );
127
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-content-color-focus: var(
128
+ --spectrum-white
129
+ );
130
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-background-color-disabled: var(
131
+ --spectrum-disabled-static-black-background-color
132
+ );
133
+ --system-spectrum-actionbutton-staticblack-selected-mod-actionbutton-border-color-disabled: transparent;
134
+ --system-spectrum-actionbutton-staticwhite-background-color-default: transparent;
135
+ --system-spectrum-actionbutton-staticwhite-background-color-hover: var(
136
+ --spectrum-transparent-white-300
137
+ );
138
+ --system-spectrum-actionbutton-staticwhite-background-color-down: var(
139
+ --spectrum-transparent-white-400
140
+ );
141
+ --system-spectrum-actionbutton-staticwhite-background-color-focus: var(
142
+ --spectrum-transparent-white-300
143
+ );
144
+ --system-spectrum-actionbutton-staticwhite-border-color-default: var(
145
+ --spectrum-transparent-white-400
146
+ );
147
+ --system-spectrum-actionbutton-staticwhite-border-color-hover: var(
148
+ --spectrum-transparent-white-500
149
+ );
150
+ --system-spectrum-actionbutton-staticwhite-border-color-down: var(
151
+ --spectrum-transparent-white-600
152
+ );
153
+ --system-spectrum-actionbutton-staticwhite-border-color-focus: var(
154
+ --spectrum-transparent-white-500
155
+ );
156
+ --system-spectrum-actionbutton-staticwhite-content-color-default: var(
157
+ --spectrum-white
158
+ );
159
+ --system-spectrum-actionbutton-staticwhite-content-color-hover: var(
160
+ --spectrum-white
161
+ );
162
+ --system-spectrum-actionbutton-staticwhite-content-color-down: var(
163
+ --spectrum-white
164
+ );
165
+ --system-spectrum-actionbutton-staticwhite-content-color-focus: var(
166
+ --spectrum-white
167
+ );
168
+ --system-spectrum-actionbutton-staticwhite-focus-indicator-color: var(
169
+ --spectrum-static-white-focus-indicator-color
170
+ );
171
+ --system-spectrum-actionbutton-staticwhite-background-color-disabled: transparent;
172
+ --system-spectrum-actionbutton-staticwhite-border-color-disabled: var(
173
+ --spectrum-disabled-static-white-border-color
174
+ );
175
+ --system-spectrum-actionbutton-staticwhite-content-color-disabled: var(
176
+ --spectrum-disabled-static-white-content-color
177
+ );
178
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-background-color-default: var(
179
+ --spectrum-transparent-white-800
180
+ );
181
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-background-color-hover: var(
182
+ --spectrum-transparent-white-900
183
+ );
184
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-background-color-down: var(
185
+ --spectrum-transparent-white-900
186
+ );
187
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-background-color-focus: var(
188
+ --spectrum-transparent-white-900
189
+ );
190
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-content-color-default: var(
191
+ --spectrum-black
192
+ );
193
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-content-color-hover: var(
194
+ --spectrum-black
195
+ );
196
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-content-color-down: var(
197
+ --spectrum-black
198
+ );
199
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-content-color-focus: var(
200
+ --spectrum-black
201
+ );
202
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-background-color-disabled: var(
203
+ --spectrum-disabled-static-white-background-color
204
+ );
205
+ --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-border-color-disabled: transparent;
206
+ }
207
+
208
+ :host,
209
+ :root {
210
+ --system-spectrum-actiongroup-gap-size-compact: 0;
211
+ --system-spectrum-actiongroup-horizontal-spacing-compact: -1px;
212
+ --system-spectrum-actiongroup-vertical-spacing-compact: -1px;
213
+ }
214
+
215
+ :host,
216
+ :root {
217
+ --system-spectrum-button-background-color-default: var(--spectrum-gray-75);
218
+ --system-spectrum-button-background-color-hover: var(--spectrum-gray-200);
219
+ --system-spectrum-button-background-color-down: var(--spectrum-gray-300);
220
+ --system-spectrum-button-background-color-focus: var(--spectrum-gray-200);
221
+ --system-spectrum-button-border-color-default: var(--spectrum-gray-400);
222
+ --system-spectrum-button-border-color-hover: var(--spectrum-gray-500);
223
+ --system-spectrum-button-border-color-down: var(--spectrum-gray-600);
224
+ --system-spectrum-button-border-color-focus: var(--spectrum-gray-500);
225
+ --system-spectrum-button-content-color-default: var(
226
+ --spectrum-neutral-content-color-default
227
+ );
228
+ --system-spectrum-button-content-color-hover: var(
229
+ --spectrum-neutral-content-color-hover
230
+ );
231
+ --system-spectrum-button-content-color-down: var(
232
+ --spectrum-neutral-content-color-down
233
+ );
234
+ --system-spectrum-button-content-color-focus: var(
235
+ --spectrum-neutral-content-color-key-focus
236
+ );
237
+ --system-spectrum-button-background-color-disabled: transparent;
238
+ --system-spectrum-button-border-color-disabled: var(
239
+ --spectrum-disabled-border-color
240
+ );
241
+ --system-spectrum-button-content-color-disabled: var(
242
+ --spectrum-disabled-content-color
243
+ );
244
+ --system-spectrum-button-accent-background-color-default: var(
245
+ --spectrum-accent-background-color-default
246
+ );
247
+ --system-spectrum-button-accent-background-color-hover: var(
248
+ --spectrum-accent-background-color-hover
249
+ );
250
+ --system-spectrum-button-accent-background-color-down: var(
251
+ --spectrum-accent-background-color-down
252
+ );
253
+ --system-spectrum-button-accent-background-color-focus: var(
254
+ --spectrum-accent-background-color-key-focus
255
+ );
256
+ --system-spectrum-button-accent-border-color-default: transparent;
257
+ --system-spectrum-button-accent-border-color-hover: transparent;
258
+ --system-spectrum-button-accent-border-color-down: transparent;
259
+ --system-spectrum-button-accent-border-color-focus: transparent;
260
+ --system-spectrum-button-accent-content-color-default: var(
261
+ --spectrum-white
262
+ );
263
+ --system-spectrum-button-accent-content-color-hover: var(--spectrum-white);
264
+ --system-spectrum-button-accent-content-color-down: var(--spectrum-white);
265
+ --system-spectrum-button-accent-content-color-focus: var(--spectrum-white);
266
+ --system-spectrum-button-accent-background-color-disabled: var(
267
+ --spectrum-disabled-background-color
268
+ );
269
+ --system-spectrum-button-accent-border-color-disabled: transparent;
270
+ --system-spectrum-button-accent-content-color-disabled: var(
271
+ --spectrum-disabled-content-color
272
+ );
273
+ --system-spectrum-button-accent-outline-background-color-default: transparent;
274
+ --system-spectrum-button-accent-outline-background-color-hover: var(
275
+ --spectrum-accent-color-200
276
+ );
277
+ --system-spectrum-button-accent-outline-background-color-down: var(
278
+ --spectrum-accent-color-300
279
+ );
280
+ --system-spectrum-button-accent-outline-background-color-focus: var(
281
+ --spectrum-accent-color-200
282
+ );
283
+ --system-spectrum-button-accent-outline-border-color-default: var(
284
+ --spectrum-accent-color-900
285
+ );
286
+ --system-spectrum-button-accent-outline-border-color-hover: var(
287
+ --spectrum-accent-color-1000
288
+ );
289
+ --system-spectrum-button-accent-outline-border-color-down: var(
290
+ --spectrum-accent-color-1100
291
+ );
292
+ --system-spectrum-button-accent-outline-border-color-focus: var(
293
+ --spectrum-accent-color-1000
294
+ );
295
+ --system-spectrum-button-accent-outline-content-color-default: var(
296
+ --spectrum-accent-content-color-default
297
+ );
298
+ --system-spectrum-button-accent-outline-content-color-hover: var(
299
+ --spectrum-accent-content-color-hover
300
+ );
301
+ --system-spectrum-button-accent-outline-content-color-down: var(
302
+ --spectrum-accent-content-color-down
303
+ );
304
+ --system-spectrum-button-accent-outline-content-color-focus: var(
305
+ --spectrum-accent-content-color-key-focus
306
+ );
307
+ --system-spectrum-button-accent-outline-background-color-disabled: transparent;
308
+ --system-spectrum-button-accent-outline-border-color-disabled: var(
309
+ --spectrum-disabled-border-color
310
+ );
311
+ --system-spectrum-button-accent-outline-content-color-disabled: var(
312
+ --spectrum-disabled-content-color
313
+ );
314
+ --system-spectrum-button-negative-background-color-default: var(
315
+ --spectrum-negative-background-color-default
316
+ );
317
+ --system-spectrum-button-negative-background-color-hover: var(
318
+ --spectrum-negative-background-color-hover
319
+ );
320
+ --system-spectrum-button-negative-background-color-down: var(
321
+ --spectrum-negative-background-color-down
322
+ );
323
+ --system-spectrum-button-negative-background-color-focus: var(
324
+ --spectrum-negative-background-color-key-focus
325
+ );
326
+ --system-spectrum-button-negative-border-color-default: transparent;
327
+ --system-spectrum-button-negative-border-color-hover: transparent;
328
+ --system-spectrum-button-negative-border-color-down: transparent;
329
+ --system-spectrum-button-negative-border-color-focus: transparent;
330
+ --system-spectrum-button-negative-content-color-default: var(
331
+ --spectrum-white
332
+ );
333
+ --system-spectrum-button-negative-content-color-hover: var(
334
+ --spectrum-white
335
+ );
336
+ --system-spectrum-button-negative-content-color-down: var(--spectrum-white);
337
+ --system-spectrum-button-negative-content-color-focus: var(
338
+ --spectrum-white
339
+ );
340
+ --system-spectrum-button-negative-background-color-disabled: var(
341
+ --spectrum-disabled-background-color
342
+ );
343
+ --system-spectrum-button-negative-border-color-disabled: transparent;
344
+ --system-spectrum-button-negative-content-color-disabled: var(
345
+ --spectrum-disabled-content-color
346
+ );
347
+ --system-spectrum-button-negative-outline-background-color-default: transparent;
348
+ --system-spectrum-button-negative-outline-background-color-hover: var(
349
+ --spectrum-negative-color-200
350
+ );
351
+ --system-spectrum-button-negative-outline-background-color-down: var(
352
+ --spectrum-negative-color-300
353
+ );
354
+ --system-spectrum-button-negative-outline-background-color-focus: var(
355
+ --spectrum-negative-color-200
356
+ );
357
+ --system-spectrum-button-negative-outline-border-color-default: var(
358
+ --spectrum-negative-color-900
359
+ );
360
+ --system-spectrum-button-negative-outline-border-color-hover: var(
361
+ --spectrum-negative-color-1000
362
+ );
363
+ --system-spectrum-button-negative-outline-border-color-down: var(
364
+ --spectrum-negative-color-1100
365
+ );
366
+ --system-spectrum-button-negative-outline-border-color-focus: var(
367
+ --spectrum-negative-color-1000
368
+ );
369
+ --system-spectrum-button-negative-outline-content-color-default: var(
370
+ --spectrum-negative-content-color-default
371
+ );
372
+ --system-spectrum-button-negative-outline-content-color-hover: var(
373
+ --spectrum-negative-content-color-hover
374
+ );
375
+ --system-spectrum-button-negative-outline-content-color-down: var(
376
+ --spectrum-negative-content-color-down
377
+ );
378
+ --system-spectrum-button-negative-outline-content-color-focus: var(
379
+ --spectrum-negative-content-color-key-focus
380
+ );
381
+ --system-spectrum-button-negative-outline-background-color-disabled: transparent;
382
+ --system-spectrum-button-negative-outline-border-color-disabled: var(
383
+ --spectrum-disabled-border-color
384
+ );
385
+ --system-spectrum-button-negative-outline-content-color-disabled: var(
386
+ --spectrum-disabled-content-color
387
+ );
388
+ --system-spectrum-button-primary-background-color-default: var(
389
+ --spectrum-neutral-background-color-default
390
+ );
391
+ --system-spectrum-button-primary-background-color-hover: var(
392
+ --spectrum-neutral-background-color-hover
393
+ );
394
+ --system-spectrum-button-primary-background-color-down: var(
395
+ --spectrum-neutral-background-color-down
396
+ );
397
+ --system-spectrum-button-primary-background-color-focus: var(
398
+ --spectrum-neutral-background-color-key-focus
399
+ );
400
+ --system-spectrum-button-primary-border-color-default: transparent;
401
+ --system-spectrum-button-primary-border-color-hover: transparent;
402
+ --system-spectrum-button-primary-border-color-down: transparent;
403
+ --system-spectrum-button-primary-border-color-focus: transparent;
404
+ --system-spectrum-button-primary-content-color-default: var(
405
+ --spectrum-white
406
+ );
407
+ --system-spectrum-button-primary-content-color-hover: var(--spectrum-white);
408
+ --system-spectrum-button-primary-content-color-down: var(--spectrum-white);
409
+ --system-spectrum-button-primary-content-color-focus: var(--spectrum-white);
410
+ --system-spectrum-button-primary-background-color-disabled: var(
411
+ --spectrum-disabled-background-color
412
+ );
413
+ --system-spectrum-button-primary-border-color-disabled: transparent;
414
+ --system-spectrum-button-primary-content-color-disabled: var(
415
+ --spectrum-disabled-content-color
416
+ );
417
+ --system-spectrum-button-primary-outline-background-color-default: transparent;
418
+ --system-spectrum-button-primary-outline-background-color-hover: var(
419
+ --spectrum-gray-300
420
+ );
421
+ --system-spectrum-button-primary-outline-background-color-down: var(
422
+ --spectrum-gray-400
423
+ );
424
+ --system-spectrum-button-primary-outline-background-color-focus: var(
425
+ --spectrum-gray-300
426
+ );
427
+ --system-spectrum-button-primary-outline-border-color-default: var(
428
+ --spectrum-gray-800
429
+ );
430
+ --system-spectrum-button-primary-outline-border-color-hover: var(
431
+ --spectrum-gray-900
432
+ );
433
+ --system-spectrum-button-primary-outline-border-color-down: var(
434
+ --spectrum-gray-900
435
+ );
436
+ --system-spectrum-button-primary-outline-border-color-focus: var(
437
+ --spectrum-gray-900
438
+ );
439
+ --system-spectrum-button-primary-outline-content-color-default: var(
440
+ --spectrum-neutral-content-color-default
441
+ );
442
+ --system-spectrum-button-primary-outline-content-color-hover: var(
443
+ --spectrum-neutral-content-color-hover
444
+ );
445
+ --system-spectrum-button-primary-outline-content-color-down: var(
446
+ --spectrum-neutral-content-color-down
447
+ );
448
+ --system-spectrum-button-primary-outline-content-color-focus: var(
449
+ --spectrum-neutral-content-color-key-focus
450
+ );
451
+ --system-spectrum-button-primary-outline-background-color-disabled: transparent;
452
+ --system-spectrum-button-primary-outline-border-color-disabled: var(
453
+ --spectrum-disabled-border-color
454
+ );
455
+ --system-spectrum-button-primary-outline-content-color-disabled: var(
456
+ --spectrum-disabled-content-color
457
+ );
458
+ --system-spectrum-button-secondary-background-color-default: var(
459
+ --spectrum-gray-200
460
+ );
461
+ --system-spectrum-button-secondary-background-color-hover: var(
462
+ --spectrum-gray-300
463
+ );
464
+ --system-spectrum-button-secondary-background-color-down: var(
465
+ --spectrum-gray-400
466
+ );
467
+ --system-spectrum-button-secondary-background-color-focus: var(
468
+ --spectrum-gray-300
469
+ );
470
+ --system-spectrum-button-secondary-border-color-default: transparent;
471
+ --system-spectrum-button-secondary-border-color-hover: transparent;
472
+ --system-spectrum-button-secondary-border-color-down: transparent;
473
+ --system-spectrum-button-secondary-border-color-focus: transparent;
474
+ --system-spectrum-button-secondary-content-color-default: var(
475
+ --spectrum-neutral-content-color-default
476
+ );
477
+ --system-spectrum-button-secondary-content-color-hover: var(
478
+ --spectrum-neutral-content-color-hover
479
+ );
480
+ --system-spectrum-button-secondary-content-color-down: var(
481
+ --spectrum-neutral-content-color-down
482
+ );
483
+ --system-spectrum-button-secondary-content-color-focus: var(
484
+ --spectrum-neutral-content-color-key-focus
485
+ );
486
+ --system-spectrum-button-secondary-background-color-disabled: var(
487
+ --spectrum-disabled-background-color
488
+ );
489
+ --system-spectrum-button-secondary-border-color-disabled: transparent;
490
+ --system-spectrum-button-secondary-content-color-disabled: var(
491
+ --spectrum-disabled-content-color
492
+ );
493
+ --system-spectrum-button-secondary-outline-background-color-default: transparent;
494
+ --system-spectrum-button-secondary-outline-background-color-hover: var(
495
+ --spectrum-gray-300
496
+ );
497
+ --system-spectrum-button-secondary-outline-background-color-down: var(
498
+ --spectrum-gray-400
499
+ );
500
+ --system-spectrum-button-secondary-outline-background-color-focus: var(
501
+ --spectrum-gray-300
502
+ );
503
+ --system-spectrum-button-secondary-outline-border-color-default: var(
504
+ --spectrum-gray-300
505
+ );
506
+ --system-spectrum-button-secondary-outline-border-color-hover: var(
507
+ --spectrum-gray-400
508
+ );
509
+ --system-spectrum-button-secondary-outline-border-color-down: var(
510
+ --spectrum-gray-500
511
+ );
512
+ --system-spectrum-button-secondary-outline-border-color-focus: var(
513
+ --spectrum-gray-400
514
+ );
515
+ --system-spectrum-button-secondary-outline-content-color-default: var(
516
+ --spectrum-neutral-content-color-default
517
+ );
518
+ --system-spectrum-button-secondary-outline-content-color-hover: var(
519
+ --spectrum-neutral-content-color-hover
520
+ );
521
+ --system-spectrum-button-secondary-outline-content-color-down: var(
522
+ --spectrum-neutral-content-color-down
523
+ );
524
+ --system-spectrum-button-secondary-outline-content-color-focus: var(
525
+ --spectrum-neutral-content-color-key-focus
526
+ );
527
+ --system-spectrum-button-secondary-outline-background-color-disabled: transparent;
528
+ --system-spectrum-button-secondary-outline-border-color-disabled: var(
529
+ --spectrum-disabled-border-color
530
+ );
531
+ --system-spectrum-button-secondary-outline-content-color-disabled: var(
532
+ --spectrum-disabled-content-color
533
+ );
534
+ --system-spectrum-button-quiet-background-color-default: transparent;
535
+ --system-spectrum-button-quiet-background-color-hover: var(
536
+ --spectrum-gray-200
537
+ );
538
+ --system-spectrum-button-quiet-background-color-down: var(
539
+ --spectrum-gray-300
540
+ );
541
+ --system-spectrum-button-quiet-background-color-focus: var(
542
+ --spectrum-gray-200
543
+ );
544
+ --system-spectrum-button-quiet-border-color-default: transparent;
545
+ --system-spectrum-button-quiet-border-color-hover: transparent;
546
+ --system-spectrum-button-quiet-border-color-down: transparent;
547
+ --system-spectrum-button-quiet-border-color-focus: transparent;
548
+ --system-spectrum-button-quiet-background-color-disabled: transparent;
549
+ --system-spectrum-button-quiet-border-color-disabled: transparent;
550
+ --system-spectrum-button-selected-background-color-default: var(
551
+ --spectrum-neutral-subdued-background-color-default
552
+ );
553
+ --system-spectrum-button-selected-background-color-hover: var(
554
+ --spectrum-neutral-subdued-background-color-hover
555
+ );
556
+ --system-spectrum-button-selected-background-color-down: var(
557
+ --spectrum-neutral-subdued-background-color-down
558
+ );
559
+ --system-spectrum-button-selected-background-color-focus: var(
560
+ --spectrum-neutral-subdued-background-color-key-focus
561
+ );
562
+ --system-spectrum-button-selected-border-color-default: transparent;
563
+ --system-spectrum-button-selected-border-color-hover: transparent;
564
+ --system-spectrum-button-selected-border-color-down: transparent;
565
+ --system-spectrum-button-selected-border-color-focus: transparent;
566
+ --system-spectrum-button-selected-content-color-default: var(
567
+ --spectrum-white
568
+ );
569
+ --system-spectrum-button-selected-content-color-hover: var(
570
+ --spectrum-white
571
+ );
572
+ --system-spectrum-button-selected-content-color-down: var(--spectrum-white);
573
+ --system-spectrum-button-selected-content-color-focus: var(
574
+ --spectrum-white
575
+ );
576
+ --system-spectrum-button-selected-background-color-disabled: var(
577
+ --spectrum-disabled-background-color
578
+ );
579
+ --system-spectrum-button-selected-border-color-disabled: transparent;
580
+ --system-spectrum-button-selected-emphasized-background-color-default: var(
581
+ --spectrum-accent-background-color-default
582
+ );
583
+ --system-spectrum-button-selected-emphasized-background-color-hover: var(
584
+ --spectrum-accent-background-color-hover
585
+ );
586
+ --system-spectrum-button-selected-emphasized-background-color-down: var(
587
+ --spectrum-accent-background-color-down
588
+ );
589
+ --system-spectrum-button-selected-emphasized-background-color-focus: var(
590
+ --spectrum-accent-background-color-key-focus
591
+ );
592
+ --system-spectrum-button-staticblack-quiet-border-color-default: transparent;
593
+ --system-spectrum-button-staticwhite-quiet-border-color-default: transparent;
594
+ --system-spectrum-button-staticblack-quiet-border-color-hover: transparent;
595
+ --system-spectrum-button-staticwhite-quiet-border-color-hover: transparent;
596
+ --system-spectrum-button-staticblack-quiet-border-color-down: transparent;
597
+ --system-spectrum-button-staticwhite-quiet-border-color-down: transparent;
598
+ --system-spectrum-button-staticblack-quiet-border-color-focus: transparent;
599
+ --system-spectrum-button-staticwhite-quiet-border-color-focus: transparent;
600
+ --system-spectrum-button-staticblack-quiet-border-color-disabled: transparent;
601
+ --system-spectrum-button-staticwhite-quiet-border-color-disabled: transparent;
602
+ --system-spectrum-button-staticwhite-background-color-default: var(
603
+ --spectrum-transparent-white-800
604
+ );
605
+ --system-spectrum-button-staticwhite-background-color-hover: var(
606
+ --spectrum-transparent-white-900
607
+ );
608
+ --system-spectrum-button-staticwhite-background-color-down: var(
609
+ --spectrum-transparent-white-900
610
+ );
611
+ --system-spectrum-button-staticwhite-background-color-focus: var(
612
+ --spectrum-transparent-white-900
613
+ );
614
+ --system-spectrum-button-staticwhite-border-color-default: transparent;
615
+ --system-spectrum-button-staticwhite-border-color-hover: transparent;
616
+ --system-spectrum-button-staticwhite-border-color-down: transparent;
617
+ --system-spectrum-button-staticwhite-border-color-focus: transparent;
618
+ --system-spectrum-button-staticwhite-content-color-default: var(
619
+ --spectrum-black
620
+ );
621
+ --system-spectrum-button-staticwhite-content-color-hover: var(
622
+ --spectrum-black
623
+ );
624
+ --system-spectrum-button-staticwhite-content-color-down: var(
625
+ --spectrum-black
626
+ );
627
+ --system-spectrum-button-staticwhite-content-color-focus: var(
628
+ --spectrum-black
629
+ );
630
+ --system-spectrum-button-staticwhite-focus-indicator-color: var(
631
+ --spectrum-static-white-focus-indicator-color
632
+ );
633
+ --system-spectrum-button-staticwhite-background-color-disabled: var(
634
+ --spectrum-disabled-static-white-background-color
635
+ );
636
+ --system-spectrum-button-staticwhite-border-color-disabled: transparent;
637
+ --system-spectrum-button-staticwhite-content-color-disabled: var(
638
+ --spectrum-disabled-static-white-content-color
639
+ );
640
+ --system-spectrum-button-staticwhite-outline-background-color-default: transparent;
641
+ --system-spectrum-button-staticwhite-outline-background-color-hover: var(
642
+ --spectrum-transparent-white-300
643
+ );
644
+ --system-spectrum-button-staticwhite-outline-background-color-down: var(
645
+ --spectrum-transparent-white-400
646
+ );
647
+ --system-spectrum-button-staticwhite-outline-background-color-focus: var(
648
+ --spectrum-transparent-white-300
649
+ );
650
+ --system-spectrum-button-staticwhite-outline-border-color-default: var(
651
+ --spectrum-transparent-white-800
652
+ );
653
+ --system-spectrum-button-staticwhite-outline-border-color-hover: var(
654
+ --spectrum-transparent-white-900
655
+ );
656
+ --system-spectrum-button-staticwhite-outline-border-color-down: var(
657
+ --spectrum-transparent-white-900
658
+ );
659
+ --system-spectrum-button-staticwhite-outline-border-color-focus: var(
660
+ --spectrum-transparent-white-900
661
+ );
662
+ --system-spectrum-button-staticwhite-outline-content-color-default: var(
663
+ --spectrum-white
664
+ );
665
+ --system-spectrum-button-staticwhite-outline-content-color-hover: var(
666
+ --spectrum-white
667
+ );
668
+ --system-spectrum-button-staticwhite-outline-content-color-down: var(
669
+ --spectrum-white
670
+ );
671
+ --system-spectrum-button-staticwhite-outline-content-color-focus: var(
672
+ --spectrum-white
673
+ );
674
+ --system-spectrum-button-staticwhite-outline-focus-indicator-color: var(
675
+ --spectrum-static-white-focus-indicator-color
676
+ );
677
+ --system-spectrum-button-staticwhite-outline-background-color-disabled: transparent;
678
+ --system-spectrum-button-staticwhite-outline-border-color-disabled: var(
679
+ --spectrum-disabled-static-white-border-color
680
+ );
681
+ --system-spectrum-button-staticwhite-outline-content-color-disabled: var(
682
+ --spectrum-disabled-static-white-content-color
683
+ );
684
+ --system-spectrum-button-staticwhite-selected-background-color-default: var(
685
+ --spectrum-transparent-white-800
686
+ );
687
+ --system-spectrum-button-staticwhite-selected-background-color-hover: var(
688
+ --spectrum-transparent-white-900
689
+ );
690
+ --system-spectrum-button-staticwhite-selected-background-color-down: var(
691
+ --spectrum-transparent-white-900
692
+ );
693
+ --system-spectrum-button-staticwhite-selected-background-color-focus: var(
694
+ --spectrum-transparent-white-900
695
+ );
696
+ --system-spectrum-button-staticwhite-selected-content-color-default: var(
697
+ --spectrum-black
698
+ );
699
+ --system-spectrum-button-staticwhite-selected-content-color-hover: var(
700
+ --spectrum-black
701
+ );
702
+ --system-spectrum-button-staticwhite-selected-content-color-down: var(
703
+ --spectrum-black
704
+ );
705
+ --system-spectrum-button-staticwhite-selected-content-color-focus: var(
706
+ --spectrum-black
707
+ );
708
+ --system-spectrum-button-staticwhite-selected-background-color-disabled: var(
709
+ --spectrum-disabled-static-white-background-color
710
+ );
711
+ --system-spectrum-button-staticwhite-selected-border-color-disabled: transparent;
712
+ --system-spectrum-button-staticwhite-secondary-background-color-default: var(
713
+ --spectrum-transparent-white-200
714
+ );
715
+ --system-spectrum-button-staticwhite-secondary-background-color-hover: var(
716
+ --spectrum-transparent-white-300
717
+ );
718
+ --system-spectrum-button-staticwhite-secondary-background-color-down: var(
719
+ --spectrum-transparent-white-400
720
+ );
721
+ --system-spectrum-button-staticwhite-secondary-background-color-focus: var(
722
+ --spectrum-transparent-white-300
723
+ );
724
+ --system-spectrum-button-staticwhite-secondary-border-color-default: transparent;
725
+ --system-spectrum-button-staticwhite-secondary-border-color-hover: transparent;
726
+ --system-spectrum-button-staticwhite-secondary-border-color-down: transparent;
727
+ --system-spectrum-button-staticwhite-secondary-border-color-focus: transparent;
728
+ --system-spectrum-button-staticwhite-secondary-content-color-default: var(
729
+ --spectrum-white
730
+ );
731
+ --system-spectrum-button-staticwhite-secondary-content-color-hover: var(
732
+ --spectrum-white
733
+ );
734
+ --system-spectrum-button-staticwhite-secondary-content-color-down: var(
735
+ --spectrum-white
736
+ );
737
+ --system-spectrum-button-staticwhite-secondary-content-color-focus: var(
738
+ --spectrum-white
739
+ );
740
+ --system-spectrum-button-staticwhite-secondary-focus-indicator-color: var(
741
+ --spectrum-static-white-focus-indicator-color
742
+ );
743
+ --system-spectrum-button-staticwhite-secondary-background-color-disabled: var(
744
+ --spectrum-disabled-static-white-background-color
745
+ );
746
+ --system-spectrum-button-staticwhite-secondary-border-color-disabled: transparent;
747
+ --system-spectrum-button-staticwhite-secondary-content-color-disabled: var(
748
+ --spectrum-disabled-static-white-content-color
749
+ );
750
+ --system-spectrum-button-staticwhite-secondary-outline-background-color-default: transparent;
751
+ --system-spectrum-button-staticwhite-secondary-outline-background-color-hover: var(
752
+ --spectrum-transparent-white-300
753
+ );
754
+ --system-spectrum-button-staticwhite-secondary-outline-background-color-down: var(
755
+ --spectrum-transparent-white-400
756
+ );
757
+ --system-spectrum-button-staticwhite-secondary-outline-background-color-focus: var(
758
+ --spectrum-transparent-white-300
759
+ );
760
+ --system-spectrum-button-staticwhite-secondary-outline-border-color-default: var(
761
+ --spectrum-transparent-white-300
762
+ );
763
+ --system-spectrum-button-staticwhite-secondary-outline-border-color-hover: var(
764
+ --spectrum-transparent-white-400
765
+ );
766
+ --system-spectrum-button-staticwhite-secondary-outline-border-color-down: var(
767
+ --spectrum-transparent-white-500
768
+ );
769
+ --system-spectrum-button-staticwhite-secondary-outline-border-color-focus: var(
770
+ --spectrum-transparent-white-400
771
+ );
772
+ --system-spectrum-button-staticwhite-secondary-outline-content-color-default: var(
773
+ --spectrum-white
774
+ );
775
+ --system-spectrum-button-staticwhite-secondary-outline-content-color-hover: var(
776
+ --spectrum-white
777
+ );
778
+ --system-spectrum-button-staticwhite-secondary-outline-content-color-down: var(
779
+ --spectrum-white
780
+ );
781
+ --system-spectrum-button-staticwhite-secondary-outline-content-color-focus: var(
782
+ --spectrum-white
783
+ );
784
+ --system-spectrum-button-staticwhite-secondary-outline-focus-indicator-color: var(
785
+ --spectrum-static-white-focus-indicator-color
786
+ );
787
+ --system-spectrum-button-staticwhite-secondary-outline-background-color-disabled: transparent;
788
+ --system-spectrum-button-staticwhite-secondary-outline-border-color-disabled: var(
789
+ --spectrum-disabled-static-white-border-color
790
+ );
791
+ --system-spectrum-button-staticwhite-secondary-outline-content-color-disabled: var(
792
+ --spectrum-disabled-static-white-content-color
793
+ );
794
+ --system-spectrum-button-staticblack-background-color-default: var(
795
+ --spectrum-transparent-black-800
796
+ );
797
+ --system-spectrum-button-staticblack-background-color-hover: var(
798
+ --spectrum-transparent-black-900
799
+ );
800
+ --system-spectrum-button-staticblack-background-color-down: var(
801
+ --spectrum-transparent-black-900
802
+ );
803
+ --system-spectrum-button-staticblack-background-color-focus: var(
804
+ --spectrum-transparent-black-900
805
+ );
806
+ --system-spectrum-button-staticblack-border-color-default: transparent;
807
+ --system-spectrum-button-staticblack-border-color-hover: transparent;
808
+ --system-spectrum-button-staticblack-border-color-down: transparent;
809
+ --system-spectrum-button-staticblack-border-color-focus: transparent;
810
+ --system-spectrum-button-staticblack-content-color-default: var(
811
+ --spectrum-white
812
+ );
813
+ --system-spectrum-button-staticblack-content-color-hover: var(
814
+ --spectrum-white
815
+ );
816
+ --system-spectrum-button-staticblack-content-color-down: var(
817
+ --spectrum-white
818
+ );
819
+ --system-spectrum-button-staticblack-content-color-focus: var(
820
+ --spectrum-white
821
+ );
822
+ --system-spectrum-button-staticblack-focus-indicator-color: var(
823
+ --spectrum-static-black-focus-indicator-color
824
+ );
825
+ --system-spectrum-button-staticblack-background-color-disabled: var(
826
+ --spectrum-disabled-static-black-background-color
827
+ );
828
+ --system-spectrum-button-staticblack-border-color-disabled: transparent;
829
+ --system-spectrum-button-staticblack-content-color-disabled: var(
830
+ --spectrum-disabled-static-black-content-color
831
+ );
832
+ --system-spectrum-button-staticblack-outline-background-color-default: transparent;
833
+ --system-spectrum-button-staticblack-outline-background-color-hover: var(
834
+ --spectrum-transparent-black-300
835
+ );
836
+ --system-spectrum-button-staticblack-outline-background-color-down: var(
837
+ --spectrum-transparent-black-400
838
+ );
839
+ --system-spectrum-button-staticblack-outline-background-color-focus: var(
840
+ --spectrum-transparent-black-300
841
+ );
842
+ --system-spectrum-button-staticblack-outline-border-color-default: var(
843
+ --spectrum-transparent-black-400
844
+ );
845
+ --system-spectrum-button-staticblack-outline-border-color-hover: var(
846
+ --spectrum-transparent-black-500
847
+ );
848
+ --system-spectrum-button-staticblack-outline-border-color-down: var(
849
+ --spectrum-transparent-black-600
850
+ );
851
+ --system-spectrum-button-staticblack-outline-border-color-focus: var(
852
+ --spectrum-transparent-black-500
853
+ );
854
+ --system-spectrum-button-staticblack-outline-content-color-default: var(
855
+ --spectrum-black
856
+ );
857
+ --system-spectrum-button-staticblack-outline-content-color-hover: var(
858
+ --spectrum-black
859
+ );
860
+ --system-spectrum-button-staticblack-outline-content-color-down: var(
861
+ --spectrum-black
862
+ );
863
+ --system-spectrum-button-staticblack-outline-content-color-focus: var(
864
+ --spectrum-black
865
+ );
866
+ --system-spectrum-button-staticblack-outline-focus-indicator-color: var(
867
+ --spectrum-static-black-focus-indicator-color
868
+ );
869
+ --system-spectrum-button-staticblack-outline-background-color-disabled: transparent;
870
+ --system-spectrum-button-staticblack-outline-border-color-disabled: var(
871
+ --spectrum-disabled-static-black-border-color
872
+ );
873
+ --system-spectrum-button-staticblack-outline-content-color-disabled: var(
874
+ --spectrum-disabled-static-black-content-color
875
+ );
876
+ --system-spectrum-button-staticblack-secondary-background-color-default: var(
877
+ --spectrum-transparent-black-200
878
+ );
879
+ --system-spectrum-button-staticblack-secondary-background-color-hover: var(
880
+ --spectrum-transparent-black-300
881
+ );
882
+ --system-spectrum-button-staticblack-secondary-background-color-down: var(
883
+ --spectrum-transparent-black-400
884
+ );
885
+ --system-spectrum-button-staticblack-secondary-background-color-focus: var(
886
+ --spectrum-transparent-black-300
887
+ );
888
+ --system-spectrum-button-staticblack-secondary-border-color-default: transparent;
889
+ --system-spectrum-button-staticblack-secondary-border-color-hover: transparent;
890
+ --system-spectrum-button-staticblack-secondary-border-color-down: transparent;
891
+ --system-spectrum-button-staticblack-secondary-border-color-focus: transparent;
892
+ --system-spectrum-button-staticblack-secondary-content-color-default: var(
893
+ --spectrum-black
894
+ );
895
+ --system-spectrum-button-staticblack-secondary-content-color-hover: var(
896
+ --spectrum-black
897
+ );
898
+ --system-spectrum-button-staticblack-secondary-content-color-down: var(
899
+ --spectrum-black
900
+ );
901
+ --system-spectrum-button-staticblack-secondary-content-color-focus: var(
902
+ --spectrum-black
903
+ );
904
+ --system-spectrum-button-staticblack-secondary-focus-indicator-color: var(
905
+ --spectrum-static-black-focus-indicator-color
906
+ );
907
+ --system-spectrum-button-staticblack-secondary-background-color-disabled: var(
908
+ --spectrum-disabled-static-black-background-color
909
+ );
910
+ --system-spectrum-button-staticblack-secondary-border-color-disabled: transparent;
911
+ --system-spectrum-button-staticblack-secondary-content-color-disabled: var(
912
+ --spectrum-disabled-static-black-content-color
913
+ );
914
+ --system-spectrum-button-staticblack-secondary-outline-background-color-default: transparent;
915
+ --system-spectrum-button-staticblack-secondary-outline-background-color-hover: var(
916
+ --spectrum-transparent-black-300
917
+ );
918
+ --system-spectrum-button-staticblack-secondary-outline-background-color-down: var(
919
+ --spectrum-transparent-black-400
920
+ );
921
+ --system-spectrum-button-staticblack-secondary-outline-background-color-focus: var(
922
+ --spectrum-transparent-black-300
923
+ );
924
+ --system-spectrum-button-staticblack-secondary-outline-border-color-default: var(
925
+ --spectrum-transparent-black-300
926
+ );
927
+ --system-spectrum-button-staticblack-secondary-outline-border-color-hover: var(
928
+ --spectrum-transparent-black-400
929
+ );
930
+ --system-spectrum-button-staticblack-secondary-outline-border-color-down: var(
931
+ --spectrum-transparent-black-500
932
+ );
933
+ --system-spectrum-button-staticblack-secondary-outline-border-color-focus: var(
934
+ --spectrum-transparent-black-400
935
+ );
936
+ --system-spectrum-button-staticblack-secondary-outline-content-color-default: var(
937
+ --spectrum-black
938
+ );
939
+ --system-spectrum-button-staticblack-secondary-outline-content-color-hover: var(
940
+ --spectrum-black
941
+ );
942
+ --system-spectrum-button-staticblack-secondary-outline-content-color-down: var(
943
+ --spectrum-black
944
+ );
945
+ --system-spectrum-button-staticblack-secondary-outline-content-color-focus: var(
946
+ --spectrum-black
947
+ );
948
+ --system-spectrum-button-staticblack-secondary-outline-focus-indicator-color: var(
949
+ --spectrum-static-black-focus-indicator-color
950
+ );
951
+ --system-spectrum-button-staticblack-secondary-outline-background-color-disabled: transparent;
952
+ --system-spectrum-button-staticblack-secondary-outline-border-color-disabled: var(
953
+ --spectrum-disabled-static-black-border-color
954
+ );
955
+ --system-spectrum-button-staticblack-secondary-outline-content-color-disabled: var(
956
+ --spectrum-disabled-static-black-content-color
957
+ );
958
+ }
959
+
960
+ :host,
961
+ :root {
962
+ --system-spectrum-checkbox-control-color-default: var(--spectrum-gray-600);
963
+ --system-spectrum-checkbox-control-color-hover: var(--spectrum-gray-700);
964
+ --system-spectrum-checkbox-control-color-down: var(--spectrum-gray-800);
965
+ --system-spectrum-checkbox-control-color-focus: var(--spectrum-gray-700);
966
+ }
967
+
968
+ :host,
969
+ :root {
970
+ --system-spectrum-closebutton-background-color-default: transparent;
971
+ --system-spectrum-closebutton-background-color-hover: var(
972
+ --spectrum-gray-200
973
+ );
974
+ --system-spectrum-closebutton-background-color-down: var(
975
+ --spectrum-gray-300
976
+ );
977
+ --system-spectrum-closebutton-background-color-focus: var(
978
+ --spectrum-gray-200
979
+ );
980
+ }
981
+
982
+ :host,
983
+ :root {
984
+ --system-spectrum-combobox-border-color-default: var(--spectrum-gray-500);
985
+ --system-spectrum-combobox-border-color-hover: var(--spectrum-gray-600);
986
+ --system-spectrum-combobox-border-color-focus: var(--spectrum-gray-500);
987
+ --system-spectrum-combobox-border-color-focus-hover: var(
988
+ --spectrum-gray-600
989
+ );
990
+ --system-spectrum-combobox-border-color-key-focus: var(--spectrum-gray-600);
991
+ }
992
+
993
+ :host,
994
+ :root {
995
+ --system-spectrum-infieldbutton-spectrum-infield-button-border-width: var(
996
+ --spectrum-border-width-100
997
+ );
998
+ --system-spectrum-infieldbutton-spectrum-infield-button-border-color: inherit;
999
+ --system-spectrum-infieldbutton-spectrum-infield-button-border-radius: var(
1000
+ --spectrum-corner-radius-100
1001
+ );
1002
+ --system-spectrum-infieldbutton-spectrum-infield-button-border-radius-reset: 0;
1003
+ --system-spectrum-infieldbutton-spectrum-infield-button-stacked-top-border-radius-start-start: var(
1004
+ --spectrum-infield-button-border-radius-reset
1005
+ );
1006
+ --system-spectrum-infieldbutton-spectrum-infield-button-stacked-bottom-border-radius-end-start: var(
1007
+ --spectrum-infield-button-border-radius-reset
1008
+ );
1009
+ --system-spectrum-infieldbutton-spectrum-infield-button-background-color: var(
1010
+ --spectrum-gray-75
1011
+ );
1012
+ --system-spectrum-infieldbutton-spectrum-infield-button-background-color-hover: var(
1013
+ --spectrum-gray-200
1014
+ );
1015
+ --system-spectrum-infieldbutton-spectrum-infield-button-background-color-down: var(
1016
+ --spectrum-gray-300
1017
+ );
1018
+ --system-spectrum-infieldbutton-spectrum-infield-button-background-color-key-focus: var(
1019
+ --spectrum-gray-200
1020
+ );
1021
+ }
1022
+
1023
+ :host,
1024
+ :root {
1025
+ --system-spectrum-picker-background-color-default: var(--spectrum-gray-75);
1026
+ --system-spectrum-picker-background-color-default-open: var(
1027
+ --spectrum-gray-200
1028
+ );
1029
+ --system-spectrum-picker-background-color-active: var(--spectrum-gray-300);
1030
+ --system-spectrum-picker-background-color-hover: var(--spectrum-gray-200);
1031
+ --system-spectrum-picker-background-color-hover-open: var(
1032
+ --spectrum-gray-200
1033
+ );
1034
+ --system-spectrum-picker-background-color-key-focus: var(
1035
+ --spectrum-gray-200
1036
+ );
1037
+ --system-spectrum-picker-border-color-default: var(--spectrum-gray-500);
1038
+ --system-spectrum-picker-border-color-default-open: var(
1039
+ --spectrum-gray-500
1040
+ );
1041
+ --system-spectrum-picker-border-color-hover: var(--spectrum-gray-600);
1042
+ --system-spectrum-picker-border-color-hover-open: var(--spectrum-gray-600);
1043
+ --system-spectrum-picker-border-color-active: var(--spectrum-gray-700);
1044
+ --system-spectrum-picker-border-color-key-focus: var(--spectrum-gray-600);
1045
+ --system-spectrum-picker-border-width: var(--spectrum-border-width-100);
1046
+ }
1047
+
1048
+ :host,
1049
+ :root {
1050
+ --system-spectrum-pickerbutton-spectrum-picker-button-background-color: var(
1051
+ --spectrum-gray-75
1052
+ );
1053
+ --system-spectrum-pickerbutton-spectrum-picker-button-background-color-hover: var(
1054
+ --spectrum-gray-200
1055
+ );
1056
+ --system-spectrum-pickerbutton-spectrum-picker-button-background-color-down: var(
1057
+ --spectrum-gray-300
1058
+ );
1059
+ --system-spectrum-pickerbutton-spectrum-picker-button-background-color-key-focus: var(
1060
+ --spectrum-gray-200
1061
+ );
1062
+ --system-spectrum-pickerbutton-spectrum-picker-button-border-color: inherit;
1063
+ --system-spectrum-pickerbutton-spectrum-picker-button-border-radius: var(
1064
+ --spectrum-corner-radius-100
1065
+ );
1066
+ --system-spectrum-pickerbutton-spectrum-picker-button-border-radius-rounded-sided: 0;
1067
+ --system-spectrum-pickerbutton-spectrum-picker-button-border-radius-sided: 0;
1068
+ --system-spectrum-pickerbutton-spectrum-picker-button-border-width: var(
1069
+ --spectrum-border-width-100
1070
+ );
1071
+ }
1072
+
1073
+ :host,
1074
+ :root {
1075
+ --system-spectrum-popover-border-width: var(--spectrum-border-width-100);
1076
+ }
1077
+
1078
+ :host,
1079
+ :root {
1080
+ --system-spectrum-radio-button-border-color-default: var(
1081
+ --spectrum-gray-600
1082
+ );
1083
+ --system-spectrum-radio-button-border-color-hover: var(--spectrum-gray-700);
1084
+ --system-spectrum-radio-button-border-color-down: var(--spectrum-gray-800);
1085
+ --system-spectrum-radio-button-border-color-focus: var(--spectrum-gray-700);
1086
+ --system-spectrum-radio-emphasized-button-checked-border-color-default: var(
1087
+ --spectrum-accent-color-900
1088
+ );
1089
+ --system-spectrum-radio-emphasized-button-checked-border-color-hover: var(
1090
+ --spectrum-accent-color-1000
1091
+ );
1092
+ --system-spectrum-radio-emphasized-button-checked-border-color-down: var(
1093
+ --spectrum-accent-color-1100
1094
+ );
1095
+ --system-spectrum-radio-emphasized-button-checked-border-color-focus: var(
1096
+ --spectrum-accent-color-1000
1097
+ );
1098
+ }
1099
+
1100
+ :host,
1101
+ :root {
1102
+ --system-spectrum-search-border-radius: var(--spectrum-corner-radius-100);
1103
+ --system-spectrum-search-edge-to-visual: var(
1104
+ --spectrum-component-edge-to-visual-100
1105
+ );
1106
+ --system-spectrum-search-border-color-default: var(--spectrum-gray-500);
1107
+ --system-spectrum-search-border-color-hover: var(--spectrum-gray-600);
1108
+ --system-spectrum-search-border-color-focus: var(--spectrum-gray-800);
1109
+ --system-spectrum-search-border-color-focus-hover: var(--spectrum-gray-900);
1110
+ --system-spectrum-search-border-color-key-focus: var(--spectrum-gray-900);
1111
+ --system-spectrum-search-sizes-border-radius: var(
1112
+ --spectrum-corner-radius-100
1113
+ );
1114
+ --system-spectrum-search-sizes-edge-to-visual: var(
1115
+ --spectrum-component-edge-to-visual-75
1116
+ );
1117
+ --system-spectrum-search-sizem-border-radius: var(
1118
+ --spectrum-corner-radius-100
1119
+ );
1120
+ --system-spectrum-search-sizem-edge-to-visual: var(
1121
+ --spectrum-component-edge-to-visual-100
1122
+ );
1123
+ --system-spectrum-search-sizel-border-radius: var(
1124
+ --spectrum-corner-radius-100
1125
+ );
1126
+ --system-spectrum-search-sizel-edge-to-visual: var(
1127
+ --spectrum-component-edge-to-visual-200
1128
+ );
1129
+ --system-spectrum-search-sizexl-border-radius: var(
1130
+ --spectrum-corner-radius-100
1131
+ );
1132
+ --system-spectrum-search-sizexl-edge-to-visual: var(
1133
+ --spectrum-component-edge-to-visual-300
1134
+ );
1135
+ }
1136
+
1137
+ :host,
1138
+ :root {
1139
+ --system-spectrum-slider-track-color: var(--spectrum-gray-300);
1140
+ --system-spectrum-slider-track-fill-color: var(--spectrum-gray-700);
1141
+ --system-spectrum-slider-ramp-track-color: var(--spectrum-gray-400);
1142
+ --system-spectrum-slider-ramp-track-color-disabled: var(
1143
+ --spectrum-gray-200
1144
+ );
1145
+ --system-spectrum-slider-handle-background-color: transparent;
1146
+ --system-spectrum-slider-handle-background-color-disabled: transparent;
1147
+ --system-spectrum-slider-ramp-handle-background-color: var(
1148
+ --spectrum-gray-100
1149
+ );
1150
+ --system-spectrum-slider-ticks-handle-background-color: var(
1151
+ --spectrum-gray-100
1152
+ );
1153
+ --system-spectrum-slider-handle-border-color: var(--spectrum-gray-700);
1154
+ --system-spectrum-slider-handle-disabled-background-color: var(
1155
+ --spectrum-gray-100
1156
+ );
1157
+ --system-spectrum-slider-tick-mark-color: var(--spectrum-gray-300);
1158
+ --system-spectrum-slider-handle-border-color-hover: var(
1159
+ --spectrum-gray-800
1160
+ );
1161
+ --system-spectrum-slider-handle-border-color-down: var(--spectrum-gray-800);
1162
+ --system-spectrum-slider-handle-border-color-key-focus: var(
1163
+ --spectrum-gray-800
1164
+ );
1165
+ --system-spectrum-slider-handle-focus-ring-color-key-focus: var(
1166
+ --spectrum-focus-indicator-color
1167
+ );
1168
+ }
1169
+
1170
+ :host,
1171
+ :root {
1172
+ --system-spectrum-stepper-border-width: var(--spectrum-border-width-100);
1173
+ --system-spectrum-stepper-buttons-border-style: none;
1174
+ --system-spectrum-stepper-buttons-border-width: 0;
1175
+ --system-spectrum-stepper-buttons-border-color: var(--spectrum-gray-500);
1176
+ --system-spectrum-stepper-buttons-background-color: var(--spectrum-gray-50);
1177
+ --system-spectrum-stepper-buttons-border-color-hover: var(
1178
+ --spectrum-gray-600
1179
+ );
1180
+ --system-spectrum-stepper-buttons-border-color-focus: var(
1181
+ --spectrum-gray-800
1182
+ );
1183
+ --system-spectrum-stepper-buttons-border-color-keyboard-focus: var(
1184
+ --spectrum-gray-900
1185
+ );
1186
+ --system-spectrum-stepper-button-border-radius-reset: 0px;
1187
+ --system-spectrum-stepper-button-border-width: var(
1188
+ --spectrum-border-width-100
1189
+ );
1190
+ --system-spectrum-stepper-border-color: var(--spectrum-gray-500);
1191
+ --system-spectrum-stepper-border-color-hover: var(--spectrum-gray-600);
1192
+ --system-spectrum-stepper-border-color-focus: var(--spectrum-gray-800);
1193
+ --system-spectrum-stepper-border-color-focus-hover: var(
1194
+ --spectrum-gray-800
1195
+ );
1196
+ --system-spectrum-stepper-border-color-keyboard-focus: var(
1197
+ --spectrum-gray-900
1198
+ );
1199
+ --system-spectrum-stepper-border-color-invalid: var(
1200
+ --spectrum-negative-border-color-default
1201
+ );
1202
+ --system-spectrum-stepper-border-color-focus-invalid: var(
1203
+ --spectrum-negative-border-color-focus
1204
+ );
1205
+ --system-spectrum-stepper-border-color-focus-hover-invalid: var(
1206
+ --spectrum-negative-border-color-focus-hover
1207
+ );
1208
+ --system-spectrum-stepper-border-color-keyboard-focus-invalid: var(
1209
+ --spectrum-negative-border-color-key-focus
1210
+ );
1211
+ --system-spectrum-stepper-button-background-color-focus: var(
1212
+ --spectrum-gray-300
1213
+ );
1214
+ --system-spectrum-stepper-button-background-color-keyboard-focus: var(
1215
+ --spectrum-gray-200
1216
+ );
1217
+ }
1218
+
1219
+ :host,
1220
+ :root {
1221
+ --system-spectrum-switch-handle-border-color-default: var(
1222
+ --spectrum-gray-600
1223
+ );
1224
+ --system-spectrum-switch-handle-border-color-hover: var(
1225
+ --spectrum-gray-700
1226
+ );
1227
+ --system-spectrum-switch-handle-border-color-down: var(--spectrum-gray-800);
1228
+ --system-spectrum-switch-handle-border-color-focus: var(
1229
+ --spectrum-gray-700
1230
+ );
1231
+ --system-spectrum-switch-handle-border-color-selected-default: var(
1232
+ --spectrum-gray-700
1233
+ );
1234
+ --system-spectrum-switch-handle-border-color-selected-hover: var(
1235
+ --spectrum-gray-800
1236
+ );
1237
+ --system-spectrum-switch-handle-border-color-selected-down: var(
1238
+ --spectrum-gray-900
1239
+ );
1240
+ --system-spectrum-switch-handle-border-color-selected-focus: var(
1241
+ --spectrum-gray-800
1242
+ );
1243
+ }
1244
+
1245
+ :host,
1246
+ :root {
1247
+ --system-spectrum-tabs-font-weight: var(--spectrum-default-font-weight);
1248
+ }
1249
+
1250
+ :host,
1251
+ :root {
1252
+ --system-spectrum-tag-border-color: var(--spectrum-gray-700);
1253
+ --system-spectrum-tag-border-color-hover: var(--spectrum-gray-800);
1254
+ --system-spectrum-tag-border-color-active: var(--spectrum-gray-900);
1255
+ --system-spectrum-tag-border-color-focus: var(--spectrum-gray-800);
1256
+ --system-spectrum-tag-size-small-corner-radius: var(
1257
+ --spectrum-corner-radius-100
1258
+ );
1259
+ --system-spectrum-tag-size-medium-corner-radius: var(
1260
+ --spectrum-corner-radius-100
1261
+ );
1262
+ --system-spectrum-tag-size-large-corner-radius: var(
1263
+ --spectrum-corner-radius-100
1264
+ );
1265
+ --system-spectrum-tag-background-color: var(--spectrum-gray-75);
1266
+ --system-spectrum-tag-background-color-hover: var(--spectrum-gray-75);
1267
+ --system-spectrum-tag-background-color-active: var(--spectrum-gray-200);
1268
+ --system-spectrum-tag-background-color-focus: var(--spectrum-gray-75);
1269
+ --system-spectrum-tag-content-color: var(
1270
+ --spectrum-neutral-subdued-content-color-default
1271
+ );
1272
+ --system-spectrum-tag-content-color-hover: var(
1273
+ --spectrum-neutral-subdued-content-color-hover
1274
+ );
1275
+ --system-spectrum-tag-content-color-active: var(
1276
+ --spectrum-neutral-subdued-content-color-down
1277
+ );
1278
+ --system-spectrum-tag-content-color-focus: var(
1279
+ --spectrum-neutral-subdued-content-color-key-focus
1280
+ );
1281
+ --system-spectrum-tag-border-color-selected: var(
1282
+ --spectrum-neutral-subdued-background-color-default
1283
+ );
1284
+ --system-spectrum-tag-border-color-selected-hover: var(
1285
+ --spectrum-neutral-subdued-background-color-hover
1286
+ );
1287
+ --system-spectrum-tag-border-color-selected-active: var(
1288
+ --spectrum-neutral-subdued-background-color-down
1289
+ );
1290
+ --system-spectrum-tag-border-color-selected-focus: var(
1291
+ --spectrum-neutral-subdued-background-color-key-focus
1292
+ );
1293
+ --system-spectrum-tag-border-color-disabled: transparent;
1294
+ --system-spectrum-tag-background-color-disabled: var(
1295
+ --spectrum-disabled-background-color
1296
+ );
1297
+ --system-spectrum-tag-size-small-spacing-inline-start: var(
1298
+ --spectrum-component-edge-to-visual-75
1299
+ );
1300
+ --system-spectrum-tag-size-small-label-spacing-inline-end: var(
1301
+ --spectrum-component-edge-to-text-75
1302
+ );
1303
+ --system-spectrum-tag-size-small-clear-button-spacing-inline-end: var(
1304
+ --spectrum-component-edge-to-visual-75
1305
+ );
1306
+ --system-spectrum-tag-size-medium-spacing-inline-start: var(
1307
+ --spectrum-component-edge-to-visual-100
1308
+ );
1309
+ --system-spectrum-tag-size-medium-label-spacing-inline-end: var(
1310
+ --spectrum-component-edge-to-text-100
1311
+ );
1312
+ --system-spectrum-tag-size-medium-clear-button-spacing-inline-end: var(
1313
+ --spectrum-component-edge-to-visual-100
1314
+ );
1315
+ --system-spectrum-tag-size-large-spacing-inline-start: var(
1316
+ --spectrum-component-edge-to-visual-200
1317
+ );
1318
+ --system-spectrum-tag-size-large-label-spacing-inline-end: var(
1319
+ --spectrum-component-edge-to-text-200
1320
+ );
1321
+ --system-spectrum-tag-size-large-clear-button-spacing-inline-end: var(
1322
+ --spectrum-component-edge-to-visual-200
1323
+ );
1324
+ }
1325
+
1326
+ :host,
1327
+ :root {
1328
+ --system-spectrum-textfield-border-color: var(--spectrum-gray-500);
1329
+ --system-spectrum-textfield-border-color-hover: var(--spectrum-gray-600);
1330
+ --system-spectrum-textfield-border-color-focus: var(--spectrum-gray-800);
1331
+ --system-spectrum-textfield-border-color-focus-hover: var(
1332
+ --spectrum-gray-900
1333
+ );
1334
+ --system-spectrum-textfield-border-color-keyboard-focus: var(
1335
+ --spectrum-gray-900
1336
+ );
1337
+ --system-spectrum-textfield-border-width: var(--spectrum-border-width-100);
1338
+ }
1339
+
1340
+ :host,
1341
+ :root {
1342
+ --system-spectrum-toast-background-color-default: var(
1343
+ --spectrum-neutral-subdued-background-color-default
1344
+ );
1345
+ }
1346
+
1347
+ :host,
1348
+ :root {
1349
+ --system-spectrum-tooltip-backgound-color-default-neutral: var(
1350
+ --spectrum-neutral-subdued-background-color-default
1351
+ );
1352
+ }