@wordpress/theme 0.1.1-next.2f1c7c01b.0 → 0.2.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/bin/terrazzo-plugin-ds-tokens-docs/index.ts +5 -24
- package/bin/terrazzo-plugin-inline-alias-values/index.ts +84 -0
- package/bin/terrazzo-plugin-known-wpds-css-variables/index.ts +19 -39
- package/build/color-ramps/lib/constants.js +4 -4
- package/build/color-ramps/lib/constants.js.map +2 -2
- package/build/color-ramps/lib/default-ramps.js +82 -82
- package/build/color-ramps/lib/default-ramps.js.map +1 -1
- package/build/color-ramps/lib/find-color-with-constraints.js +36 -53
- package/build/color-ramps/lib/find-color-with-constraints.js.map +2 -2
- package/build/color-ramps/lib/index.js +64 -63
- package/build/color-ramps/lib/index.js.map +2 -2
- package/build/color-ramps/lib/ramp-configs.js +3 -3
- package/build/color-ramps/lib/ramp-configs.js.map +1 -1
- package/build/color-ramps/lib/utils.js +63 -2
- package/build/color-ramps/lib/utils.js.map +2 -2
- package/build/prebuilt/js/design-tokens.js +5 -10
- package/build/prebuilt/js/design-tokens.js.map +2 -2
- package/build/prebuilt/json/figma.json +105 -905
- package/build/prebuilt/ts/color-tokens.js +137 -0
- package/build/prebuilt/ts/color-tokens.js.map +7 -0
- package/build/token-id.js +30 -0
- package/build/token-id.js.map +7 -0
- package/build/use-theme-provider-styles.js +18 -27
- package/build/use-theme-provider-styles.js.map +3 -3
- package/build-module/color-ramps/lib/constants.js +3 -3
- package/build-module/color-ramps/lib/constants.js.map +2 -2
- package/build-module/color-ramps/lib/default-ramps.js +82 -82
- package/build-module/color-ramps/lib/default-ramps.js.map +1 -1
- package/build-module/color-ramps/lib/find-color-with-constraints.js +38 -60
- package/build-module/color-ramps/lib/find-color-with-constraints.js.map +2 -2
- package/build-module/color-ramps/lib/index.js +68 -65
- package/build-module/color-ramps/lib/index.js.map +2 -2
- package/build-module/color-ramps/lib/ramp-configs.js +3 -3
- package/build-module/color-ramps/lib/ramp-configs.js.map +1 -1
- package/build-module/color-ramps/lib/utils.js +63 -2
- package/build-module/color-ramps/lib/utils.js.map +2 -2
- package/build-module/prebuilt/js/design-tokens.js +5 -10
- package/build-module/prebuilt/js/design-tokens.js.map +2 -2
- package/build-module/prebuilt/json/figma.json +105 -905
- package/build-module/prebuilt/ts/color-tokens.js +117 -0
- package/build-module/prebuilt/ts/color-tokens.js.map +7 -0
- package/build-module/token-id.js +6 -0
- package/build-module/token-id.js.map +7 -0
- package/build-module/use-theme-provider-styles.js +18 -27
- package/build-module/use-theme-provider-styles.js.map +2 -2
- package/build-types/color-ramps/lib/constants.d.ts +2 -2
- package/build-types/color-ramps/lib/constants.d.ts.map +1 -1
- package/build-types/color-ramps/lib/find-color-with-constraints.d.ts +2 -3
- package/build-types/color-ramps/lib/find-color-with-constraints.d.ts.map +1 -1
- package/build-types/color-ramps/lib/index.d.ts.map +1 -1
- package/build-types/color-ramps/lib/utils.d.ts +21 -2
- package/build-types/color-ramps/lib/utils.d.ts.map +1 -1
- package/build-types/color-ramps/stories/index.story.d.ts.map +1 -1
- package/build-types/prebuilt/ts/color-tokens.d.ts +7 -0
- package/build-types/prebuilt/ts/color-tokens.d.ts.map +1 -0
- package/build-types/stories/index.story.d.ts.map +1 -1
- package/build-types/theme-provider.d.ts.map +1 -1
- package/build-types/token-id.d.ts +9 -0
- package/build-types/token-id.d.ts.map +1 -0
- package/build-types/use-theme-provider-styles.d.ts.map +1 -1
- package/docs/ds-tokens.md +10 -178
- package/package.json +4 -4
- package/src/color-ramps/lib/constants.ts +7 -5
- package/src/color-ramps/lib/default-ramps.ts +82 -82
- package/src/color-ramps/lib/find-color-with-constraints.ts +53 -77
- package/src/color-ramps/lib/index.ts +98 -102
- package/src/color-ramps/lib/ramp-configs.ts +3 -3
- package/src/color-ramps/lib/utils.ts +109 -5
- package/src/color-ramps/test/__snapshots__/index.test.ts.snap +45706 -360
- package/src/color-ramps/test/index.test.ts +41 -14
- package/src/prebuilt/css/design-tokens.css +88 -413
- package/src/prebuilt/js/design-tokens.js +5 -10
- package/src/prebuilt/json/figma.json +105 -905
- package/src/prebuilt/ts/color-tokens.ts +117 -0
- package/src/stories/index.story.tsx +4 -18
- package/src/test/token-id.test.ts +12 -0
- package/src/token-id.ts +9 -0
- package/src/use-theme-provider-styles.ts +20 -35
- package/terrazzo.config.ts +15 -12
- package/tokens/color.json +82 -82
- package/tokens/dimension.json +75 -0
- package/tsconfig.bin.tsbuildinfo +1 -1
- package/tsconfig.src.tsbuildinfo +1 -1
- package/build/prebuilt/ts/design-tokens.js +0 -391
- package/build/prebuilt/ts/design-tokens.js.map +0 -7
- package/build-module/prebuilt/ts/design-tokens.js +0 -371
- package/build-module/prebuilt/ts/design-tokens.js.map +0 -7
- package/build-types/prebuilt/ts/design-tokens.d.ts +0 -7
- package/build-types/prebuilt/ts/design-tokens.d.ts.map +0 -1
- package/src/prebuilt/ts/design-tokens.ts +0 -371
- package/tokens/spacing.json +0 -45
|
@@ -30,857 +30,87 @@
|
|
|
30
30
|
},
|
|
31
31
|
"description": "Border width for focus ring"
|
|
32
32
|
},
|
|
33
|
-
"Color/_Primitives/Primary/bgFill1": {
|
|
34
|
-
"value": {
|
|
35
|
-
".": "#3858e9"
|
|
36
|
-
}
|
|
37
|
-
},
|
|
38
|
-
"Color/_Primitives/Primary/fgFill": {
|
|
39
|
-
"value": {
|
|
40
|
-
".": "#eff0f2"
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
"Color/_Primitives/Primary/bgFill2": {
|
|
44
|
-
"value": {
|
|
45
|
-
".": "#2c47d7"
|
|
46
|
-
}
|
|
47
|
-
},
|
|
48
|
-
"Color/_Primitives/Primary/surface2": {
|
|
49
|
-
"value": {
|
|
50
|
-
".": "#f6f8fc"
|
|
51
|
-
}
|
|
52
|
-
},
|
|
53
|
-
"Color/_Primitives/Primary/surface6": {
|
|
54
|
-
"value": {
|
|
55
|
-
".": "#c4d0ee"
|
|
56
|
-
}
|
|
57
|
-
},
|
|
58
|
-
"Color/_Primitives/Primary/surface5": {
|
|
59
|
-
"value": {
|
|
60
|
-
".": "#d8e0f3"
|
|
61
|
-
}
|
|
62
|
-
},
|
|
63
|
-
"Color/_Primitives/Primary/surface4": {
|
|
64
|
-
"value": {
|
|
65
|
-
".": "#e5eaf7"
|
|
66
|
-
}
|
|
67
|
-
},
|
|
68
|
-
"Color/_Primitives/Primary/surface3": {
|
|
69
|
-
"value": {
|
|
70
|
-
".": "#fff"
|
|
71
|
-
}
|
|
72
|
-
},
|
|
73
|
-
"Color/_Primitives/Primary/fgSurface4": {
|
|
74
|
-
"value": {
|
|
75
|
-
".": "#080071"
|
|
76
|
-
}
|
|
77
|
-
},
|
|
78
|
-
"Color/_Primitives/Primary/fgSurface3": {
|
|
79
|
-
"value": {
|
|
80
|
-
".": "#3858e9"
|
|
81
|
-
}
|
|
82
|
-
},
|
|
83
|
-
"Color/_Primitives/Primary/fgSurface2": {
|
|
84
|
-
"value": {
|
|
85
|
-
".": "#5780ff"
|
|
86
|
-
}
|
|
87
|
-
},
|
|
88
|
-
"Color/_Primitives/Primary/fgSurface1": {
|
|
89
|
-
"value": {
|
|
90
|
-
".": "#81a7ff"
|
|
91
|
-
}
|
|
92
|
-
},
|
|
93
|
-
"Color/_Primitives/Primary/stroke3": {
|
|
94
|
-
"value": {
|
|
95
|
-
".": "#3858e9"
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
"Color/_Primitives/Primary/stroke4": {
|
|
99
|
-
"value": {
|
|
100
|
-
".": "#2236c7"
|
|
101
|
-
}
|
|
102
|
-
},
|
|
103
|
-
"Color/_Primitives/Primary/stroke2": {
|
|
104
|
-
"value": {
|
|
105
|
-
".": "#6f85c0"
|
|
106
|
-
}
|
|
107
|
-
},
|
|
108
|
-
"Color/_Primitives/Primary/stroke1": {
|
|
109
|
-
"value": {
|
|
110
|
-
".": "#92a4cf"
|
|
111
|
-
}
|
|
112
|
-
},
|
|
113
|
-
"Color/_Primitives/Primary/bgFillDark": {
|
|
114
|
-
"value": {
|
|
115
|
-
".": "#1b1e26"
|
|
116
|
-
}
|
|
117
|
-
},
|
|
118
|
-
"Color/_Primitives/Primary/fgFillDark": {
|
|
119
|
-
"value": {
|
|
120
|
-
".": "#eff0f2"
|
|
121
|
-
}
|
|
122
|
-
},
|
|
123
|
-
"Color/_Primitives/Primary/bgFillInverted2": {
|
|
124
|
-
"value": {
|
|
125
|
-
".": "#1b1e26"
|
|
126
|
-
}
|
|
127
|
-
},
|
|
128
|
-
"Color/_Primitives/Primary/bgFillInverted1": {
|
|
129
|
-
"value": {
|
|
130
|
-
".": "#1401a4"
|
|
131
|
-
}
|
|
132
|
-
},
|
|
133
|
-
"Color/_Primitives/Primary/fgFillInverted": {
|
|
134
|
-
"value": {
|
|
135
|
-
".": "#eff0f2"
|
|
136
|
-
}
|
|
137
|
-
},
|
|
138
|
-
"Color/_Primitives/Primary/surface1": {
|
|
139
|
-
"value": {
|
|
140
|
-
".": "#ecf0f9"
|
|
141
|
-
}
|
|
142
|
-
},
|
|
143
|
-
"Color/_Primitives/Info/bgFill1": {
|
|
144
|
-
"value": {
|
|
145
|
-
".": "#0090ff"
|
|
146
|
-
}
|
|
147
|
-
},
|
|
148
|
-
"Color/_Primitives/Info/fgFill": {
|
|
149
|
-
"value": {
|
|
150
|
-
".": "#1b1e23"
|
|
151
|
-
}
|
|
152
|
-
},
|
|
153
|
-
"Color/_Primitives/Info/bgFill2": {
|
|
154
|
-
"value": {
|
|
155
|
-
".": "#007eec"
|
|
156
|
-
}
|
|
157
|
-
},
|
|
158
|
-
"Color/_Primitives/Info/surface2": {
|
|
159
|
-
"value": {
|
|
160
|
-
".": "#f5f9fd"
|
|
161
|
-
}
|
|
162
|
-
},
|
|
163
|
-
"Color/_Primitives/Info/surface6": {
|
|
164
|
-
"value": {
|
|
165
|
-
".": "#bad3f0"
|
|
166
|
-
}
|
|
167
|
-
},
|
|
168
|
-
"Color/_Primitives/Info/surface5": {
|
|
169
|
-
"value": {
|
|
170
|
-
".": "#d1e1f5"
|
|
171
|
-
}
|
|
172
|
-
},
|
|
173
|
-
"Color/_Primitives/Info/surface4": {
|
|
174
|
-
"value": {
|
|
175
|
-
".": "#e1ecf8"
|
|
176
|
-
}
|
|
177
|
-
},
|
|
178
|
-
"Color/_Primitives/Info/surface3": {
|
|
179
|
-
"value": {
|
|
180
|
-
".": "#fff"
|
|
181
|
-
}
|
|
182
|
-
},
|
|
183
|
-
"Color/_Primitives/Info/fgSurface4": {
|
|
184
|
-
"value": {
|
|
185
|
-
".": "#001758"
|
|
186
|
-
}
|
|
187
|
-
},
|
|
188
|
-
"Color/_Primitives/Info/fgSurface3": {
|
|
189
|
-
"value": {
|
|
190
|
-
".": "#006cd8"
|
|
191
|
-
}
|
|
192
|
-
},
|
|
193
|
-
"Color/_Primitives/Info/fgSurface2": {
|
|
194
|
-
"value": {
|
|
195
|
-
".": "#008bfa"
|
|
196
|
-
}
|
|
197
|
-
},
|
|
198
|
-
"Color/_Primitives/Info/fgSurface1": {
|
|
199
|
-
"value": {
|
|
200
|
-
".": "#4dafff"
|
|
201
|
-
}
|
|
202
|
-
},
|
|
203
|
-
"Color/_Primitives/Info/stroke3": {
|
|
204
|
-
"value": {
|
|
205
|
-
".": "#006cd8"
|
|
206
|
-
}
|
|
207
|
-
},
|
|
208
|
-
"Color/_Primitives/Info/stroke4": {
|
|
209
|
-
"value": {
|
|
210
|
-
".": "#004bb5"
|
|
211
|
-
}
|
|
212
|
-
},
|
|
213
|
-
"Color/_Primitives/Info/stroke2": {
|
|
214
|
-
"value": {
|
|
215
|
-
".": "#5e90c7"
|
|
216
|
-
}
|
|
217
|
-
},
|
|
218
|
-
"Color/_Primitives/Info/stroke1": {
|
|
219
|
-
"value": {
|
|
220
|
-
".": "#8baed6"
|
|
221
|
-
}
|
|
222
|
-
},
|
|
223
|
-
"Color/_Primitives/Info/bgFillDark": {
|
|
224
|
-
"value": {
|
|
225
|
-
".": "#1b1e23"
|
|
226
|
-
}
|
|
227
|
-
},
|
|
228
|
-
"Color/_Primitives/Info/fgFillDark": {
|
|
229
|
-
"value": {
|
|
230
|
-
".": "#eff0f2"
|
|
231
|
-
}
|
|
232
|
-
},
|
|
233
|
-
"Color/_Primitives/Info/bgFillInverted2": {
|
|
234
|
-
"value": {
|
|
235
|
-
".": "#1b1e23"
|
|
236
|
-
}
|
|
237
|
-
},
|
|
238
|
-
"Color/_Primitives/Info/bgFillInverted1": {
|
|
239
|
-
"value": {
|
|
240
|
-
".": "#00297a"
|
|
241
|
-
}
|
|
242
|
-
},
|
|
243
|
-
"Color/_Primitives/Info/fgFillInverted": {
|
|
244
|
-
"value": {
|
|
245
|
-
".": "#eff0f2"
|
|
246
|
-
}
|
|
247
|
-
},
|
|
248
|
-
"Color/_Primitives/Info/surface1": {
|
|
249
|
-
"value": {
|
|
250
|
-
".": "#e9f1fa"
|
|
251
|
-
}
|
|
252
|
-
},
|
|
253
|
-
"Color/_Primitives/Success/bgFill1": {
|
|
254
|
-
"value": {
|
|
255
|
-
".": "#4ab866"
|
|
256
|
-
}
|
|
257
|
-
},
|
|
258
|
-
"Color/_Primitives/Success/fgFill": {
|
|
259
|
-
"value": {
|
|
260
|
-
".": "#1b1f1c"
|
|
261
|
-
}
|
|
262
|
-
},
|
|
263
|
-
"Color/_Primitives/Success/bgFill2": {
|
|
264
|
-
"value": {
|
|
265
|
-
".": "#34a554"
|
|
266
|
-
}
|
|
267
|
-
},
|
|
268
|
-
"Color/_Primitives/Success/surface2": {
|
|
269
|
-
"value": {
|
|
270
|
-
".": "#f0fcf2"
|
|
271
|
-
}
|
|
272
|
-
},
|
|
273
|
-
"Color/_Primitives/Success/surface6": {
|
|
274
|
-
"value": {
|
|
275
|
-
".": "#7be792"
|
|
276
|
-
}
|
|
277
|
-
},
|
|
278
|
-
"Color/_Primitives/Success/surface5": {
|
|
279
|
-
"value": {
|
|
280
|
-
".": "#acf0b7"
|
|
281
|
-
}
|
|
282
|
-
},
|
|
283
|
-
"Color/_Primitives/Success/surface4": {
|
|
284
|
-
"value": {
|
|
285
|
-
".": "#cdf5d3"
|
|
286
|
-
}
|
|
287
|
-
},
|
|
288
|
-
"Color/_Primitives/Success/surface3": {
|
|
289
|
-
"value": {
|
|
290
|
-
".": "#fff"
|
|
291
|
-
}
|
|
292
|
-
},
|
|
293
|
-
"Color/_Primitives/Success/fgSurface4": {
|
|
294
|
-
"value": {
|
|
295
|
-
".": "#002b00"
|
|
296
|
-
}
|
|
297
|
-
},
|
|
298
|
-
"Color/_Primitives/Success/fgSurface3": {
|
|
299
|
-
"value": {
|
|
300
|
-
".": "#008030"
|
|
301
|
-
}
|
|
302
|
-
},
|
|
303
|
-
"Color/_Primitives/Success/fgSurface2": {
|
|
304
|
-
"value": {
|
|
305
|
-
".": "#2a9e4d"
|
|
306
|
-
}
|
|
307
|
-
},
|
|
308
|
-
"Color/_Primitives/Success/fgSurface1": {
|
|
309
|
-
"value": {
|
|
310
|
-
".": "#52bf6d"
|
|
311
|
-
}
|
|
312
|
-
},
|
|
313
|
-
"Color/_Primitives/Success/stroke3": {
|
|
314
|
-
"value": {
|
|
315
|
-
".": "#008030"
|
|
316
|
-
}
|
|
317
|
-
},
|
|
318
|
-
"Color/_Primitives/Success/stroke4": {
|
|
319
|
-
"value": {
|
|
320
|
-
".": "#006113"
|
|
321
|
-
}
|
|
322
|
-
},
|
|
323
|
-
"Color/_Primitives/Success/stroke2": {
|
|
324
|
-
"value": {
|
|
325
|
-
".": "#62996c"
|
|
326
|
-
}
|
|
327
|
-
},
|
|
328
|
-
"Color/_Primitives/Success/stroke1": {
|
|
329
|
-
"value": {
|
|
330
|
-
".": "#78ba84"
|
|
331
|
-
}
|
|
332
|
-
},
|
|
333
|
-
"Color/_Primitives/Success/bgFillDark": {
|
|
334
|
-
"value": {
|
|
335
|
-
".": "#1b1f1c"
|
|
336
|
-
}
|
|
337
|
-
},
|
|
338
|
-
"Color/_Primitives/Success/fgFillDark": {
|
|
339
|
-
"value": {
|
|
340
|
-
".": "#edf2ed"
|
|
341
|
-
}
|
|
342
|
-
},
|
|
343
|
-
"Color/_Primitives/Success/bgFillInverted2": {
|
|
344
|
-
"value": {
|
|
345
|
-
".": "#1b1f1c"
|
|
346
|
-
}
|
|
347
|
-
},
|
|
348
|
-
"Color/_Primitives/Success/bgFillInverted1": {
|
|
349
|
-
"value": {
|
|
350
|
-
".": "#003a00"
|
|
351
|
-
}
|
|
352
|
-
},
|
|
353
|
-
"Color/_Primitives/Success/fgFillInverted": {
|
|
354
|
-
"value": {
|
|
355
|
-
".": "#edf2ed"
|
|
356
|
-
}
|
|
357
|
-
},
|
|
358
|
-
"Color/_Primitives/Success/surface1": {
|
|
359
|
-
"value": {
|
|
360
|
-
".": "#ddf8e0"
|
|
361
|
-
}
|
|
362
|
-
},
|
|
363
|
-
"Color/_Primitives/Warning/bgFill1": {
|
|
364
|
-
"value": {
|
|
365
|
-
".": "#f0b849"
|
|
366
|
-
}
|
|
367
|
-
},
|
|
368
|
-
"Color/_Primitives/Warning/fgFill": {
|
|
369
|
-
"value": {
|
|
370
|
-
".": "#1f1e1b"
|
|
371
|
-
}
|
|
372
|
-
},
|
|
373
|
-
"Color/_Primitives/Warning/bgFill2": {
|
|
374
|
-
"value": {
|
|
375
|
-
".": "#dba430"
|
|
376
|
-
}
|
|
377
|
-
},
|
|
378
|
-
"Color/_Primitives/Warning/surface2": {
|
|
379
|
-
"value": {
|
|
380
|
-
".": "#fdf7ee"
|
|
381
|
-
}
|
|
382
|
-
},
|
|
383
|
-
"Color/_Primitives/Warning/surface6": {
|
|
384
|
-
"value": {
|
|
385
|
-
".": "#f0cb89"
|
|
386
|
-
}
|
|
387
|
-
},
|
|
388
|
-
"Color/_Primitives/Warning/surface5": {
|
|
389
|
-
"value": {
|
|
390
|
-
".": "#f5ddb2"
|
|
391
|
-
}
|
|
392
|
-
},
|
|
393
|
-
"Color/_Primitives/Warning/surface4": {
|
|
394
|
-
"value": {
|
|
395
|
-
".": "#f8e9cd"
|
|
396
|
-
}
|
|
397
|
-
},
|
|
398
|
-
"Color/_Primitives/Warning/surface3": {
|
|
399
|
-
"value": {
|
|
400
|
-
".": "#fff"
|
|
401
|
-
}
|
|
402
|
-
},
|
|
403
|
-
"Color/_Primitives/Warning/fgSurface4": {
|
|
404
|
-
"value": {
|
|
405
|
-
".": "#2f1800"
|
|
406
|
-
}
|
|
407
|
-
},
|
|
408
|
-
"Color/_Primitives/Warning/fgSurface3": {
|
|
409
|
-
"value": {
|
|
410
|
-
".": "#966200"
|
|
411
|
-
}
|
|
412
|
-
},
|
|
413
|
-
"Color/_Primitives/Warning/fgSurface2": {
|
|
414
|
-
"value": {
|
|
415
|
-
".": "#b58000"
|
|
416
|
-
}
|
|
417
|
-
},
|
|
418
|
-
"Color/_Primitives/Warning/fgSurface1": {
|
|
419
|
-
"value": {
|
|
420
|
-
".": "#d7a02b"
|
|
421
|
-
}
|
|
422
|
-
},
|
|
423
|
-
"Color/_Primitives/Warning/stroke3": {
|
|
424
|
-
"value": {
|
|
425
|
-
".": "#966200"
|
|
426
|
-
}
|
|
427
|
-
},
|
|
428
|
-
"Color/_Primitives/Warning/stroke4": {
|
|
429
|
-
"value": {
|
|
430
|
-
".": "#724700"
|
|
431
|
-
}
|
|
432
|
-
},
|
|
433
|
-
"Color/_Primitives/Warning/stroke2": {
|
|
434
|
-
"value": {
|
|
435
|
-
".": "#a08961"
|
|
436
|
-
}
|
|
437
|
-
},
|
|
438
|
-
"Color/_Primitives/Warning/stroke1": {
|
|
439
|
-
"value": {
|
|
440
|
-
".": "#c2a777"
|
|
441
|
-
}
|
|
442
|
-
},
|
|
443
|
-
"Color/_Primitives/Warning/bgFillDark": {
|
|
444
|
-
"value": {
|
|
445
|
-
".": "#1f1e1b"
|
|
446
|
-
}
|
|
447
|
-
},
|
|
448
|
-
"Color/_Primitives/Warning/fgFillDark": {
|
|
449
|
-
"value": {
|
|
450
|
-
".": "#f3f0e9"
|
|
451
|
-
}
|
|
452
|
-
},
|
|
453
|
-
"Color/_Primitives/Warning/bgFillInverted2": {
|
|
454
|
-
"value": {
|
|
455
|
-
".": "#1f1e1b"
|
|
456
|
-
}
|
|
457
|
-
},
|
|
458
|
-
"Color/_Primitives/Warning/bgFillInverted1": {
|
|
459
|
-
"value": {
|
|
460
|
-
".": "#472900"
|
|
461
|
-
}
|
|
462
|
-
},
|
|
463
|
-
"Color/_Primitives/Warning/fgFillInverted": {
|
|
464
|
-
"value": {
|
|
465
|
-
".": "#f3f0e9"
|
|
466
|
-
}
|
|
467
|
-
},
|
|
468
|
-
"Color/_Primitives/Warning/surface1": {
|
|
469
|
-
"value": {
|
|
470
|
-
".": "#faefdb"
|
|
471
|
-
}
|
|
472
|
-
},
|
|
473
|
-
"Color/_Primitives/Error/bgFill1": {
|
|
474
|
-
"value": {
|
|
475
|
-
".": "#cc1818"
|
|
476
|
-
}
|
|
477
|
-
},
|
|
478
|
-
"Color/_Primitives/Error/fgFill": {
|
|
479
|
-
"value": {
|
|
480
|
-
".": "#f2efef"
|
|
481
|
-
}
|
|
482
|
-
},
|
|
483
|
-
"Color/_Primitives/Error/bgFill2": {
|
|
484
|
-
"value": {
|
|
485
|
-
".": "#b90000"
|
|
486
|
-
}
|
|
487
|
-
},
|
|
488
|
-
"Color/_Primitives/Error/surface2": {
|
|
489
|
-
"value": {
|
|
490
|
-
".": "#fdf6f5"
|
|
491
|
-
}
|
|
492
|
-
},
|
|
493
|
-
"Color/_Primitives/Error/surface6": {
|
|
494
|
-
"value": {
|
|
495
|
-
".": "#f5c5be"
|
|
496
|
-
}
|
|
497
|
-
},
|
|
498
|
-
"Color/_Primitives/Error/surface5": {
|
|
499
|
-
"value": {
|
|
500
|
-
".": "#f8d8d3"
|
|
501
|
-
}
|
|
502
|
-
},
|
|
503
|
-
"Color/_Primitives/Error/surface4": {
|
|
504
|
-
"value": {
|
|
505
|
-
".": "#fae6e2"
|
|
506
|
-
}
|
|
507
|
-
},
|
|
508
|
-
"Color/_Primitives/Error/surface3": {
|
|
509
|
-
"value": {
|
|
510
|
-
".": "#fff"
|
|
511
|
-
}
|
|
512
|
-
},
|
|
513
|
-
"Color/_Primitives/Error/fgSurface4": {
|
|
514
|
-
"value": {
|
|
515
|
-
".": "#4a0000"
|
|
516
|
-
}
|
|
517
|
-
},
|
|
518
|
-
"Color/_Primitives/Error/fgSurface3": {
|
|
519
|
-
"value": {
|
|
520
|
-
".": "#cc1818"
|
|
521
|
-
}
|
|
522
|
-
},
|
|
523
|
-
"Color/_Primitives/Error/fgSurface2": {
|
|
524
|
-
"value": {
|
|
525
|
-
".": "#f64b40"
|
|
526
|
-
}
|
|
527
|
-
},
|
|
528
|
-
"Color/_Primitives/Error/fgSurface1": {
|
|
529
|
-
"value": {
|
|
530
|
-
".": "#ff8070"
|
|
531
|
-
}
|
|
532
|
-
},
|
|
533
|
-
"Color/_Primitives/Error/stroke3": {
|
|
534
|
-
"value": {
|
|
535
|
-
".": "#cc1818"
|
|
536
|
-
}
|
|
537
|
-
},
|
|
538
|
-
"Color/_Primitives/Error/stroke4": {
|
|
539
|
-
"value": {
|
|
540
|
-
".": "#a40000"
|
|
541
|
-
}
|
|
542
|
-
},
|
|
543
|
-
"Color/_Primitives/Error/stroke2": {
|
|
544
|
-
"value": {
|
|
545
|
-
".": "#cd695d"
|
|
546
|
-
}
|
|
547
|
-
},
|
|
548
|
-
"Color/_Primitives/Error/stroke1": {
|
|
549
|
-
"value": {
|
|
550
|
-
".": "#dc9085"
|
|
551
|
-
}
|
|
552
|
-
},
|
|
553
|
-
"Color/_Primitives/Error/bgFillDark": {
|
|
554
|
-
"value": {
|
|
555
|
-
".": "#231c1b"
|
|
556
|
-
}
|
|
557
|
-
},
|
|
558
|
-
"Color/_Primitives/Error/fgFillDark": {
|
|
559
|
-
"value": {
|
|
560
|
-
".": "#f2efef"
|
|
561
|
-
}
|
|
562
|
-
},
|
|
563
|
-
"Color/_Primitives/Error/bgFillInverted2": {
|
|
564
|
-
"value": {
|
|
565
|
-
".": "#231c1b"
|
|
566
|
-
}
|
|
567
|
-
},
|
|
568
|
-
"Color/_Primitives/Error/bgFillInverted1": {
|
|
569
|
-
"value": {
|
|
570
|
-
".": "#6d0000"
|
|
571
|
-
}
|
|
572
|
-
},
|
|
573
|
-
"Color/_Primitives/Error/fgFillInverted": {
|
|
574
|
-
"value": {
|
|
575
|
-
".": "#f2efef"
|
|
576
|
-
}
|
|
577
|
-
},
|
|
578
|
-
"Color/_Primitives/Error/surface1": {
|
|
579
|
-
"value": {
|
|
580
|
-
".": "#fcecea"
|
|
581
|
-
}
|
|
582
|
-
},
|
|
583
|
-
"Color/_Primitives/Bg/surface2": {
|
|
584
|
-
"value": {
|
|
585
|
-
".": "#f8f8f8"
|
|
586
|
-
}
|
|
587
|
-
},
|
|
588
|
-
"Color/_Primitives/Bg/bgFill1": {
|
|
589
|
-
"value": {
|
|
590
|
-
".": "#555"
|
|
591
|
-
}
|
|
592
|
-
},
|
|
593
|
-
"Color/_Primitives/Bg/fgFill": {
|
|
594
|
-
"value": {
|
|
595
|
-
".": "#f0f0f0"
|
|
596
|
-
}
|
|
597
|
-
},
|
|
598
|
-
"Color/_Primitives/Bg/bgFill2": {
|
|
599
|
-
"value": {
|
|
600
|
-
".": "#474747"
|
|
601
|
-
}
|
|
602
|
-
},
|
|
603
|
-
"Color/_Primitives/Bg/surface6": {
|
|
604
|
-
"value": {
|
|
605
|
-
".": "#d0d0d0"
|
|
606
|
-
}
|
|
607
|
-
},
|
|
608
|
-
"Color/_Primitives/Bg/surface5": {
|
|
609
|
-
"value": {
|
|
610
|
-
".": "#dfdfdf"
|
|
611
|
-
}
|
|
612
|
-
},
|
|
613
|
-
"Color/_Primitives/Bg/surface4": {
|
|
614
|
-
"value": {
|
|
615
|
-
".": "#eaeaea"
|
|
616
|
-
}
|
|
617
|
-
},
|
|
618
|
-
"Color/_Primitives/Bg/surface3": {
|
|
619
|
-
"value": {
|
|
620
|
-
".": "#fff"
|
|
621
|
-
}
|
|
622
|
-
},
|
|
623
|
-
"Color/_Primitives/Bg/fgSurface4": {
|
|
624
|
-
"value": {
|
|
625
|
-
".": "#1e1e1e"
|
|
626
|
-
}
|
|
627
|
-
},
|
|
628
|
-
"Color/_Primitives/Bg/fgSurface3": {
|
|
629
|
-
"value": {
|
|
630
|
-
".": "#6d6d6d"
|
|
631
|
-
}
|
|
632
|
-
},
|
|
633
|
-
"Color/_Primitives/Bg/fgSurface2": {
|
|
634
|
-
"value": {
|
|
635
|
-
".": "#898989"
|
|
636
|
-
}
|
|
637
|
-
},
|
|
638
|
-
"Color/_Primitives/Bg/fgSurface1": {
|
|
639
|
-
"value": {
|
|
640
|
-
".": "#a9a9a9"
|
|
641
|
-
}
|
|
642
|
-
},
|
|
643
|
-
"Color/_Primitives/Bg/stroke3": {
|
|
644
|
-
"value": {
|
|
645
|
-
".": "#898989"
|
|
646
|
-
}
|
|
647
|
-
},
|
|
648
|
-
"Color/_Primitives/Bg/stroke4": {
|
|
649
|
-
"value": {
|
|
650
|
-
".": "#6a6a6a"
|
|
651
|
-
}
|
|
652
|
-
},
|
|
653
|
-
"Color/_Primitives/Bg/stroke2": {
|
|
654
|
-
"value": {
|
|
655
|
-
".": "#adadad"
|
|
656
|
-
}
|
|
657
|
-
},
|
|
658
|
-
"Color/_Primitives/Bg/stroke1": {
|
|
659
|
-
"value": {
|
|
660
|
-
".": "#d0d0d0"
|
|
661
|
-
}
|
|
662
|
-
},
|
|
663
|
-
"Color/_Primitives/Bg/bgFillDark": {
|
|
664
|
-
"value": {
|
|
665
|
-
".": "#1e1e1e"
|
|
666
|
-
}
|
|
667
|
-
},
|
|
668
|
-
"Color/_Primitives/Bg/fgFillDark": {
|
|
669
|
-
"value": {
|
|
670
|
-
".": "#f0f0f0"
|
|
671
|
-
}
|
|
672
|
-
},
|
|
673
|
-
"Color/_Primitives/Bg/bgFillInverted2": {
|
|
674
|
-
"value": {
|
|
675
|
-
".": "#1e1e1e"
|
|
676
|
-
}
|
|
677
|
-
},
|
|
678
|
-
"Color/_Primitives/Bg/bgFillInverted1": {
|
|
679
|
-
"value": {
|
|
680
|
-
".": "#2f2f2f"
|
|
681
|
-
}
|
|
682
|
-
},
|
|
683
|
-
"Color/_Primitives/Bg/fgFillInverted": {
|
|
684
|
-
"value": {
|
|
685
|
-
".": "#f0f0f0"
|
|
686
|
-
}
|
|
687
|
-
},
|
|
688
|
-
"Color/_Primitives/Bg/surface1": {
|
|
689
|
-
"value": {
|
|
690
|
-
".": "#f0f0f0"
|
|
691
|
-
}
|
|
692
|
-
},
|
|
693
|
-
"Color/_Primitives/Caution/bgFill1": {
|
|
694
|
-
"value": {
|
|
695
|
-
".": "#f0d149"
|
|
696
|
-
}
|
|
697
|
-
},
|
|
698
|
-
"Color/_Primitives/Caution/fgFill": {
|
|
699
|
-
"value": {
|
|
700
|
-
".": "#1f1e1b"
|
|
701
|
-
}
|
|
702
|
-
},
|
|
703
|
-
"Color/_Primitives/Caution/bgFill2": {
|
|
704
|
-
"value": {
|
|
705
|
-
".": "#dabb2b"
|
|
706
|
-
}
|
|
707
|
-
},
|
|
708
|
-
"Color/_Primitives/Caution/surface2": {
|
|
709
|
-
"value": {
|
|
710
|
-
".": "#fdf9e7"
|
|
711
|
-
}
|
|
712
|
-
},
|
|
713
|
-
"Color/_Primitives/Caution/surface6": {
|
|
714
|
-
"value": {
|
|
715
|
-
".": "#e7d070"
|
|
716
|
-
}
|
|
717
|
-
},
|
|
718
|
-
"Color/_Primitives/Caution/surface5": {
|
|
719
|
-
"value": {
|
|
720
|
-
".": "#f4e08c"
|
|
721
|
-
}
|
|
722
|
-
},
|
|
723
|
-
"Color/_Primitives/Caution/surface4": {
|
|
724
|
-
"value": {
|
|
725
|
-
".": "#f8ebb6"
|
|
726
|
-
}
|
|
727
|
-
},
|
|
728
|
-
"Color/_Primitives/Caution/surface3": {
|
|
729
|
-
"value": {
|
|
730
|
-
".": "#fff"
|
|
731
|
-
}
|
|
732
|
-
},
|
|
733
|
-
"Color/_Primitives/Caution/fgSurface4": {
|
|
734
|
-
"value": {
|
|
735
|
-
".": "#291d00"
|
|
736
|
-
}
|
|
737
|
-
},
|
|
738
|
-
"Color/_Primitives/Caution/fgSurface3": {
|
|
739
|
-
"value": {
|
|
740
|
-
".": "#866a00"
|
|
741
|
-
}
|
|
742
|
-
},
|
|
743
|
-
"Color/_Primitives/Caution/fgSurface2": {
|
|
744
|
-
"value": {
|
|
745
|
-
".": "#a58700"
|
|
746
|
-
}
|
|
747
|
-
},
|
|
748
|
-
"Color/_Primitives/Caution/fgSurface1": {
|
|
749
|
-
"value": {
|
|
750
|
-
".": "#c6a800"
|
|
751
|
-
}
|
|
752
|
-
},
|
|
753
|
-
"Color/_Primitives/Caution/stroke3": {
|
|
754
|
-
"value": {
|
|
755
|
-
".": "#866a00"
|
|
756
|
-
}
|
|
757
|
-
},
|
|
758
|
-
"Color/_Primitives/Caution/stroke4": {
|
|
759
|
-
"value": {
|
|
760
|
-
".": "#644e00"
|
|
761
|
-
}
|
|
762
|
-
},
|
|
763
|
-
"Color/_Primitives/Caution/stroke2": {
|
|
764
|
-
"value": {
|
|
765
|
-
".": "#988d60"
|
|
766
|
-
}
|
|
767
|
-
},
|
|
768
|
-
"Color/_Primitives/Caution/stroke1": {
|
|
769
|
-
"value": {
|
|
770
|
-
".": "#b8ab76"
|
|
771
|
-
}
|
|
772
|
-
},
|
|
773
|
-
"Color/_Primitives/Caution/bgFillDark": {
|
|
774
|
-
"value": {
|
|
775
|
-
".": "#1f1e1b"
|
|
776
|
-
}
|
|
777
|
-
},
|
|
778
|
-
"Color/_Primitives/Caution/fgFillDark": {
|
|
779
|
-
"value": {
|
|
780
|
-
".": "#f6f1da"
|
|
781
|
-
}
|
|
782
|
-
},
|
|
783
|
-
"Color/_Primitives/Caution/bgFillInverted2": {
|
|
784
|
-
"value": {
|
|
785
|
-
".": "#1f1e1b"
|
|
786
|
-
}
|
|
787
|
-
},
|
|
788
|
-
"Color/_Primitives/Caution/bgFillInverted1": {
|
|
789
|
-
"value": {
|
|
790
|
-
".": "#3d2d00"
|
|
791
|
-
}
|
|
792
|
-
},
|
|
793
|
-
"Color/_Primitives/Caution/fgFillInverted": {
|
|
794
|
-
"value": {
|
|
795
|
-
".": "#f6f1da"
|
|
796
|
-
}
|
|
797
|
-
},
|
|
798
|
-
"Color/_Primitives/Caution/surface1": {
|
|
799
|
-
"value": {
|
|
800
|
-
".": "#faf1cb"
|
|
801
|
-
}
|
|
802
|
-
},
|
|
803
33
|
"Color/Semantic/Background/Neutral/bgSur-neutral": {
|
|
804
34
|
"value": {
|
|
805
|
-
".": "
|
|
35
|
+
".": "#f8f8f8"
|
|
806
36
|
},
|
|
807
37
|
"description": "Background color for surfaces with normal emphasis."
|
|
808
38
|
},
|
|
809
39
|
"Color/Semantic/Background/Neutral/bgSur-neutral-strong": {
|
|
810
40
|
"value": {
|
|
811
|
-
".": "
|
|
41
|
+
".": "#fff"
|
|
812
42
|
},
|
|
813
43
|
"description": "Background color for surfaces with strong emphasis."
|
|
814
44
|
},
|
|
815
45
|
"Color/Semantic/Background/Neutral/bgSur-neutral-weak": {
|
|
816
46
|
"value": {
|
|
817
|
-
".": "
|
|
47
|
+
".": "#f0f0f0"
|
|
818
48
|
},
|
|
819
49
|
"description": "Background color for surfaces with weak emphasis."
|
|
820
50
|
},
|
|
821
51
|
"Color/Semantic/Background/Brand/bgSur-brand": {
|
|
822
52
|
"value": {
|
|
823
|
-
".": "
|
|
53
|
+
".": "#edf0fa"
|
|
824
54
|
},
|
|
825
55
|
"description": "Background color for surfaces with brand tone and normal emphasis."
|
|
826
56
|
},
|
|
827
57
|
"Color/Semantic/Background/Success/bgSur-success": {
|
|
828
58
|
"value": {
|
|
829
|
-
".": "
|
|
59
|
+
".": "#cdf5d3"
|
|
830
60
|
},
|
|
831
61
|
"description": "Background color for surfaces with success tone and normal emphasis."
|
|
832
62
|
},
|
|
833
63
|
"Color/Semantic/Background/Success/bgSur-success-weak": {
|
|
834
64
|
"value": {
|
|
835
|
-
".": "
|
|
65
|
+
".": "#f0fcf2"
|
|
836
66
|
},
|
|
837
67
|
"description": "Background color for surfaces with success tone and weak emphasis."
|
|
838
68
|
},
|
|
839
69
|
"Color/Semantic/Background/Info/bgSur-info": {
|
|
840
70
|
"value": {
|
|
841
|
-
".": "
|
|
71
|
+
".": "#e0ebf8"
|
|
842
72
|
},
|
|
843
73
|
"description": "Background color for surfaces with info tone and normal emphasis."
|
|
844
74
|
},
|
|
845
75
|
"Color/Semantic/Background/Info/bgSur-info-weak": {
|
|
846
76
|
"value": {
|
|
847
|
-
".": "
|
|
77
|
+
".": "#f5f9fd"
|
|
848
78
|
},
|
|
849
79
|
"description": "Background color for surfaces with info tone and weak emphasis."
|
|
850
80
|
},
|
|
851
81
|
"Color/Semantic/Background/Warning/bgSur-warning": {
|
|
852
82
|
"value": {
|
|
853
|
-
".": "
|
|
83
|
+
".": "#f8e9cd"
|
|
854
84
|
},
|
|
855
85
|
"description": "Background color for surfaces with warning tone and normal emphasis."
|
|
856
86
|
},
|
|
857
87
|
"Color/Semantic/Background/Warning/bgSur-warning-weak": {
|
|
858
88
|
"value": {
|
|
859
|
-
".": "
|
|
89
|
+
".": "#fdf7ee"
|
|
860
90
|
},
|
|
861
91
|
"description": "Background color for surfaces with warning tone and weak emphasis."
|
|
862
92
|
},
|
|
863
93
|
"Color/Semantic/Background/Caution/bgSur-caution": {
|
|
864
94
|
"value": {
|
|
865
|
-
".": "
|
|
95
|
+
".": "#f8ebb5"
|
|
866
96
|
},
|
|
867
97
|
"description": "Background color for surfaces with caution tone and normal emphasis."
|
|
868
98
|
},
|
|
869
99
|
"Color/Semantic/Background/Caution/bgSur-caution-weak": {
|
|
870
100
|
"value": {
|
|
871
|
-
".": "
|
|
101
|
+
".": "#fdf9e7"
|
|
872
102
|
},
|
|
873
103
|
"description": "Background color for surfaces with caution tone and weak emphasis."
|
|
874
104
|
},
|
|
875
105
|
"Color/Semantic/Background/Error/bgSur-error": {
|
|
876
106
|
"value": {
|
|
877
|
-
".": "
|
|
107
|
+
".": "#fae5e2"
|
|
878
108
|
},
|
|
879
109
|
"description": "Background color for surfaces with error tone and normal emphasis."
|
|
880
110
|
},
|
|
881
111
|
"Color/Semantic/Background/Error/bgSur-error-weak": {
|
|
882
112
|
"value": {
|
|
883
|
-
".": "
|
|
113
|
+
".": "#fdf6f5"
|
|
884
114
|
},
|
|
885
115
|
"description": "Background color for surfaces with error tone and weak emphasis."
|
|
886
116
|
},
|
|
@@ -892,31 +122,31 @@
|
|
|
892
122
|
},
|
|
893
123
|
"Color/Semantic/Background/Neutral/bgInt-neutral-active": {
|
|
894
124
|
"value": {
|
|
895
|
-
".": "
|
|
125
|
+
".": "#eaeaea"
|
|
896
126
|
},
|
|
897
127
|
"description": "Background color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active."
|
|
898
128
|
},
|
|
899
129
|
"Color/Semantic/Background/Neutral/bgInt-neutral-disabled": {
|
|
900
130
|
"value": {
|
|
901
|
-
".": "
|
|
131
|
+
".": "#e3e3e3"
|
|
902
132
|
},
|
|
903
133
|
"description": "Background color for interactive elements with neutral tone and normal emphasis, in their disabled state."
|
|
904
134
|
},
|
|
905
135
|
"Color/Semantic/Background/Neutral/bgInt-neutral-strong": {
|
|
906
136
|
"value": {
|
|
907
|
-
".": "
|
|
137
|
+
".": "#2d2d2d"
|
|
908
138
|
},
|
|
909
139
|
"description": "Background color for interactive elements with neutral tone and strong emphasis."
|
|
910
140
|
},
|
|
911
141
|
"Color/Semantic/Background/Neutral/bgInt-neutral-strong-active": {
|
|
912
142
|
"value": {
|
|
913
|
-
".": "
|
|
143
|
+
".": "#1e1e1e"
|
|
914
144
|
},
|
|
915
145
|
"description": "Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active."
|
|
916
146
|
},
|
|
917
147
|
"Color/Semantic/Background/Neutral/bgInt-neutral-strong-disabled": {
|
|
918
148
|
"value": {
|
|
919
|
-
".": "
|
|
149
|
+
".": "#d3d3d3"
|
|
920
150
|
},
|
|
921
151
|
"description": "Background color for interactive elements with neutral tone and strong emphasis, in their disabled state."
|
|
922
152
|
},
|
|
@@ -928,13 +158,13 @@
|
|
|
928
158
|
},
|
|
929
159
|
"Color/Semantic/Background/Neutral/bgInt-neutral-weak-active": {
|
|
930
160
|
"value": {
|
|
931
|
-
".": "
|
|
161
|
+
".": "#eaeaea"
|
|
932
162
|
},
|
|
933
163
|
"description": "Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active."
|
|
934
164
|
},
|
|
935
165
|
"Color/Semantic/Background/Neutral/bgInt-neutral-weak-disabled": {
|
|
936
166
|
"value": {
|
|
937
|
-
".": "
|
|
167
|
+
".": "#e3e3e3"
|
|
938
168
|
},
|
|
939
169
|
"description": "Background color for interactive elements with neutral tone and weak emphasis, in their disabled state."
|
|
940
170
|
},
|
|
@@ -946,31 +176,31 @@
|
|
|
946
176
|
},
|
|
947
177
|
"Color/Semantic/Background/Brand/bgInt-brand-active": {
|
|
948
178
|
"value": {
|
|
949
|
-
".": "
|
|
179
|
+
".": "#f6f8fc"
|
|
950
180
|
},
|
|
951
181
|
"description": "Background color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active."
|
|
952
182
|
},
|
|
953
183
|
"Color/Semantic/Background/Brand/bgInt-brand-disabled": {
|
|
954
184
|
"value": {
|
|
955
|
-
".": "
|
|
185
|
+
".": "#e3e3e3"
|
|
956
186
|
},
|
|
957
187
|
"description": "Background color for interactive elements with brand tone and normal emphasis, in their disabled state."
|
|
958
188
|
},
|
|
959
189
|
"Color/Semantic/Background/Brand/bgInt-brand-strong": {
|
|
960
190
|
"value": {
|
|
961
|
-
".": "
|
|
191
|
+
".": "#3858e9"
|
|
962
192
|
},
|
|
963
193
|
"description": "Background color for interactive elements with brand tone and strong emphasis."
|
|
964
194
|
},
|
|
965
195
|
"Color/Semantic/Background/Brand/bgInt-brand-strong-active": {
|
|
966
196
|
"value": {
|
|
967
|
-
".": "
|
|
197
|
+
".": "#2e49da"
|
|
968
198
|
},
|
|
969
199
|
"description": "Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active."
|
|
970
200
|
},
|
|
971
201
|
"Color/Semantic/Background/Brand/bgInt-brand-strong-disabled": {
|
|
972
202
|
"value": {
|
|
973
|
-
".": "
|
|
203
|
+
".": "#d3d3d3"
|
|
974
204
|
},
|
|
975
205
|
"description": "Background color for interactive elements with brand tone and strong emphasis, in their disabled state."
|
|
976
206
|
},
|
|
@@ -982,429 +212,399 @@
|
|
|
982
212
|
},
|
|
983
213
|
"Color/Semantic/Background/Brand/bgInt-brand-weak-active": {
|
|
984
214
|
"value": {
|
|
985
|
-
".": "
|
|
215
|
+
".": "#e5ebf7"
|
|
986
216
|
},
|
|
987
217
|
"description": "Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active."
|
|
988
218
|
},
|
|
989
219
|
"Color/Semantic/Background/Brand/bgInt-brand-weak-disabled": {
|
|
990
220
|
"value": {
|
|
991
|
-
".": "
|
|
221
|
+
".": "#e3e3e3"
|
|
992
222
|
},
|
|
993
223
|
"description": "Background color for interactive elements with brand tone and weak emphasis, in their disabled state."
|
|
994
224
|
},
|
|
995
225
|
"Color/Semantic/Background/Neutral/bgTra-neutral-weak": {
|
|
996
226
|
"value": {
|
|
997
|
-
".": "
|
|
227
|
+
".": "#cfcfcf"
|
|
998
228
|
},
|
|
999
229
|
"description": "Background color for tracks with a neutral tone and weak emphasis (eg. scrollbar track)."
|
|
1000
230
|
},
|
|
1001
231
|
"Color/Semantic/Background/Neutral/bgTra-neutral": {
|
|
1002
232
|
"value": {
|
|
1003
|
-
".": "
|
|
233
|
+
".": "#adadad"
|
|
1004
234
|
},
|
|
1005
235
|
"description": "Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track)."
|
|
1006
236
|
},
|
|
1007
237
|
"Color/Semantic/Background/Neutral/bgThu-neutral-weak": {
|
|
1008
238
|
"value": {
|
|
1009
|
-
".": "
|
|
239
|
+
".": "#8b8b8b"
|
|
1010
240
|
},
|
|
1011
241
|
"description": "Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb)."
|
|
1012
242
|
},
|
|
1013
243
|
"Color/Semantic/Background/Neutral/bgThu-neutral-weak-active": {
|
|
1014
244
|
"value": {
|
|
1015
|
-
".": "
|
|
245
|
+
".": "#6d6d6d"
|
|
1016
246
|
},
|
|
1017
247
|
"description": "Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active."
|
|
1018
248
|
},
|
|
1019
249
|
"Color/Semantic/Background/Brand/bgThu-brand": {
|
|
1020
250
|
"value": {
|
|
1021
|
-
".": "
|
|
251
|
+
".": "#3858e9"
|
|
1022
252
|
},
|
|
1023
253
|
"description": "Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track)."
|
|
1024
254
|
},
|
|
1025
255
|
"Color/Semantic/Background/Brand/bgThu-brand-active": {
|
|
1026
256
|
"value": {
|
|
1027
|
-
".": "
|
|
257
|
+
".": "#3858e9"
|
|
1028
258
|
},
|
|
1029
259
|
"description": "Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active."
|
|
1030
260
|
},
|
|
1031
261
|
"Color/Semantic/Background/Brand/bgThu-brand-disabled": {
|
|
1032
262
|
"value": {
|
|
1033
|
-
".": "
|
|
263
|
+
".": "#adadad"
|
|
1034
264
|
},
|
|
1035
265
|
"description": "Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track), in their disabled state."
|
|
1036
266
|
},
|
|
1037
267
|
"Color/Semantic/Foreground/Neutral/fgCon-neutral": {
|
|
1038
268
|
"value": {
|
|
1039
|
-
".": "
|
|
269
|
+
".": "#1e1e1e"
|
|
1040
270
|
},
|
|
1041
271
|
"description": "Foreground color for content like text with normal emphasis."
|
|
1042
272
|
},
|
|
1043
273
|
"Color/Semantic/Foreground/Neutral/fgCon-neutral-weak": {
|
|
1044
274
|
"value": {
|
|
1045
|
-
".": "
|
|
275
|
+
".": "#6e6e6e"
|
|
1046
276
|
},
|
|
1047
277
|
"description": "Foreground color for content like text with weak emphasis."
|
|
1048
278
|
},
|
|
1049
279
|
"Color/Semantic/Foreground/Success/fgCon-success": {
|
|
1050
280
|
"value": {
|
|
1051
|
-
".": "
|
|
281
|
+
".": "#002b00"
|
|
1052
282
|
},
|
|
1053
283
|
"description": "Foreground color for content like text with success tone and normal emphasis."
|
|
1054
284
|
},
|
|
1055
285
|
"Color/Semantic/Foreground/Success/fgCon-success-weak": {
|
|
1056
286
|
"value": {
|
|
1057
|
-
".": "
|
|
287
|
+
".": "#008031"
|
|
1058
288
|
},
|
|
1059
289
|
"description": "Foreground color for content like text with success tone and weak emphasis."
|
|
1060
290
|
},
|
|
1061
291
|
"Color/Semantic/Foreground/Info/fgCon-info": {
|
|
1062
292
|
"value": {
|
|
1063
|
-
".": "
|
|
293
|
+
".": "#001758"
|
|
1064
294
|
},
|
|
1065
295
|
"description": "Foreground color for content like text with info tone and normal emphasis."
|
|
1066
296
|
},
|
|
1067
297
|
"Color/Semantic/Foreground/Info/fgCon-info-weak": {
|
|
1068
298
|
"value": {
|
|
1069
|
-
".": "
|
|
299
|
+
".": "#006dd9"
|
|
1070
300
|
},
|
|
1071
301
|
"description": "Foreground color for content like text with info tone and weak emphasis."
|
|
1072
302
|
},
|
|
1073
303
|
"Color/Semantic/Foreground/Warning/fgCon-warning": {
|
|
1074
304
|
"value": {
|
|
1075
|
-
".": "
|
|
305
|
+
".": "#2f1800"
|
|
1076
306
|
},
|
|
1077
307
|
"description": "Foreground color for content like text with warning tone and normal emphasis."
|
|
1078
308
|
},
|
|
1079
309
|
"Color/Semantic/Foreground/Warning/fgCon-warning-weak": {
|
|
1080
310
|
"value": {
|
|
1081
|
-
".": "
|
|
311
|
+
".": "#976300"
|
|
1082
312
|
},
|
|
1083
313
|
"description": "Foreground color for content like text with warning tone and weak emphasis."
|
|
1084
314
|
},
|
|
1085
315
|
"Color/Semantic/Foreground/Caution/fgCon-caution": {
|
|
1086
316
|
"value": {
|
|
1087
|
-
".": "
|
|
317
|
+
".": "#291d00"
|
|
1088
318
|
},
|
|
1089
319
|
"description": "Foreground color for content like text with caution tone and normal emphasis."
|
|
1090
320
|
},
|
|
1091
321
|
"Color/Semantic/Foreground/Caution/fgCon-caution-weak": {
|
|
1092
322
|
"value": {
|
|
1093
|
-
".": "
|
|
323
|
+
".": "#876b00"
|
|
1094
324
|
},
|
|
1095
325
|
"description": "Foreground color for content like text with caution tone and weak emphasis."
|
|
1096
326
|
},
|
|
1097
327
|
"Color/Semantic/Foreground/Error/fgCon-error": {
|
|
1098
328
|
"value": {
|
|
1099
|
-
".": "
|
|
329
|
+
".": "#4a0000"
|
|
1100
330
|
},
|
|
1101
331
|
"description": "Foreground color for content like text with error tone and normal emphasis."
|
|
1102
332
|
},
|
|
1103
333
|
"Color/Semantic/Foreground/Error/fgCon-error-weak": {
|
|
1104
334
|
"value": {
|
|
1105
|
-
".": "
|
|
335
|
+
".": "#cc1818"
|
|
1106
336
|
},
|
|
1107
337
|
"description": "Foreground color for content like text with error tone and weak emphasis."
|
|
1108
338
|
},
|
|
1109
339
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral": {
|
|
1110
340
|
"value": {
|
|
1111
|
-
".": "
|
|
341
|
+
".": "#1e1e1e"
|
|
1112
342
|
},
|
|
1113
343
|
"description": "Foreground color for interactive elements with neutral tone and normal emphasis."
|
|
1114
344
|
},
|
|
1115
345
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-active": {
|
|
1116
346
|
"value": {
|
|
1117
|
-
".": "
|
|
347
|
+
".": "#1e1e1e"
|
|
1118
348
|
},
|
|
1119
349
|
"description": "Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active."
|
|
1120
350
|
},
|
|
1121
351
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-disabled": {
|
|
1122
352
|
"value": {
|
|
1123
|
-
".": "
|
|
353
|
+
".": "#8b8b8b"
|
|
1124
354
|
},
|
|
1125
355
|
"description": "Foreground color for interactive elements with neutral tone and normal emphasis, in their disabled state."
|
|
1126
356
|
},
|
|
1127
357
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-strong": {
|
|
1128
358
|
"value": {
|
|
1129
|
-
".": "
|
|
359
|
+
".": "#f0f0f0"
|
|
1130
360
|
},
|
|
1131
361
|
"description": "Foreground color for interactive elements with neutral tone and strong emphasis."
|
|
1132
362
|
},
|
|
1133
363
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-strong-active": {
|
|
1134
364
|
"value": {
|
|
1135
|
-
".": "
|
|
365
|
+
".": "#f0f0f0"
|
|
1136
366
|
},
|
|
1137
367
|
"description": "Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active."
|
|
1138
368
|
},
|
|
1139
369
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-strong-disabled": {
|
|
1140
370
|
"value": {
|
|
1141
|
-
".": "
|
|
371
|
+
".": "#6e6e6e"
|
|
1142
372
|
},
|
|
1143
373
|
"description": "Foreground color for interactive elements with neutral tone and strong emphasis, in their disabled state."
|
|
1144
374
|
},
|
|
1145
375
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-weak": {
|
|
1146
376
|
"value": {
|
|
1147
|
-
".": "
|
|
377
|
+
".": "#6e6e6e"
|
|
1148
378
|
},
|
|
1149
379
|
"description": "Foreground color for interactive elements with neutral tone and weak emphasis."
|
|
1150
380
|
},
|
|
1151
381
|
"Color/Semantic/Foreground/Neutral/fgInt-neutral-weak-disabled": {
|
|
1152
382
|
"value": {
|
|
1153
|
-
".": "
|
|
383
|
+
".": "#8b8b8b"
|
|
1154
384
|
},
|
|
1155
385
|
"description": "Foreground color for interactive elements with neutral tone and weak emphasis, in their disabled state."
|
|
1156
386
|
},
|
|
1157
387
|
"Color/Semantic/Foreground/Brand/fgInt-brand": {
|
|
1158
388
|
"value": {
|
|
1159
|
-
".": "
|
|
389
|
+
".": "#3858e9"
|
|
1160
390
|
},
|
|
1161
391
|
"description": "Foreground color for interactive elements with brand tone and normal emphasis."
|
|
1162
392
|
},
|
|
1163
393
|
"Color/Semantic/Foreground/Brand/fgInt-brand-active": {
|
|
1164
394
|
"value": {
|
|
1165
|
-
".": "
|
|
395
|
+
".": "#3858e9"
|
|
1166
396
|
},
|
|
1167
397
|
"description": "Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active."
|
|
1168
398
|
},
|
|
1169
399
|
"Color/Semantic/Foreground/Brand/fgInt-brand-disabled": {
|
|
1170
400
|
"value": {
|
|
1171
|
-
".": "
|
|
401
|
+
".": "#8b8b8b"
|
|
1172
402
|
},
|
|
1173
403
|
"description": "Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state."
|
|
1174
404
|
},
|
|
1175
405
|
"Color/Semantic/Foreground/Brand/fgInt-brand-strong": {
|
|
1176
406
|
"value": {
|
|
1177
|
-
".": "
|
|
407
|
+
".": "#eff0f2"
|
|
1178
408
|
},
|
|
1179
409
|
"description": "Foreground color for interactive elements with brand tone and strong emphasis."
|
|
1180
410
|
},
|
|
1181
411
|
"Color/Semantic/Foreground/Brand/fgInt-brand-strong-active": {
|
|
1182
412
|
"value": {
|
|
1183
|
-
".": "
|
|
413
|
+
".": "#eff0f2"
|
|
1184
414
|
},
|
|
1185
415
|
"description": "Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active."
|
|
1186
416
|
},
|
|
1187
417
|
"Color/Semantic/Foreground/Brand/fgInt-brand-strong-disabled": {
|
|
1188
418
|
"value": {
|
|
1189
|
-
".": "
|
|
419
|
+
".": "#6e6e6e"
|
|
1190
420
|
},
|
|
1191
421
|
"description": "Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state."
|
|
1192
422
|
},
|
|
1193
423
|
"Color/Semantic/Stroke/Neutral/strokeSur-neutral": {
|
|
1194
424
|
"value": {
|
|
1195
|
-
".": "
|
|
425
|
+
".": "#adadad"
|
|
1196
426
|
},
|
|
1197
427
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with normal emphasis."
|
|
1198
428
|
},
|
|
1199
429
|
"Color/Semantic/Stroke/Neutral/strokeSur-neutral-weak": {
|
|
1200
430
|
"value": {
|
|
1201
|
-
".": "
|
|
431
|
+
".": "#cfcfcf"
|
|
1202
432
|
},
|
|
1203
433
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with weak emphasis."
|
|
1204
434
|
},
|
|
1205
435
|
"Color/Semantic/Stroke/Neutral/strokeSur-neutral-strong": {
|
|
1206
436
|
"value": {
|
|
1207
|
-
".": "
|
|
437
|
+
".": "#8b8b8b"
|
|
1208
438
|
},
|
|
1209
439
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis."
|
|
1210
440
|
},
|
|
1211
441
|
"Color/Semantic/Stroke/Brand/strokeSur-brand": {
|
|
1212
442
|
"value": {
|
|
1213
|
-
".": "
|
|
443
|
+
".": "#91a2cf"
|
|
1214
444
|
},
|
|
1215
445
|
"description": "Decorative stroke color used to define brand-toned surface boundaries with normal emphasis."
|
|
1216
446
|
},
|
|
1217
447
|
"Color/Semantic/Stroke/Brand/strokeSur-brand-strong": {
|
|
1218
448
|
"value": {
|
|
1219
|
-
".": "
|
|
449
|
+
".": "#3858e9"
|
|
1220
450
|
},
|
|
1221
451
|
"description": "Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis."
|
|
1222
452
|
},
|
|
1223
453
|
"Color/Semantic/Stroke/Success/strokeSur-success": {
|
|
1224
454
|
"value": {
|
|
1225
|
-
".": "
|
|
455
|
+
".": "#77ba84"
|
|
1226
456
|
},
|
|
1227
457
|
"description": "Decorative stroke color used to define success-toned surface boundaries with normal emphasis."
|
|
1228
458
|
},
|
|
1229
459
|
"Color/Semantic/Stroke/Success/strokeSur-success-strong": {
|
|
1230
460
|
"value": {
|
|
1231
|
-
".": "
|
|
461
|
+
".": "#008031"
|
|
1232
462
|
},
|
|
1233
463
|
"description": "Decorative stroke color used to define success-toned surface boundaries with strong emphasis."
|
|
1234
464
|
},
|
|
1235
465
|
"Color/Semantic/Stroke/Info/strokeSur-info": {
|
|
1236
466
|
"value": {
|
|
1237
|
-
".": "
|
|
467
|
+
".": "#8aaed6"
|
|
1238
468
|
},
|
|
1239
469
|
"description": "Decorative stroke color used to define info-toned surface boundaries with normal emphasis."
|
|
1240
470
|
},
|
|
1241
471
|
"Color/Semantic/Stroke/Info/strokeSur-info-strong": {
|
|
1242
472
|
"value": {
|
|
1243
|
-
".": "
|
|
473
|
+
".": "#006dd9"
|
|
1244
474
|
},
|
|
1245
475
|
"description": "Decorative stroke color used to define info-toned surface boundaries with strong emphasis."
|
|
1246
476
|
},
|
|
1247
477
|
"Color/Semantic/Stroke/Warning/strokeSur-warning": {
|
|
1248
478
|
"value": {
|
|
1249
|
-
".": "
|
|
479
|
+
".": "#c2a776"
|
|
1250
480
|
},
|
|
1251
481
|
"description": "Decorative stroke color used to define warning-toned surface boundaries with normal emphasis."
|
|
1252
482
|
},
|
|
1253
483
|
"Color/Semantic/Stroke/Warning/strokeSur-warning-strong": {
|
|
1254
484
|
"value": {
|
|
1255
|
-
".": "
|
|
485
|
+
".": "#976300"
|
|
1256
486
|
},
|
|
1257
487
|
"description": "Decorative stroke color used to define warning-toned surface boundaries with strong emphasis."
|
|
1258
488
|
},
|
|
1259
489
|
"Color/Semantic/Stroke/Error/strokeSur-error": {
|
|
1260
490
|
"value": {
|
|
1261
|
-
".": "
|
|
491
|
+
".": "#dc8e83"
|
|
1262
492
|
},
|
|
1263
493
|
"description": "Decorative stroke color used to define error-toned surface boundaries with normal emphasis."
|
|
1264
494
|
},
|
|
1265
495
|
"Color/Semantic/Stroke/Error/strokeSur-error-strong": {
|
|
1266
496
|
"value": {
|
|
1267
|
-
".": "
|
|
497
|
+
".": "#cc1818"
|
|
1268
498
|
},
|
|
1269
499
|
"description": "Decorative stroke color used to define error-toned surface boundaries with strong emphasis."
|
|
1270
500
|
},
|
|
1271
501
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral": {
|
|
1272
502
|
"value": {
|
|
1273
|
-
".": "
|
|
503
|
+
".": "#8b8b8b"
|
|
1274
504
|
},
|
|
1275
505
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with normal emphasis."
|
|
1276
506
|
},
|
|
1277
507
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral-active": {
|
|
1278
508
|
"value": {
|
|
1279
|
-
".": "
|
|
509
|
+
".": "#6d6d6d"
|
|
1280
510
|
},
|
|
1281
511
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active."
|
|
1282
512
|
},
|
|
1283
513
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral-disabled": {
|
|
1284
514
|
"value": {
|
|
1285
|
-
".": "
|
|
515
|
+
".": "#adadad"
|
|
1286
516
|
},
|
|
1287
517
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with normal emphasis, in their disabled state."
|
|
1288
518
|
},
|
|
1289
519
|
"Color/Semantic/Stroke/Neutral/strokeInt-neutral-strong": {
|
|
1290
520
|
"value": {
|
|
1291
|
-
".": "
|
|
521
|
+
".": "#6d6d6d"
|
|
1292
522
|
},
|
|
1293
523
|
"description": "Accessible stroke color used for interactive neutrally-toned elements with strong emphasis."
|
|
1294
524
|
},
|
|
1295
525
|
"Color/Semantic/Stroke/Brand/strokeInt-brand": {
|
|
1296
526
|
"value": {
|
|
1297
|
-
".": "
|
|
527
|
+
".": "#3858e9"
|
|
1298
528
|
},
|
|
1299
529
|
"description": "Accessible stroke color used for interactive brand-toned elements with normal emphasis."
|
|
1300
530
|
},
|
|
1301
531
|
"Color/Semantic/Stroke/Brand/strokeInt-brand-active": {
|
|
1302
532
|
"value": {
|
|
1303
|
-
".": "
|
|
533
|
+
".": "#2337c8"
|
|
1304
534
|
},
|
|
1305
535
|
"description": "Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active."
|
|
1306
536
|
},
|
|
1307
537
|
"Color/Semantic/Stroke/Brand/strokeInt-brand-disabled": {
|
|
1308
538
|
"value": {
|
|
1309
|
-
".": "
|
|
539
|
+
".": "#adadad"
|
|
1310
540
|
},
|
|
1311
541
|
"description": "Accessible stroke color used for interactive brand-toned elements with normal emphasis, in their disabled state."
|
|
1312
542
|
},
|
|
1313
543
|
"Color/Semantic/Stroke/Error/strokeInt-error-strong": {
|
|
1314
544
|
"value": {
|
|
1315
|
-
".": "
|
|
545
|
+
".": "#cc1818"
|
|
1316
546
|
},
|
|
1317
547
|
"description": "Accessible stroke color used for interactive error-toned elements with strong emphasis."
|
|
1318
548
|
},
|
|
1319
549
|
"Color/Semantic/Stroke/Brand/strokeFoc-brand": {
|
|
1320
550
|
"value": {
|
|
1321
|
-
".": "
|
|
551
|
+
".": "#3858e9"
|
|
1322
552
|
},
|
|
1323
553
|
"description": "Accessible stroke color applied to focus rings."
|
|
1324
554
|
},
|
|
1325
|
-
"
|
|
1326
|
-
"value": {
|
|
1327
|
-
".": "0 1px 1px 0 color(srgb 0 0 0 / 0.03), 0 1px 2px 0 color(srgb 0 0 0 / 0.02), 0 3px 3px 0 color(srgb 0 0 0 / 0.02), 0 4px 4px 0 color(srgb 0 0 0 / 0.01)"
|
|
1328
|
-
},
|
|
1329
|
-
"description": "For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame."
|
|
1330
|
-
},
|
|
1331
|
-
"Elevation/small": {
|
|
1332
|
-
"value": {
|
|
1333
|
-
".": "0 1px 2px 0 color(srgb 0 0 0 / 0.05), 0 2px 3px 0 color(srgb 0 0 0 / 0.04), 0 6px 6px 0 color(srgb 0 0 0 / 0.03), 0 8px 8px 0 color(srgb 0 0 0 / 0.02)"
|
|
1334
|
-
},
|
|
1335
|
-
"description": "For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar."
|
|
1336
|
-
},
|
|
1337
|
-
"Elevation/medium": {
|
|
1338
|
-
"value": {
|
|
1339
|
-
".": "0 2px 3px 0 color(srgb 0 0 0 / 0.05), 0 4px 5px 0 color(srgb 0 0 0 / 0.04), 0 12px 12px 0 color(srgb 0 0 0 / 0.03), 0 16px 16px 0 color(srgb 0 0 0 / 0.02)"
|
|
1340
|
-
},
|
|
1341
|
-
"description": "For components that offer additional actions. Example: Menus, Command Palette"
|
|
1342
|
-
},
|
|
1343
|
-
"Elevation/large": {
|
|
1344
|
-
"value": {
|
|
1345
|
-
".": "0 5px 15px 0 color(srgb 0 0 0 / 0.08), 0 15px 27px 0 color(srgb 0 0 0 / 0.07), 0 30px 36px 0 color(srgb 0 0 0 / 0.04), 0 50px 43px 0 color(srgb 0 0 0 / 0.02)"
|
|
1346
|
-
},
|
|
1347
|
-
"description": "For components that confirm decisions or handle necessary interruptions. Example: Modals."
|
|
1348
|
-
},
|
|
1349
|
-
"Spacing/05": {
|
|
555
|
+
"Dimension/Semantic/base": {
|
|
1350
556
|
"value": {
|
|
1351
557
|
".": "4px"
|
|
1352
558
|
},
|
|
1353
|
-
"description": "
|
|
559
|
+
"description": "Base dimension unit"
|
|
1354
560
|
},
|
|
1355
|
-
"
|
|
561
|
+
"Dimension/Semantic/padding-surface-x-small": {
|
|
1356
562
|
"value": {
|
|
1357
563
|
".": "8px"
|
|
1358
564
|
},
|
|
1359
|
-
"description": "
|
|
565
|
+
"description": "Extra small spacing for surfaces"
|
|
1360
566
|
},
|
|
1361
|
-
"
|
|
567
|
+
"Dimension/Semantic/padding-surface-small": {
|
|
1362
568
|
"value": {
|
|
1363
569
|
".": "12px"
|
|
1364
570
|
},
|
|
1365
|
-
"description": "
|
|
571
|
+
"description": "Small spacing for surfaces"
|
|
1366
572
|
},
|
|
1367
|
-
"
|
|
573
|
+
"Dimension/Semantic/padding-surface-medium": {
|
|
1368
574
|
"value": {
|
|
1369
575
|
".": "16px"
|
|
1370
576
|
},
|
|
1371
|
-
"description": "
|
|
577
|
+
"description": "Medium spacing for surfaces"
|
|
1372
578
|
},
|
|
1373
|
-
"
|
|
579
|
+
"Dimension/Semantic/padding-surface-large": {
|
|
1374
580
|
"value": {
|
|
1375
581
|
".": "24px"
|
|
1376
582
|
},
|
|
1377
|
-
"description": "
|
|
1378
|
-
},
|
|
1379
|
-
"Spacing/40": {
|
|
1380
|
-
"value": {
|
|
1381
|
-
".": "32px"
|
|
1382
|
-
},
|
|
1383
|
-
"description": "2X large spacing"
|
|
583
|
+
"description": "Large spacing for surfaces"
|
|
1384
584
|
},
|
|
1385
|
-
"
|
|
585
|
+
"Elevation/x-small": {
|
|
1386
586
|
"value": {
|
|
1387
|
-
".": "
|
|
587
|
+
".": "0 1px 1px 0 color(srgb 0 0 0 / 0.03), 0 1px 2px 0 color(srgb 0 0 0 / 0.02), 0 3px 3px 0 color(srgb 0 0 0 / 0.02), 0 4px 4px 0 color(srgb 0 0 0 / 0.01)"
|
|
1388
588
|
},
|
|
1389
|
-
"description": "
|
|
589
|
+
"description": "For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame."
|
|
1390
590
|
},
|
|
1391
|
-
"
|
|
591
|
+
"Elevation/small": {
|
|
1392
592
|
"value": {
|
|
1393
|
-
".": "
|
|
593
|
+
".": "0 1px 2px 0 color(srgb 0 0 0 / 0.05), 0 2px 3px 0 color(srgb 0 0 0 / 0.04), 0 6px 6px 0 color(srgb 0 0 0 / 0.03), 0 8px 8px 0 color(srgb 0 0 0 / 0.02)"
|
|
1394
594
|
},
|
|
1395
|
-
"description": "
|
|
595
|
+
"description": "For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar."
|
|
1396
596
|
},
|
|
1397
|
-
"
|
|
597
|
+
"Elevation/medium": {
|
|
1398
598
|
"value": {
|
|
1399
|
-
".": "
|
|
599
|
+
".": "0 2px 3px 0 color(srgb 0 0 0 / 0.05), 0 4px 5px 0 color(srgb 0 0 0 / 0.04), 0 12px 12px 0 color(srgb 0 0 0 / 0.03), 0 16px 16px 0 color(srgb 0 0 0 / 0.02)"
|
|
1400
600
|
},
|
|
1401
|
-
"description": "
|
|
601
|
+
"description": "For components that offer additional actions. Example: Menus, Command Palette"
|
|
1402
602
|
},
|
|
1403
|
-
"
|
|
603
|
+
"Elevation/large": {
|
|
1404
604
|
"value": {
|
|
1405
|
-
".": "
|
|
605
|
+
".": "0 5px 15px 0 color(srgb 0 0 0 / 0.08), 0 15px 27px 0 color(srgb 0 0 0 / 0.07), 0 30px 36px 0 color(srgb 0 0 0 / 0.04), 0 50px 43px 0 color(srgb 0 0 0 / 0.02)"
|
|
1406
606
|
},
|
|
1407
|
-
"description": "
|
|
607
|
+
"description": "For components that confirm decisions or handle necessary interruptions. Example: Modals."
|
|
1408
608
|
},
|
|
1409
609
|
"Font/family-heading": {
|
|
1410
610
|
"value": {
|