@eui/styles 21.0.0-next.47 → 21.0.0-next.49

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.
@@ -0,0 +1,451 @@
1
+ @use 'sass:map';
2
+ @use 'sass:color';
3
+ @use '../01-base/' as base;
4
+
5
+ $ecl-colors: (
6
+ 'primary-25': #f7f9ff,
7
+ 'primary-50': #f2f6ff,
8
+ 'primary-75': #eef2ff,
9
+ 'primary-100': #e6edff,
10
+ 'primary-200': #d9e3ff,
11
+ 'primary-300': #b0c6ff,
12
+ 'primary-400': #8cacff,
13
+ 'primary-500': #5987ff,
14
+ 'primary-600': #0046ff,
15
+ 'primary-700': #0035bf,
16
+ 'primary-800': #002a99,
17
+ 'primary-900': #001f73,
18
+ 'primary-950': #001959,
19
+
20
+ 'secondary-25': #fffcf7,
21
+ 'secondary-50': #fff5e5,
22
+ 'secondary-75': #ffebcc,
23
+ 'secondary-100': #ffe1b4,
24
+ 'secondary-200': #ffd392,
25
+ 'secondary-300': #ffcb7d,
26
+ 'secondary-400': #ffbe5c,
27
+ 'secondary-500': #fea439,
28
+ 'secondary-600': #fc8713,
29
+ 'secondary-700': #ed6c09,
30
+ 'secondary-800': #c55109,
31
+ 'secondary-900': #9e4107,
32
+ 'secondary-950': #763105,
33
+
34
+ 'grey-25': #fafafb,
35
+ 'grey-50': #f6f6f8,
36
+ 'grey-75': #ededf0,
37
+ 'grey-100': #e1e1e7,
38
+ 'grey-200': #d4d4dc,
39
+ 'grey-300': #b9b9c5,
40
+ 'grey-400': #a0a0b1,
41
+ 'grey-500': #84849b,
42
+ 'grey-600': #696984,
43
+ 'grey-700': #505070,
44
+ 'grey-800': #353559,
45
+ 'grey-900': #1c1c45,
46
+ 'grey-950': #00002e,
47
+
48
+ // Status
49
+ 'info-25': #f9fbfd,
50
+ 'info-50': #f5f7fb,
51
+ 'info-75': #ebeff7,
52
+ 'info-100': #dee4f2,
53
+ 'info-200': #bfcce6,
54
+ 'info-300': #a3b6da,
55
+ 'info-400': #859dce,
56
+ 'info-500': #6685c2,
57
+ 'info-600': #3b62b0,
58
+ 'info-700': #1c49a4,
59
+ 'info-800': #039,
60
+ 'info-900': #00297a,
61
+ 'info-950': #001f5c,
62
+
63
+ 'success-25': #f9fefc,
64
+ 'success-50': #edfbf6,
65
+ 'success-75': #e3f9f0,
66
+ 'success-100': #daf6eb,
67
+ 'success-200': #b2edd6,
68
+ 'success-300': #8fe5c4,
69
+ 'success-400': #5ddaa9,
70
+ 'success-500': #05c67b,
71
+ 'success-600': #05b26f,
72
+ 'success-700': #049e62,
73
+ 'success-800': #037e4e,
74
+ 'success-900': #025f3b,
75
+ 'success-950': #02472c,
76
+
77
+ 'error-25': #fefafa,
78
+ 'error-50': #fdefef,
79
+ 'error-75': #fce9ea,
80
+ 'error-100': #f5bbbe,
81
+ 'error-200': #f09a9e,
82
+ 'error-300': #ea6c72,
83
+ 'error-400': #e54f57,
84
+ 'error-500': #df232d,
85
+ 'error-600': #cb2029,
86
+ 'error-700': #9e1920,
87
+ 'error-800': #7b1319,
88
+ 'error-900': #5a0e12,
89
+ 'error-950': #1f0506,
90
+
91
+ 'warning-25': #fffaf5,
92
+ 'warning-50': #fff3e8,
93
+ 'warning-75': #ffeddc,
94
+ 'warning-100': #ffdbba,
95
+ 'warning-200': #ffc998,
96
+ 'warning-300': #ffb16a,
97
+ 'warning-400': #ffa14d,
98
+ 'warning-500': #ff8a20,
99
+ 'warning-600': #e87e1d,
100
+ 'warning-700': #ba6517,
101
+ 'warning-800': #8b4c11,
102
+ 'warning-900': #68390d,
103
+ 'warning-950': #512c0a,
104
+ );
105
+
106
+ $color-map: (
107
+ br: (
108
+ 950: map.get($ecl-colors, 'grey-950'),
109
+ 900: map.get($ecl-colors, 'grey-900'),
110
+ 800: map.get($ecl-colors, 'grey-800'),
111
+ 700: map.get($ecl-colors, 'grey-700')
112
+ ),
113
+ pr: (
114
+ 950: map.get($ecl-colors, 'primary-950'),
115
+ 900: map.get($ecl-colors, 'primary-900'),
116
+ 800: map.get($ecl-colors, 'primary-800'),
117
+ 700: map.get($ecl-colors, 'primary-700'),
118
+ 600: map.get($ecl-colors, 'primary-600'),
119
+ 500: map.get($ecl-colors, 'primary-500'),
120
+ 400: map.get($ecl-colors, 'primary-400'),
121
+ 300: map.get($ecl-colors, 'primary-300'),
122
+ 200: map.get($ecl-colors, 'primary-200'),
123
+ 100: map.get($ecl-colors, 'primary-100'),
124
+ 75: map.get($ecl-colors, 'primary-75'),
125
+ 50: map.get($ecl-colors, 'primary-50'),
126
+ 25: map.get($ecl-colors, 'primary-25')
127
+ ),
128
+ gr: (
129
+ 950: map.get($ecl-colors, 'grey-950'),
130
+ 900: map.get($ecl-colors, 'grey-900'),
131
+ 800: map.get($ecl-colors, 'grey-800'),
132
+ 700: map.get($ecl-colors, 'grey-700'),
133
+ 600: map.get($ecl-colors, 'grey-600'),
134
+ 500: map.get($ecl-colors, 'grey-500'),
135
+ 400: map.get($ecl-colors, 'grey-400'),
136
+ 300: map.get($ecl-colors, 'grey-300'),
137
+ 200: map.get($ecl-colors, 'grey-200'),
138
+ 100: map.get($ecl-colors, 'grey-100'),
139
+ 75: map.get($ecl-colors, 'grey-75'),
140
+ 50: map.get($ecl-colors, 'grey-50'),
141
+ 25: map.get($ecl-colors, 'grey-25')
142
+ ),
143
+ grn: (
144
+ 950: #171717,
145
+ 900: #313131,
146
+ 800: #474747,
147
+ 700: #606060,
148
+ 600: #777777,
149
+ 500: #909090,
150
+ 400: #a9a9a9,
151
+ 300: #bfbfbf,
152
+ 200: #d8d8d8,
153
+ 100: #e4e4e4,
154
+ 75: #efefef,
155
+ 50: #f7f7f7,
156
+ 25: #fbfbfb
157
+ ),
158
+ in: (
159
+ 950: map.get($ecl-colors, 'info-950'),
160
+ 900: map.get($ecl-colors, 'info-900'),
161
+ 800: map.get($ecl-colors, 'info-800'),
162
+ 700: map.get($ecl-colors, 'info-700'),
163
+ 600: map.get($ecl-colors, 'info-600'),
164
+ 500: map.get($ecl-colors, 'info-500'),
165
+ 400: map.get($ecl-colors, 'info-400'),
166
+ 300: map.get($ecl-colors, 'info-300'),
167
+ 200: map.get($ecl-colors, 'info-200'),
168
+ 100: map.get($ecl-colors, 'info-100'),
169
+ 75: map.get($ecl-colors, 'info-75'),
170
+ 50: map.get($ecl-colors, 'info-50'),
171
+ 25: map.get($ecl-colors, 'info-25')
172
+ ),
173
+ su: (
174
+ 950: map.get($ecl-colors, 'success-950'),
175
+ 900: map.get($ecl-colors, 'success-900'),
176
+ 800: map.get($ecl-colors, 'success-800'),
177
+ 700: map.get($ecl-colors, 'success-700'),
178
+ 600: map.get($ecl-colors, 'success-600'),
179
+ 500: map.get($ecl-colors, 'success-500'),
180
+ 400: map.get($ecl-colors, 'success-400'),
181
+ 300: map.get($ecl-colors, 'success-300'),
182
+ 200: map.get($ecl-colors, 'success-200'),
183
+ 100: map.get($ecl-colors, 'success-100'),
184
+ 75: map.get($ecl-colors, 'success-75'),
185
+ 50: map.get($ecl-colors, 'success-50'),
186
+ 25: map.get($ecl-colors, 'success-25')
187
+ ),
188
+ wa: (
189
+ 950: map.get($ecl-colors, 'warning-950'),
190
+ 900: map.get($ecl-colors, 'warning-900'),
191
+ 800: map.get($ecl-colors, 'warning-800'),
192
+ 700: map.get($ecl-colors, 'warning-700'),
193
+ 600: map.get($ecl-colors, 'warning-600'),
194
+ 500: map.get($ecl-colors, 'warning-500'),
195
+ 400: map.get($ecl-colors, 'warning-400'),
196
+ 300: map.get($ecl-colors, 'warning-300'),
197
+ 200: map.get($ecl-colors, 'warning-200'),
198
+ 100: map.get($ecl-colors, 'warning-100'),
199
+ 75: map.get($ecl-colors, 'warning-75'),
200
+ 50: map.get($ecl-colors, 'warning-50'),
201
+ 25: map.get($ecl-colors, 'warning-25')
202
+ ),
203
+ da: (
204
+ 950: map.get($ecl-colors, 'error-950'),
205
+ 900: map.get($ecl-colors, 'error-900'),
206
+ 800: map.get($ecl-colors, 'error-800'),
207
+ 700: map.get($ecl-colors, 'error-700'),
208
+ 600: map.get($ecl-colors, 'error-600'),
209
+ 500: map.get($ecl-colors, 'error-500'),
210
+ 400: map.get($ecl-colors, 'error-400'),
211
+ 300: map.get($ecl-colors, 'error-300'),
212
+ 200: map.get($ecl-colors, 'error-200'),
213
+ 100: map.get($ecl-colors, 'error-100'),
214
+ 75: map.get($ecl-colors, 'error-75'),
215
+ 50: map.get($ecl-colors, 'error-50'),
216
+ 25: map.get($ecl-colors, 'error-25')
217
+ ),
218
+ cta: (
219
+ 950: map.get($ecl-colors, 'secondary-950'),
220
+ 900: map.get($ecl-colors, 'secondary-900'),
221
+ 800: map.get($ecl-colors, 'secondary-800'),
222
+ 700: map.get($ecl-colors, 'secondary-700'),
223
+ 600: map.get($ecl-colors, 'secondary-600'),
224
+ 500: map.get($ecl-colors, 'secondary-500'),
225
+ 400: map.get($ecl-colors, 'secondary-400'),
226
+ 300: map.get($ecl-colors, 'secondary-300'),
227
+ 200: map.get($ecl-colors, 'secondary-200'),
228
+ 100: map.get($ecl-colors, 'secondary-100'),
229
+ 75: map.get($ecl-colors, 'secondary-75'),
230
+ 50: map.get($ecl-colors, 'secondary-50'),
231
+ 25: map.get($ecl-colors, 'secondary-25')
232
+ )
233
+ );
234
+
235
+
236
+ $color-state-map: (
237
+ branding: (
238
+ base: map.get(map.get($color-map, br), 900),
239
+ default: map.get(map.get($color-map, br), 900),
240
+ lighter: map.get(map.get($color-map, br), 700),
241
+ light: map.get(map.get($color-map, br), 800),
242
+ dark: map.get(map.get($color-map, br), 950),
243
+ surface: map.get(map.get($color-map, br), 900),
244
+ on-surface: base.getContrast(map.get(map.get($color-map, br), 900)),
245
+ surface-light: map.get(map.get($color-map, br), 800),
246
+ on-surface-light: base.getContrast(map.get(map.get($color-map, br), 800)),
247
+ surface-dark: map.get(map.get($color-map, br), 950),
248
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, br), 950)),
249
+ ),
250
+ primary: (
251
+ base: map.get(map.get($color-map, pr), 600),
252
+ default: map.get(map.get($color-map, pr), 700),
253
+ lighter: map.get(map.get($color-map, pr), 500),
254
+ light: map.get(map.get($color-map, pr), 600),
255
+ dark: map.get(map.get($color-map, pr), 900),
256
+ darker: map.get(map.get($color-map, pr), 950),
257
+ surface-light: map.get(map.get($color-map, pr), 75),
258
+ on-surface-light: map.get(map.get($color-map, pr), 900),
259
+ surface-light-hover: map.get(map.get($color-map, pr), 100),
260
+ on-surface-light-hover: map.get(map.get($color-map, pr), 950),
261
+ surface-medium: map.get(map.get($color-map, pr), 200),
262
+ on-surface-medium: base.getContrast(map.get(map.get($color-map, pr), 200)),
263
+ surface-medium-hover: map.get(map.get($color-map, pr), 300),
264
+ on-surface-medium-hover: base.getContrast(map.get(map.get($color-map, pr), 300)),
265
+ surface: map.get(map.get($color-map, pr), 600),
266
+ on-surface: base.getContrast(map.get(map.get($color-map, pr), 600)),
267
+ surface-hover: map.get(map.get($color-map, pr), 700),
268
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, pr), 700)),
269
+ surface-dark: map.get(map.get($color-map, pr), 900),
270
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, pr), 900)),
271
+ border: map.get(map.get($color-map, pr), 500),
272
+ border-light: map.get(map.get($color-map, pr), 300),
273
+ border-lighter: map.get(map.get($color-map, pr), 200),
274
+ ),
275
+ secondary: (
276
+ base: map.get(map.get($color-map, gr), 500),
277
+ default: map.get(map.get($color-map, gr), 800),
278
+ lighter: map.get(map.get($color-map, gr), 600),
279
+ light: map.get(map.get($color-map, gr), 700),
280
+ dark: map.get(map.get($color-map, gr), 900),
281
+ darker: map.get(map.get($color-map, gr), 950),
282
+ surface-light: map.get(map.get($color-map, gr), 50),
283
+ on-surface-light: map.get(map.get($color-map, gr), 900),
284
+ surface-light-hover: map.get(map.get($color-map, gr), 75),
285
+ on-surface-light-hover: map.get(map.get($color-map, gr), 950),
286
+ surface-medium: map.get(map.get($color-map, gr), 75),
287
+ on-surface-medium: map.get(map.get($color-map, gr), 900),
288
+ surface-medium-hover: map.get(map.get($color-map, gr), 100),
289
+ on-surface-medium-hover: map.get(map.get($color-map, gr), 950),
290
+ surface: map.get(map.get($color-map, gr), 600),
291
+ on-surface: base.getContrast(map.get(map.get($color-map, gr), 600)),
292
+ surface-hover: map.get(map.get($color-map, gr), 700),
293
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, gr), 700)),
294
+ surface-dark: map.get(map.get($color-map, gr), 900),
295
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, gr), 900)),
296
+ border: map.get(map.get($color-map, gr), 500),
297
+ border-light: map.get(map.get($color-map, gr), 300),
298
+ border-lighter: map.get(map.get($color-map, gr), 200),
299
+ ),
300
+ neutral: (
301
+ base: map.get(map.get($color-map, grn), 500),
302
+ default: map.get(map.get($color-map, grn), 500),
303
+ lighter: map.get(map.get($color-map, grn), 600),
304
+ light: map.get(map.get($color-map, grn), 700),
305
+ dark: map.get(map.get($color-map, grn), 900),
306
+ darker: map.get(map.get($color-map, grn), 950),
307
+ surface-light: map.get(map.get($color-map, grn), 50),
308
+ on-surface-light: map.get(map.get($color-map, grn), 900),
309
+ surface-light-hover: map.get(map.get($color-map, grn), 75),
310
+ on-surface-light-hover: map.get(map.get($color-map, grn), 950),
311
+ surface-medium: map.get(map.get($color-map, grn), 75),
312
+ on-surface-medium: map.get(map.get($color-map, grn), 900),
313
+ surface-medium-hover: map.get(map.get($color-map, grn), 100),
314
+ on-surface-medium-hover: map.get(map.get($color-map, grn), 950),
315
+ surface: map.get(map.get($color-map, grn), 400),
316
+ on-surface: base.getContrast(map.get(map.get($color-map, grn), 400)),
317
+ surface-hover: map.get(map.get($color-map, grn), 300),
318
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, grn), 300)),
319
+ surface-dark: map.get(map.get($color-map, grn), 900),
320
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, grn), 900)),
321
+ border: map.get(map.get($color-map, grn), 500),
322
+ border-light: map.get(map.get($color-map, grn), 400),
323
+ border-lighter: map.get(map.get($color-map, grn), 300),
324
+ ),
325
+ cta: (
326
+ base: map.get(map.get($color-map, cta), 400),
327
+ default: map.get(map.get($color-map, cta), 900),
328
+ lighter: map.get(map.get($color-map, cta), 400),
329
+ light: map.get(map.get($color-map, cta), 500),
330
+ dark: map.get(map.get($color-map, cta), 800),
331
+ darker: map.get(map.get($color-map, cta), 900),
332
+ surface-light: map.get(map.get($color-map, cta), 25),
333
+ on-surface-light: map.get(map.get($color-map, cta), 800),
334
+ surface-light-hover: map.get(map.get($color-map, cta), 50),
335
+ on-surface-light-hover: map.get(map.get($color-map, cta), 950),
336
+ surface-medium: map.get(map.get($color-map, cta), 75),
337
+ on-surface-medium: map.get(map.get($color-map, cta), 900),
338
+ surface-medium-hover: map.get(map.get($color-map, cta), 100),
339
+ on-surface-medium-hover: map.get(map.get($color-map, cta), 950),
340
+ surface: map.get(map.get($color-map, cta), 400),
341
+ on-surface: base.getContrast(map.get(map.get($color-map, cta), 400)),
342
+ surface-hover: map.get(map.get($color-map, cta), 500),
343
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, cta), 500)),
344
+ surface-dark: map.get(map.get($color-map, cta), 600),
345
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, cta), 600)),
346
+ border: map.get(map.get($color-map, cta), 300),
347
+ border-light: map.get(map.get($color-map, cta), 100),
348
+ border-lighter: map.get(map.get($color-map, cta), 75),
349
+ ),
350
+ info: (
351
+ base: map.get(map.get($color-map, in), 500),
352
+ default: map.get(map.get($color-map, in), 600),
353
+ lighter: map.get(map.get($color-map, in), 400),
354
+ light: map.get(map.get($color-map, in), 500),
355
+ dark: map.get(map.get($color-map, in), 800),
356
+ darker: map.get(map.get($color-map, in), 900),
357
+ surface-light: map.get(map.get($color-map, in), 75),
358
+ on-surface-light: map.get(map.get($color-map, in), 600),
359
+ surface-light-hover: map.get(map.get($color-map, in), 100),
360
+ on-surface-light-hover: map.get(map.get($color-map, in), 800),
361
+ surface-medium: map.get(map.get($color-map, in), 200),
362
+ on-surface-medium: map.get(map.get($color-map, in), 950),
363
+ surface-medium-hover: map.get(map.get($color-map, in), 300),
364
+ on-surface-medium-hover: base.getContrast(map.get(map.get($color-map, in), 300)),
365
+ surface: map.get(map.get($color-map, in), 600),
366
+ on-surface: base.getContrast(map.get(map.get($color-map, in), 600)),
367
+ surface-hover: map.get(map.get($color-map, in), 800),
368
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, in), 800)),
369
+ surface-dark: map.get(map.get($color-map, in), 800),
370
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, in), 800)),
371
+ border: map.get(map.get($color-map, in), 400),
372
+ border-light: map.get(map.get($color-map, in), 300),
373
+ border-lighter: map.get(map.get($color-map, in), 200),
374
+ ),
375
+ success: (
376
+ base: map.get(map.get($color-map, su), 700),
377
+ default: map.get(map.get($color-map, su), 900),
378
+ lighter: map.get(map.get($color-map, su), 700),
379
+ light: map.get(map.get($color-map, su), 800),
380
+ dark: map.get(map.get($color-map, su), 900),
381
+ darker: map.get(map.get($color-map, su), 950),
382
+ surface-light: map.get(map.get($color-map, su), 100),
383
+ on-surface-light: map.get(map.get($color-map, su), 950),
384
+ surface-light-hover: map.get(map.get($color-map, su), 200),
385
+ on-surface-light-hover: map.get(map.get($color-map, su), 950),
386
+ surface-medium: map.get(map.get($color-map, su), 300),
387
+ on-surface-medium: base.getContrast(map.get(map.get($color-map, su), 300)),
388
+ surface-medium-hover: map.get(map.get($color-map, su), 400),
389
+ on-surface-medium-hover: base.getContrast(map.get(map.get($color-map, su), 400)),
390
+ surface: map.get(map.get($color-map, su), 900),
391
+ on-surface: base.getContrast(map.get(map.get($color-map, su), 900)),
392
+ surface-hover: map.get(map.get($color-map, su), 950),
393
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, su), 950)),
394
+ surface-dark: map.get(map.get($color-map, su), 950),
395
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, su), 950)),
396
+ border: map.get(map.get($color-map, su), 600),
397
+ border-light: map.get(map.get($color-map, su), 400),
398
+ border-lighter: map.get(map.get($color-map, su), 300),
399
+ ),
400
+ warning: (
401
+ base: map.get(map.get($color-map, wa), 500),
402
+ default: map.get(map.get($color-map, wa), 900),
403
+ lighter: map.get(map.get($color-map, wa), 700),
404
+ light: map.get(map.get($color-map, wa), 800),
405
+ dark: map.get(map.get($color-map, wa), 950),
406
+ darker: map.get(map.get($color-map, wa), 950),
407
+ surface-light: map.get(map.get($color-map, wa), 50),
408
+ on-surface-light: map.get(map.get($color-map, wa), 900),
409
+ surface-light-hover: map.get(map.get($color-map, wa), 75),
410
+ on-surface-light-hover: map.get(map.get($color-map, wa), 950),
411
+ surface-medium: map.get(map.get($color-map, wa), 100),
412
+ on-surface-medium: map.get(map.get($color-map, wa), 900),
413
+ surface-medium-hover: map.get(map.get($color-map, wa), 200),
414
+ on-surface-medium-hover: map.get(map.get($color-map, wa), 950),
415
+ surface: map.get(map.get($color-map, wa), 500),
416
+ on-surface: base.getContrast(map.get(map.get($color-map, wa), 500)),
417
+ surface-hover: map.get(map.get($color-map, wa), 600),
418
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, wa), 600)),
419
+ surface-dark: map.get(map.get($color-map, wa), 900),
420
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, wa), 900)),
421
+ border: map.get(map.get($color-map, wa), 400),
422
+ border-light: map.get(map.get($color-map, wa), 200),
423
+ border-lighter: map.get(map.get($color-map, wa), 100),
424
+ ),
425
+ danger: (
426
+ base: map.get(map.get($color-map, da), 500),
427
+ default: map.get(map.get($color-map, da), 600),
428
+ lighter: map.get(map.get($color-map, da), 400),
429
+ light: map.get(map.get($color-map, da), 500),
430
+ dark: map.get(map.get($color-map, da), 700),
431
+ darker: map.get(map.get($color-map, da), 800),
432
+ surface-light: map.get(map.get($color-map, da), 75),
433
+ on-surface-light: map.get(map.get($color-map, da), 700),
434
+ surface-light-hover: map.get(map.get($color-map, da), 100),
435
+ on-surface-light-hover: map.get(map.get($color-map, da), 900),
436
+ surface-medium: map.get(map.get($color-map, da), 200),
437
+ on-surface-medium: map.get(map.get($color-map, da), 900),
438
+ surface-medium-hover: map.get(map.get($color-map, da), 300),
439
+ on-surface-medium-hover: map.get(map.get($color-map, da), 950),
440
+ surface: map.get(map.get($color-map, da), 600),
441
+ on-surface: base.getContrast(map.get(map.get($color-map, da), 600)),
442
+ surface-hover: map.get(map.get($color-map, da), 600),
443
+ on-surface-hover: base.getContrast(map.get(map.get($color-map, da), 700)),
444
+ surface-dark: map.get(map.get($color-map, da), 800),
445
+ on-surface-dark: base.getContrast(map.get(map.get($color-map, da), 800)),
446
+ border: map.get(map.get($color-map, da), 500),
447
+ border-light: map.get(map.get($color-map, da), 300),
448
+ border-lighter: map.get(map.get($color-map, da), 200),
449
+ ),
450
+ );
451
+