vira 28.19.1 → 28.19.3

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 (6) hide show
  1. package/dist/styles/vira-color-palette.d.ts +90 -81
  2. package/dist/styles/vira-color-palette.js +90 -81
  3. package/dist/styles/vira-color-theme.d.ts +666 -425
  4. package/dist/styles/vira-color-theme.js +871 -682
  5. package/dist/util/pop-up-manager.js +16 -23
  6. package/package.json +4 -4
package/dist/styles/vira-color-theme.js CHANGED
@@ -1,948 +1,1137 @@
1
- import { defineColorTheme } from 'theme-vir/dist/color/color-theme.js';
1
+ import { defineColorThemeOverride } from 'theme-vir/dist/color-theme/color-theme-override.js';
2
+ import { defineColorTheme } from 'theme-vir/dist/color-theme/color-theme.js';
2
3
  import { viraColorPalette } from './vira-color-palette.js';
3
4
  /**
4
- * A theme for Vira.
5
+ * A color theme from Vira.
5
6
  *
6
7
  * @category Color
7
8
  */
8
- export const viraColorTheme = defineColorTheme({
9
+ export const viraTheme = defineColorTheme({
9
10
  foreground: 'black',
10
11
  background: 'white',
11
12
  }, {
12
- 'vira-teal-ahead-background-body': {
13
- foreground: viraColorPalette['vira-teal-70'],
13
+ 'vira-red-foreground-body': {
14
+ foreground: viraColorPalette['vira-red-80'],
14
15
  },
15
- 'vira-teal-ahead-background-header': {
16
- foreground: viraColorPalette['vira-teal-50'],
16
+ 'vira-red-foreground-header': {
17
+ foreground: viraColorPalette['vira-red-50'],
17
18
  },
18
- 'vira-teal-ahead-background-placeholder': {
19
- foreground: viraColorPalette['vira-teal-40'],
19
+ 'vira-red-foreground-placeholder': {
20
+ foreground: viraColorPalette['vira-red-30'],
20
21
  },
21
- 'vira-teal-ahead-background-decoration': {
22
- foreground: viraColorPalette['vira-teal-20'],
22
+ 'vira-red-foreground-decoration': {
23
+ foreground: viraColorPalette['vira-red-20'],
23
24
  },
24
- 'vira-teal-behind-background-body': {
25
+ 'vira-red-foreground-invisible': {
26
+ foreground: viraColorPalette['vira-red-10'],
27
+ },
28
+ 'vira-red-background-body': {
25
29
  foreground: {
26
30
  refDefaultBackground: true,
27
31
  },
28
- background: viraColorPalette['vira-teal-70'],
32
+ background: viraColorPalette['vira-red-80'],
29
33
  },
30
- 'vira-teal-behind-background-header': {
34
+ 'vira-red-background-header': {
31
35
  foreground: {
32
36
  refDefaultBackground: true,
33
37
  },
34
- background: viraColorPalette['vira-teal-50'],
38
+ background: viraColorPalette['vira-red-40'],
35
39
  },
36
- 'vira-teal-behind-background-placeholder': {
40
+ 'vira-red-background-placeholder': {
37
41
  foreground: {
38
42
  refDefaultBackground: true,
39
43
  },
40
- background: viraColorPalette['vira-teal-30'],
44
+ background: viraColorPalette['vira-red-30'],
41
45
  },
42
- 'vira-teal-behind-background-decoration': {
46
+ 'vira-red-background-decoration': {
43
47
  foreground: {
44
48
  refDefaultBackground: true,
45
49
  },
46
- background: viraColorPalette['vira-teal-20'],
47
- },
48
- 'vira-teal-ahead-foreground-body': {
49
- foreground: viraColorPalette['vira-teal-20'],
50
- background: {
51
- refDefaultForeground: true,
52
- },
53
- },
54
- 'vira-teal-ahead-foreground-header': {
55
- foreground: viraColorPalette['vira-teal-50'],
56
- background: {
57
- refDefaultForeground: true,
58
- },
59
- },
60
- 'vira-teal-ahead-foreground-placeholder': {
61
- foreground: viraColorPalette['vira-teal-60'],
62
- background: {
63
- refDefaultForeground: true,
64
- },
50
+ background: viraColorPalette['vira-red-20'],
65
51
  },
66
- 'vira-teal-ahead-foreground-decoration': {
67
- foreground: viraColorPalette['vira-teal-70'],
68
- background: {
69
- refDefaultForeground: true,
52
+ 'vira-red-background-invisible': {
53
+ foreground: {
54
+ refDefaultBackground: true,
70
55
  },
56
+ background: viraColorPalette['vira-red-5'],
71
57
  },
72
- 'vira-teal-behind-foreground-body': {
73
- background: viraColorPalette['vira-teal-20'],
74
- },
75
- 'vira-teal-behind-foreground-header': {
76
- background: viraColorPalette['vira-teal-50'],
77
- },
78
- 'vira-teal-behind-foreground-placeholder': {
79
- background: viraColorPalette['vira-teal-60'],
80
- },
81
- 'vira-teal-behind-foreground-decoration': {
82
- background: viraColorPalette['vira-teal-70'],
83
- },
84
- 'vira-teal-self-light-front-body': {
85
- foreground: '#c9f6ee',
86
- background: viraColorPalette['vira-teal-80'],
87
- },
88
- 'vira-teal-self-light-front-header': {
89
- foreground: '#c9f6ee',
90
- background: viraColorPalette['vira-teal-60'],
91
- },
92
- 'vira-teal-self-light-front-placeholder': {
93
- foreground: '#c9f6ee',
94
- background: viraColorPalette['vira-teal-50'],
58
+ 'vira-red-on-self-body': {
59
+ foreground: viraColorPalette['vira-red-90'],
60
+ background: '#ffe9e6',
95
61
  },
96
- 'vira-teal-self-light-front-decoration': {
97
- foreground: '#c9f6ee',
98
- background: viraColorPalette['vira-teal-30'],
62
+ 'vira-red-on-self-header': {
63
+ foreground: viraColorPalette['vira-red-60'],
64
+ background: '#ffe9e6',
99
65
  },
100
- 'vira-teal-self-light-back-body': {
101
- foreground: viraColorPalette['vira-teal-90'],
102
- background: '#c9f6ee',
66
+ 'vira-red-on-self-placeholder': {
67
+ foreground: viraColorPalette['vira-red-50'],
68
+ background: '#ffe9e6',
103
69
  },
104
- 'vira-teal-self-light-back-header': {
105
- foreground: viraColorPalette['vira-teal-60'],
106
- background: '#c9f6ee',
70
+ 'vira-red-on-self-decoration': {
71
+ foreground: viraColorPalette['vira-red-30'],
72
+ background: '#ffe9e6',
107
73
  },
108
- 'vira-teal-self-light-back-placeholder': {
109
- foreground: viraColorPalette['vira-teal-50'],
110
- background: '#c9f6ee',
74
+ 'vira-red-on-self-invisible': {
75
+ foreground: viraColorPalette['vira-red-20'],
76
+ background: '#ffe9e6',
111
77
  },
112
- 'vira-teal-self-light-back-decoration': {
113
- foreground: viraColorPalette['vira-teal-40'],
114
- background: '#c9f6ee',
78
+ 'vira-orange-foreground-body': {
79
+ foreground: viraColorPalette['vira-orange-80'],
115
80
  },
116
- 'vira-blue-ahead-background-body': {
117
- foreground: viraColorPalette['vira-blue-70'],
81
+ 'vira-orange-foreground-header': {
82
+ foreground: viraColorPalette['vira-orange-50'],
118
83
  },
119
- 'vira-blue-ahead-background-header': {
120
- foreground: viraColorPalette['vira-blue-50'],
84
+ 'vira-orange-foreground-placeholder': {
85
+ foreground: viraColorPalette['vira-orange-30'],
121
86
  },
122
- 'vira-blue-ahead-background-placeholder': {
123
- foreground: viraColorPalette['vira-blue-40'],
87
+ 'vira-orange-foreground-decoration': {
88
+ foreground: viraColorPalette['vira-orange-20'],
124
89
  },
125
- 'vira-blue-ahead-background-decoration': {
126
- foreground: viraColorPalette['vira-blue-30'],
90
+ 'vira-orange-foreground-invisible': {
91
+ foreground: viraColorPalette['vira-orange-5'],
127
92
  },
128
- 'vira-blue-behind-background-body': {
93
+ 'vira-orange-background-body': {
129
94
  foreground: {
130
95
  refDefaultBackground: true,
131
96
  },
132
- background: viraColorPalette['vira-blue-70'],
97
+ background: viraColorPalette['vira-orange-80'],
133
98
  },
134
- 'vira-blue-behind-background-header': {
99
+ 'vira-orange-background-header': {
135
100
  foreground: {
136
101
  refDefaultBackground: true,
137
102
  },
138
- background: viraColorPalette['vira-blue-50'],
103
+ background: viraColorPalette['vira-orange-40'],
139
104
  },
140
- 'vira-blue-behind-background-placeholder': {
105
+ 'vira-orange-background-placeholder': {
141
106
  foreground: {
142
107
  refDefaultBackground: true,
143
108
  },
144
- background: viraColorPalette['vira-blue-40'],
109
+ background: viraColorPalette['vira-orange-30'],
145
110
  },
146
- 'vira-blue-behind-background-decoration': {
111
+ 'vira-orange-background-decoration': {
147
112
  foreground: {
148
113
  refDefaultBackground: true,
149
114
  },
150
- background: viraColorPalette['vira-blue-20'],
151
- },
152
- 'vira-blue-ahead-foreground-body': {
153
- foreground: viraColorPalette['vira-blue-20'],
154
- background: {
155
- refDefaultForeground: true,
156
- },
157
- },
158
- 'vira-blue-ahead-foreground-header': {
159
- foreground: viraColorPalette['vira-blue-50'],
160
- background: {
161
- refDefaultForeground: true,
162
- },
163
- },
164
- 'vira-blue-ahead-foreground-placeholder': {
165
- foreground: viraColorPalette['vira-blue-60'],
166
- background: {
167
- refDefaultForeground: true,
168
- },
115
+ background: viraColorPalette['vira-orange-20'],
169
116
  },
170
- 'vira-blue-ahead-foreground-decoration': {
171
- foreground: viraColorPalette['vira-blue-70'],
172
- background: {
173
- refDefaultForeground: true,
117
+ 'vira-orange-background-invisible': {
118
+ foreground: {
119
+ refDefaultBackground: true,
174
120
  },
121
+ background: viraColorPalette['vira-orange-5'],
175
122
  },
176
- 'vira-blue-behind-foreground-body': {
177
- background: viraColorPalette['vira-blue-20'],
178
- },
179
- 'vira-blue-behind-foreground-header': {
180
- background: viraColorPalette['vira-blue-50'],
181
- },
182
- 'vira-blue-behind-foreground-placeholder': {
183
- background: viraColorPalette['vira-blue-60'],
123
+ 'vira-orange-on-self-body': {
124
+ foreground: viraColorPalette['vira-orange-90'],
125
+ background: '#ffebd1',
184
126
  },
185
- 'vira-blue-behind-foreground-decoration': {
186
- background: viraColorPalette['vira-blue-70'],
187
- },
188
- 'vira-blue-self-light-front-body': {
189
- foreground: '#ddf0f9',
190
- background: viraColorPalette['vira-blue-80'],
191
- },
192
- 'vira-blue-self-light-front-header': {
193
- foreground: '#ddf0f9',
194
- background: viraColorPalette['vira-blue-60'],
195
- },
196
- 'vira-blue-self-light-front-placeholder': {
197
- foreground: '#ddf0f9',
198
- background: viraColorPalette['vira-blue-50'],
199
- },
200
- 'vira-blue-self-light-front-decoration': {
201
- foreground: '#ddf0f9',
202
- background: viraColorPalette['vira-blue-30'],
127
+ 'vira-orange-on-self-header': {
128
+ foreground: viraColorPalette['vira-orange-60'],
129
+ background: '#ffebd1',
203
130
  },
204
- 'vira-blue-self-light-back-body': {
205
- foreground: viraColorPalette['vira-blue-80'],
206
- background: '#ddf0f9',
131
+ 'vira-orange-on-self-placeholder': {
132
+ foreground: viraColorPalette['vira-orange-50'],
133
+ background: '#ffebd1',
207
134
  },
208
- 'vira-blue-self-light-back-header': {
209
- foreground: viraColorPalette['vira-blue-60'],
210
- background: '#ddf0f9',
135
+ 'vira-orange-on-self-decoration': {
136
+ foreground: viraColorPalette['vira-orange-30'],
137
+ background: '#ffebd1',
211
138
  },
212
- 'vira-blue-self-light-back-placeholder': {
213
- foreground: viraColorPalette['vira-blue-50'],
214
- background: '#ddf0f9',
139
+ 'vira-orange-on-self-invisible': {
140
+ foreground: viraColorPalette['vira-orange-20'],
141
+ background: '#ffebd1',
215
142
  },
216
- 'vira-blue-self-light-back-decoration': {
217
- foreground: viraColorPalette['vira-blue-40'],
218
- background: '#ddf0f9',
143
+ 'vira-yellow-foreground-body': {
144
+ foreground: viraColorPalette['vira-yellow-80'],
219
145
  },
220
- 'vira-purple-ahead-background-body': {
221
- foreground: viraColorPalette['vira-purple-70'],
146
+ 'vira-yellow-foreground-header': {
147
+ foreground: viraColorPalette['vira-yellow-50'],
222
148
  },
223
- 'vira-purple-ahead-background-header': {
224
- foreground: viraColorPalette['vira-purple-50'],
149
+ 'vira-yellow-foreground-placeholder': {
150
+ foreground: viraColorPalette['vira-yellow-40'],
225
151
  },
226
- 'vira-purple-ahead-background-placeholder': {
227
- foreground: viraColorPalette['vira-purple-40'],
152
+ 'vira-yellow-foreground-decoration': {
153
+ foreground: viraColorPalette['vira-yellow-20'],
228
154
  },
229
- 'vira-purple-ahead-background-decoration': {
230
- foreground: viraColorPalette['vira-purple-30'],
155
+ 'vira-yellow-foreground-invisible': {
156
+ foreground: viraColorPalette['vira-yellow-5'],
231
157
  },
232
- 'vira-purple-behind-background-body': {
158
+ 'vira-yellow-background-body': {
233
159
  foreground: {
234
160
  refDefaultBackground: true,
235
161
  },
236
- background: viraColorPalette['vira-purple-70'],
162
+ background: viraColorPalette['vira-yellow-80'],
237
163
  },
238
- 'vira-purple-behind-background-header': {
164
+ 'vira-yellow-background-header': {
239
165
  foreground: {
240
166
  refDefaultBackground: true,
241
167
  },
242
- background: viraColorPalette['vira-purple-50'],
168
+ background: viraColorPalette['vira-yellow-40'],
243
169
  },
244
- 'vira-purple-behind-background-placeholder': {
170
+ 'vira-yellow-background-placeholder': {
245
171
  foreground: {
246
172
  refDefaultBackground: true,
247
173
  },
248
- background: viraColorPalette['vira-purple-40'],
174
+ background: viraColorPalette['vira-yellow-30'],
249
175
  },
250
- 'vira-purple-behind-background-decoration': {
176
+ 'vira-yellow-background-decoration': {
251
177
  foreground: {
252
178
  refDefaultBackground: true,
253
179
  },
254
- background: viraColorPalette['vira-purple-20'],
255
- },
256
- 'vira-purple-ahead-foreground-body': {
257
- foreground: viraColorPalette['vira-purple-20'],
258
- background: {
259
- refDefaultForeground: true,
260
- },
261
- },
262
- 'vira-purple-ahead-foreground-header': {
263
- foreground: viraColorPalette['vira-purple-50'],
264
- background: {
265
- refDefaultForeground: true,
266
- },
267
- },
268
- 'vira-purple-ahead-foreground-placeholder': {
269
- foreground: viraColorPalette['vira-purple-60'],
270
- background: {
271
- refDefaultForeground: true,
272
- },
180
+ background: viraColorPalette['vira-yellow-20'],
273
181
  },
274
- 'vira-purple-ahead-foreground-decoration': {
275
- foreground: viraColorPalette['vira-purple-70'],
276
- background: {
277
- refDefaultForeground: true,
182
+ 'vira-yellow-background-invisible': {
183
+ foreground: {
184
+ refDefaultBackground: true,
278
185
  },
186
+ background: viraColorPalette['vira-yellow-5'],
279
187
  },
280
- 'vira-purple-behind-foreground-body': {
281
- background: viraColorPalette['vira-purple-20'],
282
- },
283
- 'vira-purple-behind-foreground-header': {
284
- background: viraColorPalette['vira-purple-50'],
285
- },
286
- 'vira-purple-behind-foreground-placeholder': {
287
- background: viraColorPalette['vira-purple-60'],
288
- },
289
- 'vira-purple-behind-foreground-decoration': {
290
- background: viraColorPalette['vira-purple-70'],
291
- },
292
- 'vira-purple-self-light-front-body': {
293
- foreground: '#f0eafb',
294
- background: viraColorPalette['vira-purple-80'],
295
- },
296
- 'vira-purple-self-light-front-header': {
297
- foreground: '#f0eafb',
298
- background: viraColorPalette['vira-purple-60'],
299
- },
300
- 'vira-purple-self-light-front-placeholder': {
301
- foreground: '#f0eafb',
302
- background: viraColorPalette['vira-purple-50'],
188
+ 'vira-yellow-on-self-body': {
189
+ foreground: viraColorPalette['vira-yellow-90'],
190
+ background: '#f5f0c6',
303
191
  },
304
- 'vira-purple-self-light-front-decoration': {
305
- foreground: '#f0eafb',
306
- background: viraColorPalette['vira-purple-30'],
192
+ 'vira-yellow-on-self-header': {
193
+ foreground: viraColorPalette['vira-yellow-60'],
194
+ background: '#f5f0c6',
307
195
  },
308
- 'vira-purple-self-light-back-body': {
309
- foreground: viraColorPalette['vira-purple-90'],
310
- background: '#f0eafb',
196
+ 'vira-yellow-on-self-placeholder': {
197
+ foreground: viraColorPalette['vira-yellow-40'],
198
+ background: '#f5f0c6',
311
199
  },
312
- 'vira-purple-self-light-back-header': {
313
- foreground: viraColorPalette['vira-purple-60'],
314
- background: '#f0eafb',
200
+ 'vira-yellow-on-self-decoration': {
201
+ foreground: viraColorPalette['vira-yellow-30'],
202
+ background: '#f5f0c6',
315
203
  },
316
- 'vira-purple-self-light-back-placeholder': {
317
- foreground: viraColorPalette['vira-purple-50'],
318
- background: '#f0eafb',
204
+ 'vira-yellow-on-self-invisible': {
205
+ foreground: viraColorPalette['vira-yellow-10'],
206
+ background: '#f5f0c6',
319
207
  },
320
- 'vira-purple-self-light-back-decoration': {
321
- foreground: viraColorPalette['vira-purple-40'],
322
- background: '#f0eafb',
208
+ 'vira-green-foreground-body': {
209
+ foreground: viraColorPalette['vira-green-80'],
323
210
  },
324
- 'vira-pink-ahead-background-body': {
325
- foreground: viraColorPalette['vira-pink-70'],
211
+ 'vira-green-foreground-header': {
212
+ foreground: viraColorPalette['vira-green-50'],
326
213
  },
327
- 'vira-pink-ahead-background-header': {
328
- foreground: viraColorPalette['vira-pink-50'],
214
+ 'vira-green-foreground-placeholder': {
215
+ foreground: viraColorPalette['vira-green-40'],
329
216
  },
330
- 'vira-pink-ahead-background-placeholder': {
331
- foreground: viraColorPalette['vira-pink-40'],
217
+ 'vira-green-foreground-decoration': {
218
+ foreground: viraColorPalette['vira-green-20'],
332
219
  },
333
- 'vira-pink-ahead-background-decoration': {
334
- foreground: viraColorPalette['vira-pink-30'],
220
+ 'vira-green-foreground-invisible': {
221
+ foreground: viraColorPalette['vira-green-5'],
335
222
  },
336
- 'vira-pink-behind-background-body': {
223
+ 'vira-green-background-body': {
337
224
  foreground: {
338
225
  refDefaultBackground: true,
339
226
  },
340
- background: viraColorPalette['vira-pink-70'],
227
+ background: viraColorPalette['vira-green-80'],
341
228
  },
342
- 'vira-pink-behind-background-header': {
229
+ 'vira-green-background-header': {
343
230
  foreground: {
344
231
  refDefaultBackground: true,
345
232
  },
346
- background: viraColorPalette['vira-pink-50'],
233
+ background: viraColorPalette['vira-green-40'],
347
234
  },
348
- 'vira-pink-behind-background-placeholder': {
235
+ 'vira-green-background-placeholder': {
349
236
  foreground: {
350
237
  refDefaultBackground: true,
351
238
  },
352
- background: viraColorPalette['vira-pink-40'],
239
+ background: viraColorPalette['vira-green-30'],
353
240
  },
354
- 'vira-pink-behind-background-decoration': {
241
+ 'vira-green-background-decoration': {
355
242
  foreground: {
356
243
  refDefaultBackground: true,
357
244
  },
358
- background: viraColorPalette['vira-pink-20'],
359
- },
360
- 'vira-pink-ahead-foreground-body': {
361
- foreground: viraColorPalette['vira-pink-20'],
362
- background: {
363
- refDefaultForeground: true,
364
- },
365
- },
366
- 'vira-pink-ahead-foreground-header': {
367
- foreground: viraColorPalette['vira-pink-50'],
368
- background: {
369
- refDefaultForeground: true,
370
- },
371
- },
372
- 'vira-pink-ahead-foreground-placeholder': {
373
- foreground: viraColorPalette['vira-pink-60'],
374
- background: {
375
- refDefaultForeground: true,
376
- },
245
+ background: viraColorPalette['vira-green-20'],
377
246
  },
378
- 'vira-pink-ahead-foreground-decoration': {
379
- foreground: viraColorPalette['vira-pink-70'],
380
- background: {
381
- refDefaultForeground: true,
247
+ 'vira-green-background-invisible': {
248
+ foreground: {
249
+ refDefaultBackground: true,
382
250
  },
251
+ background: viraColorPalette['vira-green-5'],
383
252
  },
384
- 'vira-pink-behind-foreground-body': {
385
- background: viraColorPalette['vira-pink-20'],
386
- },
387
- 'vira-pink-behind-foreground-header': {
388
- background: viraColorPalette['vira-pink-50'],
389
- },
390
- 'vira-pink-behind-foreground-placeholder': {
391
- background: viraColorPalette['vira-pink-60'],
392
- },
393
- 'vira-pink-behind-foreground-decoration': {
394
- background: viraColorPalette['vira-pink-70'],
395
- },
396
- 'vira-pink-self-light-front-body': {
397
- foreground: '#fbe7f9',
398
- background: viraColorPalette['vira-pink-80'],
399
- },
400
- 'vira-pink-self-light-front-header': {
401
- foreground: '#fbe7f9',
402
- background: viraColorPalette['vira-pink-60'],
403
- },
404
- 'vira-pink-self-light-front-placeholder': {
405
- foreground: '#fbe7f9',
406
- background: viraColorPalette['vira-pink-50'],
253
+ 'vira-green-on-self-body': {
254
+ foreground: viraColorPalette['vira-green-90'],
255
+ background: '#def6cc',
407
256
  },
408
- 'vira-pink-self-light-front-decoration': {
409
- foreground: '#fbe7f9',
410
- background: viraColorPalette['vira-pink-30'],
257
+ 'vira-green-on-self-header': {
258
+ foreground: viraColorPalette['vira-green-60'],
259
+ background: '#def6cc',
411
260
  },
412
- 'vira-pink-self-light-back-body': {
413
- foreground: viraColorPalette['vira-pink-80'],
414
- background: '#fbe7f9',
261
+ 'vira-green-on-self-placeholder': {
262
+ foreground: viraColorPalette['vira-green-40'],
263
+ background: '#def6cc',
415
264
  },
416
- 'vira-pink-self-light-back-header': {
417
- foreground: viraColorPalette['vira-pink-60'],
418
- background: '#fbe7f9',
265
+ 'vira-green-on-self-decoration': {
266
+ foreground: viraColorPalette['vira-green-30'],
267
+ background: '#def6cc',
419
268
  },
420
- 'vira-pink-self-light-back-placeholder': {
421
- foreground: viraColorPalette['vira-pink-50'],
422
- background: '#fbe7f9',
269
+ 'vira-green-on-self-invisible': {
270
+ foreground: viraColorPalette['vira-green-10'],
271
+ background: '#def6cc',
423
272
  },
424
- 'vira-pink-self-light-back-decoration': {
425
- foreground: viraColorPalette['vira-pink-40'],
426
- background: '#fbe7f9',
273
+ 'vira-teal-foreground-body': {
274
+ foreground: viraColorPalette['vira-teal-80'],
427
275
  },
428
- 'vira-red-ahead-background-body': {
429
- foreground: viraColorPalette['vira-red-70'],
276
+ 'vira-teal-foreground-header': {
277
+ foreground: viraColorPalette['vira-teal-50'],
430
278
  },
431
- 'vira-red-ahead-background-header': {
432
- foreground: viraColorPalette['vira-red-50'],
279
+ 'vira-teal-foreground-placeholder': {
280
+ foreground: viraColorPalette['vira-teal-40'],
433
281
  },
434
- 'vira-red-ahead-background-placeholder': {
435
- foreground: viraColorPalette['vira-red-40'],
282
+ 'vira-teal-foreground-decoration': {
283
+ foreground: viraColorPalette['vira-teal-20'],
436
284
  },
437
- 'vira-red-ahead-background-decoration': {
438
- foreground: viraColorPalette['vira-red-30'],
285
+ 'vira-teal-foreground-invisible': {
286
+ foreground: viraColorPalette['vira-teal-5'],
439
287
  },
440
- 'vira-red-behind-background-body': {
288
+ 'vira-teal-background-body': {
441
289
  foreground: {
442
290
  refDefaultBackground: true,
443
291
  },
444
- background: viraColorPalette['vira-red-70'],
292
+ background: viraColorPalette['vira-teal-80'],
445
293
  },
446
- 'vira-red-behind-background-header': {
294
+ 'vira-teal-background-header': {
447
295
  foreground: {
448
296
  refDefaultBackground: true,
449
297
  },
450
- background: viraColorPalette['vira-red-50'],
298
+ background: viraColorPalette['vira-teal-40'],
451
299
  },
452
- 'vira-red-behind-background-placeholder': {
300
+ 'vira-teal-background-placeholder': {
453
301
  foreground: {
454
302
  refDefaultBackground: true,
455
303
  },
456
- background: viraColorPalette['vira-red-40'],
304
+ background: viraColorPalette['vira-teal-30'],
457
305
  },
458
- 'vira-red-behind-background-decoration': {
306
+ 'vira-teal-background-decoration': {
459
307
  foreground: {
460
308
  refDefaultBackground: true,
461
309
  },
462
- background: viraColorPalette['vira-red-20'],
463
- },
464
- 'vira-red-ahead-foreground-body': {
465
- foreground: viraColorPalette['vira-red-20'],
466
- background: {
467
- refDefaultForeground: true,
468
- },
469
- },
470
- 'vira-red-ahead-foreground-header': {
471
- foreground: viraColorPalette['vira-red-50'],
472
- background: {
473
- refDefaultForeground: true,
474
- },
475
- },
476
- 'vira-red-ahead-foreground-placeholder': {
477
- foreground: viraColorPalette['vira-red-60'],
478
- background: {
479
- refDefaultForeground: true,
480
- },
310
+ background: viraColorPalette['vira-teal-20'],
481
311
  },
482
- 'vira-red-ahead-foreground-decoration': {
483
- foreground: viraColorPalette['vira-red-70'],
484
- background: {
485
- refDefaultForeground: true,
312
+ 'vira-teal-background-invisible': {
313
+ foreground: {
314
+ refDefaultBackground: true,
486
315
  },
316
+ background: viraColorPalette['vira-teal-5'],
487
317
  },
488
- 'vira-red-behind-foreground-body': {
489
- background: viraColorPalette['vira-red-20'],
490
- },
491
- 'vira-red-behind-foreground-header': {
492
- background: viraColorPalette['vira-red-50'],
493
- },
494
- 'vira-red-behind-foreground-placeholder': {
495
- background: viraColorPalette['vira-red-60'],
496
- },
497
- 'vira-red-behind-foreground-decoration': {
498
- background: viraColorPalette['vira-red-70'],
499
- },
500
- 'vira-red-self-light-front-body': {
501
- foreground: '#fbe8ec',
502
- background: viraColorPalette['vira-red-90'],
503
- },
504
- 'vira-red-self-light-front-header': {
505
- foreground: '#fbe8ec',
506
- background: viraColorPalette['vira-red-60'],
507
- },
508
- 'vira-red-self-light-front-placeholder': {
509
- foreground: '#fbe8ec',
510
- background: viraColorPalette['vira-red-50'],
318
+ 'vira-teal-on-self-body': {
319
+ foreground: viraColorPalette['vira-teal-90'],
320
+ background: '#d3f5ed',
511
321
  },
512
- 'vira-red-self-light-front-decoration': {
513
- foreground: '#fbe8ec',
514
- background: viraColorPalette['vira-red-30'],
322
+ 'vira-teal-on-self-header': {
323
+ foreground: viraColorPalette['vira-teal-60'],
324
+ background: '#d3f5ed',
515
325
  },
516
- 'vira-red-self-light-back-body': {
517
- foreground: viraColorPalette['vira-red-90'],
518
- background: '#fbe8ec',
326
+ 'vira-teal-on-self-placeholder': {
327
+ foreground: viraColorPalette['vira-teal-50'],
328
+ background: '#d3f5ed',
519
329
  },
520
- 'vira-red-self-light-back-header': {
521
- foreground: viraColorPalette['vira-red-60'],
522
- background: '#fbe8ec',
330
+ 'vira-teal-on-self-decoration': {
331
+ foreground: viraColorPalette['vira-teal-30'],
332
+ background: '#d3f5ed',
523
333
  },
524
- 'vira-red-self-light-back-placeholder': {
525
- foreground: viraColorPalette['vira-red-50'],
526
- background: '#fbe8ec',
334
+ 'vira-teal-on-self-invisible': {
335
+ foreground: viraColorPalette['vira-teal-20'],
336
+ background: '#d3f5ed',
527
337
  },
528
- 'vira-red-self-light-back-decoration': {
529
- foreground: viraColorPalette['vira-red-40'],
530
- background: '#fbe8ec',
338
+ 'vira-blue-foreground-body': {
339
+ foreground: viraColorPalette['vira-blue-80'],
531
340
  },
532
- 'vira-orange-ahead-background-body': {
533
- foreground: viraColorPalette['vira-orange-70'],
341
+ 'vira-blue-foreground-header': {
342
+ foreground: viraColorPalette['vira-blue-50'],
534
343
  },
535
- 'vira-orange-ahead-background-header': {
536
- foreground: viraColorPalette['vira-orange-50'],
344
+ 'vira-blue-foreground-placeholder': {
345
+ foreground: viraColorPalette['vira-blue-40'],
537
346
  },
538
- 'vira-orange-ahead-background-placeholder': {
539
- foreground: viraColorPalette['vira-orange-40'],
347
+ 'vira-blue-foreground-decoration': {
348
+ foreground: viraColorPalette['vira-blue-20'],
540
349
  },
541
- 'vira-orange-ahead-background-decoration': {
542
- foreground: viraColorPalette['vira-orange-30'],
350
+ 'vira-blue-foreground-invisible': {
351
+ foreground: viraColorPalette['vira-blue-5'],
543
352
  },
544
- 'vira-orange-behind-background-body': {
353
+ 'vira-blue-background-body': {
545
354
  foreground: {
546
355
  refDefaultBackground: true,
547
356
  },
548
- background: viraColorPalette['vira-orange-70'],
357
+ background: viraColorPalette['vira-blue-70'],
549
358
  },
550
- 'vira-orange-behind-background-header': {
359
+ 'vira-blue-background-header': {
551
360
  foreground: {
552
361
  refDefaultBackground: true,
553
362
  },
554
- background: viraColorPalette['vira-orange-50'],
363
+ background: viraColorPalette['vira-blue-40'],
555
364
  },
556
- 'vira-orange-behind-background-placeholder': {
365
+ 'vira-blue-background-placeholder': {
557
366
  foreground: {
558
367
  refDefaultBackground: true,
559
368
  },
560
- background: viraColorPalette['vira-orange-40'],
369
+ background: viraColorPalette['vira-blue-30'],
561
370
  },
562
- 'vira-orange-behind-background-decoration': {
371
+ 'vira-blue-background-decoration': {
563
372
  foreground: {
564
373
  refDefaultBackground: true,
565
374
  },
566
- background: viraColorPalette['vira-orange-20'],
567
- },
568
- 'vira-orange-ahead-foreground-body': {
569
- foreground: viraColorPalette['vira-orange-20'],
570
- background: {
571
- refDefaultForeground: true,
572
- },
573
- },
574
- 'vira-orange-ahead-foreground-header': {
575
- foreground: viraColorPalette['vira-orange-50'],
576
- background: {
577
- refDefaultForeground: true,
578
- },
579
- },
580
- 'vira-orange-ahead-foreground-placeholder': {
581
- foreground: viraColorPalette['vira-orange-60'],
582
- background: {
583
- refDefaultForeground: true,
584
- },
375
+ background: viraColorPalette['vira-blue-20'],
585
376
  },
586
- 'vira-orange-ahead-foreground-decoration': {
587
- foreground: viraColorPalette['vira-orange-70'],
588
- background: {
589
- refDefaultForeground: true,
377
+ 'vira-blue-background-invisible': {
378
+ foreground: {
379
+ refDefaultBackground: true,
590
380
  },
381
+ background: viraColorPalette['vira-blue-5'],
591
382
  },
592
- 'vira-orange-behind-foreground-body': {
593
- background: viraColorPalette['vira-orange-20'],
594
- },
595
- 'vira-orange-behind-foreground-header': {
596
- background: viraColorPalette['vira-orange-50'],
597
- },
598
- 'vira-orange-behind-foreground-placeholder': {
599
- background: viraColorPalette['vira-orange-60'],
600
- },
601
- 'vira-orange-behind-foreground-decoration': {
602
- background: viraColorPalette['vira-orange-70'],
603
- },
604
- 'vira-orange-self-light-front-body': {
605
- foreground: '#f8ebd9',
606
- background: viraColorPalette['vira-orange-80'],
607
- },
608
- 'vira-orange-self-light-front-header': {
609
- foreground: '#f8ebd9',
610
- background: viraColorPalette['vira-orange-60'],
383
+ 'vira-blue-on-self-body': {
384
+ foreground: viraColorPalette['vira-blue-90'],
385
+ background: '#def1ff',
611
386
  },
612
- 'vira-orange-self-light-front-placeholder': {
613
- foreground: '#f8ebd9',
614
- background: viraColorPalette['vira-orange-50'],
615
- },
616
- 'vira-orange-self-light-front-decoration': {
617
- foreground: '#f8ebd9',
618
- background: viraColorPalette['vira-orange-30'],
387
+ 'vira-blue-on-self-header': {
388
+ foreground: viraColorPalette['vira-blue-60'],
389
+ background: '#def1ff',
619
390
  },
620
- 'vira-orange-self-light-back-body': {
621
- foreground: viraColorPalette['vira-orange-80'],
622
- background: '#f8ebd9',
391
+ 'vira-blue-on-self-placeholder': {
392
+ foreground: viraColorPalette['vira-blue-50'],
393
+ background: '#def1ff',
623
394
  },
624
- 'vira-orange-self-light-back-header': {
625
- foreground: viraColorPalette['vira-orange-60'],
626
- background: '#f8ebd9',
395
+ 'vira-blue-on-self-decoration': {
396
+ foreground: viraColorPalette['vira-blue-30'],
397
+ background: '#def1ff',
627
398
  },
628
- 'vira-orange-self-light-back-placeholder': {
629
- foreground: viraColorPalette['vira-orange-50'],
630
- background: '#f8ebd9',
399
+ 'vira-blue-on-self-invisible': {
400
+ foreground: viraColorPalette['vira-blue-10'],
401
+ background: '#def1ff',
631
402
  },
632
- 'vira-orange-self-light-back-decoration': {
633
- foreground: viraColorPalette['vira-orange-40'],
634
- background: '#f8ebd9',
403
+ 'vira-purple-foreground-body': {
404
+ foreground: viraColorPalette['vira-purple-80'],
635
405
  },
636
- 'vira-green-ahead-background-body': {
637
- foreground: viraColorPalette['vira-green-70'],
406
+ 'vira-purple-foreground-header': {
407
+ foreground: viraColorPalette['vira-purple-50'],
638
408
  },
639
- 'vira-green-ahead-background-header': {
640
- foreground: viraColorPalette['vira-green-50'],
409
+ 'vira-purple-foreground-placeholder': {
410
+ foreground: viraColorPalette['vira-purple-40'],
641
411
  },
642
- 'vira-green-ahead-background-placeholder': {
643
- foreground: viraColorPalette['vira-green-40'],
412
+ 'vira-purple-foreground-decoration': {
413
+ foreground: viraColorPalette['vira-purple-20'],
644
414
  },
645
- 'vira-green-ahead-background-decoration': {
646
- foreground: viraColorPalette['vira-green-30'],
415
+ 'vira-purple-foreground-invisible': {
416
+ foreground: viraColorPalette['vira-purple-5'],
647
417
  },
648
- 'vira-green-behind-background-body': {
418
+ 'vira-purple-background-body': {
649
419
  foreground: {
650
420
  refDefaultBackground: true,
651
421
  },
652
- background: viraColorPalette['vira-green-70'],
422
+ background: viraColorPalette['vira-purple-80'],
653
423
  },
654
- 'vira-green-behind-background-header': {
424
+ 'vira-purple-background-header': {
655
425
  foreground: {
656
426
  refDefaultBackground: true,
657
427
  },
658
- background: viraColorPalette['vira-green-50'],
428
+ background: viraColorPalette['vira-purple-40'],
659
429
  },
660
- 'vira-green-behind-background-placeholder': {
430
+ 'vira-purple-background-placeholder': {
661
431
  foreground: {
662
432
  refDefaultBackground: true,
663
433
  },
664
- background: viraColorPalette['vira-green-30'],
434
+ background: viraColorPalette['vira-purple-30'],
665
435
  },
666
- 'vira-green-behind-background-decoration': {
436
+ 'vira-purple-background-decoration': {
667
437
  foreground: {
668
438
  refDefaultBackground: true,
669
439
  },
670
- background: viraColorPalette['vira-green-20'],
671
- },
672
- 'vira-green-ahead-foreground-body': {
673
- foreground: viraColorPalette['vira-green-20'],
674
- background: {
675
- refDefaultForeground: true,
676
- },
677
- },
678
- 'vira-green-ahead-foreground-header': {
679
- foreground: viraColorPalette['vira-green-50'],
680
- background: {
681
- refDefaultForeground: true,
682
- },
683
- },
684
- 'vira-green-ahead-foreground-placeholder': {
685
- foreground: viraColorPalette['vira-green-60'],
686
- background: {
687
- refDefaultForeground: true,
688
- },
440
+ background: viraColorPalette['vira-purple-20'],
689
441
  },
690
- 'vira-green-ahead-foreground-decoration': {
691
- foreground: viraColorPalette['vira-green-70'],
692
- background: {
693
- refDefaultForeground: true,
442
+ 'vira-purple-background-invisible': {
443
+ foreground: {
444
+ refDefaultBackground: true,
694
445
  },
446
+ background: viraColorPalette['vira-purple-5'],
695
447
  },
696
- 'vira-green-behind-foreground-body': {
697
- background: viraColorPalette['vira-green-20'],
698
- },
699
- 'vira-green-behind-foreground-header': {
700
- background: viraColorPalette['vira-green-50'],
701
- },
702
- 'vira-green-behind-foreground-placeholder': {
703
- background: viraColorPalette['vira-green-60'],
704
- },
705
- 'vira-green-behind-foreground-decoration': {
706
- background: viraColorPalette['vira-green-70'],
707
- },
708
- 'vira-green-self-light-front-body': {
709
- foreground: '#e2f4bd',
710
- background: viraColorPalette['vira-green-80'],
711
- },
712
- 'vira-green-self-light-front-header': {
713
- foreground: '#e2f4bd',
714
- background: viraColorPalette['vira-green-60'],
448
+ 'vira-purple-on-self-body': {
449
+ foreground: viraColorPalette['vira-purple-90'],
450
+ background: '#f3ebff',
715
451
  },
716
- 'vira-green-self-light-front-placeholder': {
717
- foreground: '#e2f4bd',
718
- background: viraColorPalette['vira-green-50'],
452
+ 'vira-purple-on-self-header': {
453
+ foreground: viraColorPalette['vira-purple-60'],
454
+ background: '#f3ebff',
719
455
  },
720
- 'vira-green-self-light-front-decoration': {
721
- foreground: '#e2f4bd',
722
- background: viraColorPalette['vira-green-30'],
456
+ 'vira-purple-on-self-placeholder': {
457
+ foreground: viraColorPalette['vira-purple-40'],
458
+ background: '#f3ebff',
723
459
  },
724
- 'vira-green-self-light-back-body': {
725
- foreground: viraColorPalette['vira-green-90'],
726
- background: '#e2f4bd',
460
+ 'vira-purple-on-self-decoration': {
461
+ foreground: viraColorPalette['vira-purple-30'],
462
+ background: '#f3ebff',
727
463
  },
728
- 'vira-green-self-light-back-header': {
729
- foreground: viraColorPalette['vira-green-60'],
730
- background: '#e2f4bd',
464
+ 'vira-purple-on-self-invisible': {
465
+ foreground: viraColorPalette['vira-purple-10'],
466
+ background: '#f3ebff',
731
467
  },
732
- 'vira-green-self-light-back-placeholder': {
733
- foreground: viraColorPalette['vira-green-50'],
734
- background: '#e2f4bd',
468
+ 'vira-pink-foreground-body': {
469
+ foreground: viraColorPalette['vira-pink-80'],
735
470
  },
736
- 'vira-green-self-light-back-decoration': {
737
- foreground: viraColorPalette['vira-green-40'],
738
- background: '#e2f4bd',
471
+ 'vira-pink-foreground-header': {
472
+ foreground: viraColorPalette['vira-pink-50'],
739
473
  },
740
- 'vira-yellow-ahead-background-body': {
741
- foreground: viraColorPalette['vira-yellow-70'],
474
+ 'vira-pink-foreground-placeholder': {
475
+ foreground: viraColorPalette['vira-pink-40'],
742
476
  },
743
- 'vira-yellow-ahead-background-header': {
744
- foreground: viraColorPalette['vira-yellow-50'],
477
+ 'vira-pink-foreground-decoration': {
478
+ foreground: viraColorPalette['vira-pink-20'],
745
479
  },
746
- 'vira-yellow-ahead-background-placeholder': {
747
- foreground: viraColorPalette['vira-yellow-40'],
480
+ 'vira-pink-foreground-invisible': {
481
+ foreground: viraColorPalette['vira-pink-5'],
748
482
  },
749
- 'vira-yellow-ahead-background-decoration': {
750
- foreground: viraColorPalette['vira-yellow-30'],
751
- },
752
- 'vira-yellow-behind-background-body': {
483
+ 'vira-pink-background-body': {
753
484
  foreground: {
754
485
  refDefaultBackground: true,
755
486
  },
756
- background: viraColorPalette['vira-yellow-70'],
487
+ background: viraColorPalette['vira-pink-80'],
757
488
  },
758
- 'vira-yellow-behind-background-header': {
489
+ 'vira-pink-background-header': {
759
490
  foreground: {
760
491
  refDefaultBackground: true,
761
492
  },
762
- background: viraColorPalette['vira-yellow-50'],
493
+ background: viraColorPalette['vira-pink-40'],
763
494
  },
764
- 'vira-yellow-behind-background-placeholder': {
495
+ 'vira-pink-background-placeholder': {
765
496
  foreground: {
766
497
  refDefaultBackground: true,
767
498
  },
768
- background: viraColorPalette['vira-yellow-40'],
499
+ background: viraColorPalette['vira-pink-30'],
769
500
  },
770
- 'vira-yellow-behind-background-decoration': {
501
+ 'vira-pink-background-decoration': {
771
502
  foreground: {
772
503
  refDefaultBackground: true,
773
504
  },
774
- background: viraColorPalette['vira-yellow-20'],
775
- },
776
- 'vira-yellow-ahead-foreground-body': {
777
- foreground: viraColorPalette['vira-yellow-20'],
778
- background: {
779
- refDefaultForeground: true,
780
- },
781
- },
782
- 'vira-yellow-ahead-foreground-header': {
783
- foreground: viraColorPalette['vira-yellow-50'],
784
- background: {
785
- refDefaultForeground: true,
786
- },
787
- },
788
- 'vira-yellow-ahead-foreground-placeholder': {
789
- foreground: viraColorPalette['vira-yellow-60'],
790
- background: {
791
- refDefaultForeground: true,
792
- },
505
+ background: viraColorPalette['vira-pink-20'],
793
506
  },
794
- 'vira-yellow-ahead-foreground-decoration': {
795
- foreground: viraColorPalette['vira-yellow-70'],
796
- background: {
797
- refDefaultForeground: true,
507
+ 'vira-pink-background-invisible': {
508
+ foreground: {
509
+ refDefaultBackground: true,
798
510
  },
511
+ background: viraColorPalette['vira-pink-5'],
799
512
  },
800
- 'vira-yellow-behind-foreground-body': {
801
- background: viraColorPalette['vira-yellow-20'],
802
- },
803
- 'vira-yellow-behind-foreground-header': {
804
- background: viraColorPalette['vira-yellow-50'],
805
- },
806
- 'vira-yellow-behind-foreground-placeholder': {
807
- background: viraColorPalette['vira-yellow-60'],
808
- },
809
- 'vira-yellow-behind-foreground-decoration': {
810
- background: viraColorPalette['vira-yellow-70'],
513
+ 'vira-pink-on-self-body': {
514
+ foreground: viraColorPalette['vira-pink-90'],
515
+ background: '#ffe7fb',
811
516
  },
812
- 'vira-yellow-self-light-front-body': {
813
- foreground: '#f3f199',
814
- background: viraColorPalette['vira-yellow-90'],
815
- },
816
- 'vira-yellow-self-light-front-header': {
817
- foreground: '#f3f199',
818
- background: viraColorPalette['vira-yellow-60'],
819
- },
820
- 'vira-yellow-self-light-front-placeholder': {
821
- foreground: '#f3f199',
822
- background: viraColorPalette['vira-yellow-50'],
823
- },
824
- 'vira-yellow-self-light-front-decoration': {
825
- foreground: '#f3f199',
826
- background: viraColorPalette['vira-yellow-30'],
827
- },
828
- 'vira-yellow-self-light-back-body': {
829
- foreground: viraColorPalette['vira-yellow-90'],
830
- background: '#f3f199',
517
+ 'vira-pink-on-self-header': {
518
+ foreground: viraColorPalette['vira-pink-60'],
519
+ background: '#ffe7fb',
831
520
  },
832
- 'vira-yellow-self-light-back-header': {
833
- foreground: viraColorPalette['vira-yellow-60'],
834
- background: '#f3f199',
521
+ 'vira-pink-on-self-placeholder': {
522
+ foreground: viraColorPalette['vira-pink-50'],
523
+ background: '#ffe7fb',
835
524
  },
836
- 'vira-yellow-self-light-back-placeholder': {
837
- foreground: viraColorPalette['vira-yellow-50'],
838
- background: '#f3f199',
525
+ 'vira-pink-on-self-decoration': {
526
+ foreground: viraColorPalette['vira-pink-30'],
527
+ background: '#ffe7fb',
839
528
  },
840
- 'vira-yellow-self-light-back-decoration': {
841
- foreground: viraColorPalette['vira-yellow-40'],
842
- background: '#f3f199',
529
+ 'vira-pink-on-self-invisible': {
530
+ foreground: viraColorPalette['vira-pink-20'],
531
+ background: '#ffe7fb',
843
532
  },
844
- 'vira-grey-ahead-background-body': {
845
- foreground: viraColorPalette['vira-grey-70'],
533
+ 'vira-grey-foreground-body': {
534
+ foreground: viraColorPalette['vira-grey-80'],
846
535
  },
847
- 'vira-grey-ahead-background-header': {
536
+ 'vira-grey-foreground-header': {
848
537
  foreground: viraColorPalette['vira-grey-50'],
849
538
  },
850
- 'vira-grey-ahead-background-placeholder': {
851
- foreground: viraColorPalette['vira-grey-40'],
539
+ 'vira-grey-foreground-placeholder': {
540
+ foreground: viraColorPalette['vira-grey-30'],
852
541
  },
853
- 'vira-grey-ahead-background-decoration': {
542
+ 'vira-grey-foreground-decoration': {
854
543
  foreground: viraColorPalette['vira-grey-20'],
855
544
  },
856
- 'vira-grey-behind-background-body': {
545
+ 'vira-grey-foreground-invisible': {
546
+ foreground: viraColorPalette['vira-grey-5'],
547
+ },
548
+ 'vira-grey-background-body': {
857
549
  foreground: {
858
550
  refDefaultBackground: true,
859
551
  },
860
- background: viraColorPalette['vira-grey-70'],
552
+ background: viraColorPalette['vira-grey-80'],
861
553
  },
862
- 'vira-grey-behind-background-header': {
554
+ 'vira-grey-background-header': {
863
555
  foreground: {
864
556
  refDefaultBackground: true,
865
557
  },
866
- background: viraColorPalette['vira-grey-50'],
558
+ background: viraColorPalette['vira-grey-40'],
867
559
  },
868
- 'vira-grey-behind-background-placeholder': {
560
+ 'vira-grey-background-placeholder': {
869
561
  foreground: {
870
562
  refDefaultBackground: true,
871
563
  },
872
564
  background: viraColorPalette['vira-grey-30'],
873
565
  },
874
- 'vira-grey-behind-background-decoration': {
566
+ 'vira-grey-background-decoration': {
875
567
  foreground: {
876
568
  refDefaultBackground: true,
877
569
  },
878
570
  background: viraColorPalette['vira-grey-20'],
879
571
  },
880
- 'vira-grey-ahead-foreground-body': {
881
- foreground: viraColorPalette['vira-grey-20'],
882
- background: {
883
- refDefaultForeground: true,
572
+ 'vira-grey-background-invisible': {
573
+ foreground: {
574
+ refDefaultBackground: true,
884
575
  },
576
+ background: viraColorPalette['vira-grey-5'],
885
577
  },
886
- 'vira-grey-ahead-foreground-header': {
887
- foreground: viraColorPalette['vira-grey-50'],
888
- background: {
889
- refDefaultForeground: true,
890
- },
578
+ 'vira-grey-on-self-body': {
579
+ foreground: viraColorPalette['vira-grey-90'],
580
+ background: '#eeeef1',
891
581
  },
892
- 'vira-grey-ahead-foreground-placeholder': {
582
+ 'vira-grey-on-self-header': {
893
583
  foreground: viraColorPalette['vira-grey-60'],
894
- background: {
895
- refDefaultForeground: true,
896
- },
897
- },
898
- 'vira-grey-ahead-foreground-decoration': {
899
- foreground: viraColorPalette['vira-grey-70'],
900
- background: {
901
- refDefaultForeground: true,
902
- },
903
- },
904
- 'vira-grey-behind-foreground-body': {
905
- background: viraColorPalette['vira-grey-20'],
906
- },
907
- 'vira-grey-behind-foreground-header': {
908
- background: viraColorPalette['vira-grey-50'],
909
- },
910
- 'vira-grey-behind-foreground-placeholder': {
911
- background: viraColorPalette['vira-grey-60'],
912
- },
913
- 'vira-grey-behind-foreground-decoration': {
914
- background: viraColorPalette['vira-grey-70'],
584
+ background: '#eeeef1',
915
585
  },
916
- 'vira-grey-self-light-front-body': {
917
- foreground: '#ededed',
918
- background: viraColorPalette['vira-grey-80'],
919
- },
920
- 'vira-grey-self-light-front-header': {
921
- foreground: '#ededed',
922
- background: viraColorPalette['vira-grey-60'],
923
- },
924
- 'vira-grey-self-light-front-placeholder': {
925
- foreground: '#ededed',
926
- background: viraColorPalette['vira-grey-50'],
927
- },
928
- 'vira-grey-self-light-front-decoration': {
929
- foreground: '#ededed',
930
- background: viraColorPalette['vira-grey-30'],
586
+ 'vira-grey-on-self-placeholder': {
587
+ foreground: viraColorPalette['vira-grey-40'],
588
+ background: '#eeeef1',
931
589
  },
932
- 'vira-grey-self-light-back-body': {
933
- foreground: viraColorPalette['vira-grey-80'],
934
- background: '#ededed',
590
+ 'vira-grey-on-self-decoration': {
591
+ foreground: viraColorPalette['vira-grey-30'],
592
+ background: '#eeeef1',
935
593
  },
936
- 'vira-grey-self-light-back-header': {
937
- foreground: viraColorPalette['vira-grey-60'],
938
- background: '#ededed',
594
+ 'vira-grey-on-self-invisible': {
595
+ foreground: viraColorPalette['vira-grey-20'],
596
+ background: '#eeeef1',
939
597
  },
940
- 'vira-grey-self-light-back-placeholder': {
941
- foreground: viraColorPalette['vira-grey-50'],
942
- background: '#ededed',
598
+ });
599
+ /**
600
+ * Dark mode override for {@link viraTheme}.
601
+ *
602
+ * @category Color
603
+ */
604
+ export const viraThemeDarkOverride = defineColorThemeOverride(viraTheme, 'dark', {
605
+ defaultOverride: {
606
+ foreground: 'white',
607
+ background: 'black',
943
608
  },
944
- 'vira-grey-self-light-back-decoration': {
945
- foreground: viraColorPalette['vira-grey-40'],
946
- background: '#ededed',
609
+ colorOverrides: {
610
+ 'vira-red-foreground-body': {
611
+ foreground: viraColorPalette['vira-red-20'],
612
+ background: 'black',
613
+ },
614
+ 'vira-red-foreground-header': {
615
+ background: 'black',
616
+ },
617
+ 'vira-red-foreground-placeholder': {
618
+ foreground: viraColorPalette['vira-red-60'],
619
+ background: 'black',
620
+ },
621
+ 'vira-red-foreground-decoration': {
622
+ foreground: viraColorPalette['vira-red-80'],
623
+ background: 'black',
624
+ },
625
+ 'vira-red-foreground-invisible': {
626
+ foreground: viraColorPalette['vira-red-90'],
627
+ background: 'black',
628
+ },
629
+ 'vira-red-background-body': {
630
+ foreground: 'black',
631
+ background: viraColorPalette['vira-red-20'],
632
+ },
633
+ 'vira-red-background-header': {
634
+ foreground: 'black',
635
+ background: viraColorPalette['vira-red-50'],
636
+ },
637
+ 'vira-red-background-placeholder': {
638
+ foreground: 'black',
639
+ background: viraColorPalette['vira-red-60'],
640
+ },
641
+ 'vira-red-background-decoration': {
642
+ foreground: 'black',
643
+ background: viraColorPalette['vira-red-80'],
644
+ },
645
+ 'vira-red-background-invisible': {
646
+ foreground: 'black',
647
+ background: viraColorPalette['vira-red-90'],
648
+ },
649
+ 'vira-red-on-self-body': {
650
+ foreground: viraColorPalette['vira-red-10'],
651
+ background: '#760004',
652
+ },
653
+ 'vira-red-on-self-header': {
654
+ foreground: viraColorPalette['vira-red-40'],
655
+ background: '#760004',
656
+ },
657
+ 'vira-red-on-self-placeholder': {
658
+ background: '#760004',
659
+ },
660
+ 'vira-red-on-self-decoration': {
661
+ foreground: viraColorPalette['vira-red-70'],
662
+ background: '#760004',
663
+ },
664
+ 'vira-red-on-self-invisible': {
665
+ foreground: viraColorPalette['vira-red-80'],
666
+ background: '#760004',
667
+ },
668
+ 'vira-orange-foreground-body': {
669
+ foreground: viraColorPalette['vira-orange-20'],
670
+ background: 'black',
671
+ },
672
+ 'vira-orange-foreground-header': {
673
+ background: 'black',
674
+ },
675
+ 'vira-orange-foreground-placeholder': {
676
+ foreground: viraColorPalette['vira-orange-60'],
677
+ background: 'black',
678
+ },
679
+ 'vira-orange-foreground-decoration': {
680
+ foreground: viraColorPalette['vira-orange-80'],
681
+ background: 'black',
682
+ },
683
+ 'vira-orange-foreground-invisible': {
684
+ foreground: viraColorPalette['vira-orange-90'],
685
+ background: 'black',
686
+ },
687
+ 'vira-orange-background-body': {
688
+ foreground: 'black',
689
+ background: viraColorPalette['vira-orange-20'],
690
+ },
691
+ 'vira-orange-background-header': {
692
+ foreground: 'black',
693
+ background: viraColorPalette['vira-orange-50'],
694
+ },
695
+ 'vira-orange-background-placeholder': {
696
+ foreground: 'black',
697
+ background: viraColorPalette['vira-orange-60'],
698
+ },
699
+ 'vira-orange-background-decoration': {
700
+ foreground: 'black',
701
+ background: viraColorPalette['vira-orange-80'],
702
+ },
703
+ 'vira-orange-background-invisible': {
704
+ foreground: 'black',
705
+ background: viraColorPalette['vira-orange-90'],
706
+ },
707
+ 'vira-orange-on-self-body': {
708
+ foreground: viraColorPalette['vira-orange-10'],
709
+ background: '#682800',
710
+ },
711
+ 'vira-orange-on-self-header': {
712
+ foreground: viraColorPalette['vira-orange-40'],
713
+ background: '#682800',
714
+ },
715
+ 'vira-orange-on-self-placeholder': {
716
+ background: '#682800',
717
+ },
718
+ 'vira-orange-on-self-decoration': {
719
+ foreground: viraColorPalette['vira-orange-70'],
720
+ background: '#682800',
721
+ },
722
+ 'vira-orange-on-self-invisible': {
723
+ foreground: viraColorPalette['vira-orange-80'],
724
+ background: '#682800',
725
+ },
726
+ 'vira-yellow-foreground-body': {
727
+ foreground: viraColorPalette['vira-yellow-20'],
728
+ background: 'black',
729
+ },
730
+ 'vira-yellow-foreground-header': {
731
+ background: 'black',
732
+ },
733
+ 'vira-yellow-foreground-placeholder': {
734
+ foreground: viraColorPalette['vira-yellow-60'],
735
+ background: 'black',
736
+ },
737
+ 'vira-yellow-foreground-decoration': {
738
+ foreground: viraColorPalette['vira-yellow-80'],
739
+ background: 'black',
740
+ },
741
+ 'vira-yellow-foreground-invisible': {
742
+ foreground: viraColorPalette['vira-yellow-90'],
743
+ background: 'black',
744
+ },
745
+ 'vira-yellow-background-body': {
746
+ foreground: 'black',
747
+ background: viraColorPalette['vira-yellow-20'],
748
+ },
749
+ 'vira-yellow-background-header': {
750
+ foreground: 'black',
751
+ background: viraColorPalette['vira-yellow-50'],
752
+ },
753
+ 'vira-yellow-background-placeholder': {
754
+ foreground: 'black',
755
+ background: viraColorPalette['vira-yellow-60'],
756
+ },
757
+ 'vira-yellow-background-decoration': {
758
+ foreground: 'black',
759
+ background: viraColorPalette['vira-yellow-80'],
760
+ },
761
+ 'vira-yellow-background-invisible': {
762
+ foreground: 'black',
763
+ background: viraColorPalette['vira-yellow-90'],
764
+ },
765
+ 'vira-yellow-on-self-body': {
766
+ foreground: viraColorPalette['vira-yellow-10'],
767
+ background: '#473d00',
768
+ },
769
+ 'vira-yellow-on-self-header': {
770
+ foreground: viraColorPalette['vira-yellow-40'],
771
+ background: '#473d00',
772
+ },
773
+ 'vira-yellow-on-self-placeholder': {
774
+ foreground: viraColorPalette['vira-yellow-50'],
775
+ background: '#473d00',
776
+ },
777
+ 'vira-yellow-on-self-decoration': {
778
+ foreground: viraColorPalette['vira-yellow-70'],
779
+ background: '#473d00',
780
+ },
781
+ 'vira-yellow-on-self-invisible': {
782
+ foreground: viraColorPalette['vira-yellow-80'],
783
+ background: '#473d00',
784
+ },
785
+ 'vira-green-foreground-body': {
786
+ foreground: viraColorPalette['vira-green-20'],
787
+ background: 'black',
788
+ },
789
+ 'vira-green-foreground-header': {
790
+ background: 'black',
791
+ },
792
+ 'vira-green-foreground-placeholder': {
793
+ foreground: viraColorPalette['vira-green-60'],
794
+ background: 'black',
795
+ },
796
+ 'vira-green-foreground-decoration': {
797
+ foreground: viraColorPalette['vira-green-80'],
798
+ background: 'black',
799
+ },
800
+ 'vira-green-foreground-invisible': {
801
+ foreground: viraColorPalette['vira-green-90'],
802
+ background: 'black',
803
+ },
804
+ 'vira-green-background-body': {
805
+ foreground: 'black',
806
+ background: viraColorPalette['vira-green-20'],
807
+ },
808
+ 'vira-green-background-header': {
809
+ foreground: 'black',
810
+ background: viraColorPalette['vira-green-50'],
811
+ },
812
+ 'vira-green-background-placeholder': {
813
+ foreground: 'black',
814
+ background: viraColorPalette['vira-green-60'],
815
+ },
816
+ 'vira-green-background-decoration': {
817
+ foreground: 'black',
818
+ background: viraColorPalette['vira-green-80'],
819
+ },
820
+ 'vira-green-background-invisible': {
821
+ foreground: 'black',
822
+ background: viraColorPalette['vira-green-90'],
823
+ },
824
+ 'vira-green-on-self-body': {
825
+ foreground: viraColorPalette['vira-green-10'],
826
+ background: '#1f4600',
827
+ },
828
+ 'vira-green-on-self-header': {
829
+ foreground: viraColorPalette['vira-green-40'],
830
+ background: '#1f4600',
831
+ },
832
+ 'vira-green-on-self-placeholder': {
833
+ foreground: viraColorPalette['vira-green-50'],
834
+ background: '#1f4600',
835
+ },
836
+ 'vira-green-on-self-decoration': {
837
+ foreground: viraColorPalette['vira-green-70'],
838
+ background: '#1f4600',
839
+ },
840
+ 'vira-green-on-self-invisible': {
841
+ foreground: viraColorPalette['vira-green-80'],
842
+ background: '#1f4600',
843
+ },
844
+ 'vira-teal-foreground-body': {
845
+ foreground: viraColorPalette['vira-teal-20'],
846
+ background: 'black',
847
+ },
848
+ 'vira-teal-foreground-header': {
849
+ background: 'black',
850
+ },
851
+ 'vira-teal-foreground-placeholder': {
852
+ foreground: viraColorPalette['vira-teal-60'],
853
+ background: 'black',
854
+ },
855
+ 'vira-teal-foreground-decoration': {
856
+ foreground: viraColorPalette['vira-teal-80'],
857
+ background: 'black',
858
+ },
859
+ 'vira-teal-foreground-invisible': {
860
+ foreground: viraColorPalette['vira-teal-90'],
861
+ background: 'black',
862
+ },
863
+ 'vira-teal-background-body': {
864
+ foreground: 'black',
865
+ background: viraColorPalette['vira-teal-20'],
866
+ },
867
+ 'vira-teal-background-header': {
868
+ foreground: 'black',
869
+ background: viraColorPalette['vira-teal-50'],
870
+ },
871
+ 'vira-teal-background-placeholder': {
872
+ foreground: 'black',
873
+ background: viraColorPalette['vira-teal-60'],
874
+ },
875
+ 'vira-teal-background-decoration': {
876
+ foreground: 'black',
877
+ background: viraColorPalette['vira-teal-80'],
878
+ },
879
+ 'vira-teal-background-invisible': {
880
+ foreground: 'black',
881
+ background: viraColorPalette['vira-teal-90'],
882
+ },
883
+ 'vira-teal-on-self-body': {
884
+ foreground: viraColorPalette['vira-teal-10'],
885
+ background: '#004539',
886
+ },
887
+ 'vira-teal-on-self-header': {
888
+ foreground: viraColorPalette['vira-teal-40'],
889
+ background: '#004539',
890
+ },
891
+ 'vira-teal-on-self-placeholder': {
892
+ background: '#004539',
893
+ },
894
+ 'vira-teal-on-self-decoration': {
895
+ foreground: viraColorPalette['vira-teal-70'],
896
+ background: '#004539',
897
+ },
898
+ 'vira-teal-on-self-invisible': {
899
+ foreground: viraColorPalette['vira-teal-80'],
900
+ background: '#004539',
901
+ },
902
+ 'vira-blue-foreground-body': {
903
+ foreground: viraColorPalette['vira-blue-20'],
904
+ background: 'black',
905
+ },
906
+ 'vira-blue-foreground-header': {
907
+ background: 'black',
908
+ },
909
+ 'vira-blue-foreground-placeholder': {
910
+ foreground: viraColorPalette['vira-blue-60'],
911
+ background: 'black',
912
+ },
913
+ 'vira-blue-foreground-decoration': {
914
+ foreground: viraColorPalette['vira-blue-80'],
915
+ background: 'black',
916
+ },
917
+ 'vira-blue-foreground-invisible': {
918
+ foreground: viraColorPalette['vira-blue-90'],
919
+ background: 'black',
920
+ },
921
+ 'vira-blue-background-body': {
922
+ foreground: 'black',
923
+ background: viraColorPalette['vira-blue-20'],
924
+ },
925
+ 'vira-blue-background-header': {
926
+ foreground: 'black',
927
+ background: viraColorPalette['vira-blue-50'],
928
+ },
929
+ 'vira-blue-background-placeholder': {
930
+ foreground: 'black',
931
+ background: viraColorPalette['vira-blue-60'],
932
+ },
933
+ 'vira-blue-background-decoration': {
934
+ foreground: 'black',
935
+ background: viraColorPalette['vira-blue-80'],
936
+ },
937
+ 'vira-blue-background-invisible': {
938
+ foreground: 'black',
939
+ background: viraColorPalette['vira-blue-90'],
940
+ },
941
+ 'vira-blue-on-self-body': {
942
+ foreground: viraColorPalette['vira-blue-10'],
943
+ background: '#003a7b',
944
+ },
945
+ 'vira-blue-on-self-header': {
946
+ foreground: viraColorPalette['vira-blue-40'],
947
+ background: '#003a7b',
948
+ },
949
+ 'vira-blue-on-self-placeholder': {
950
+ background: '#003a7b',
951
+ },
952
+ 'vira-blue-on-self-decoration': {
953
+ foreground: viraColorPalette['vira-blue-70'],
954
+ background: '#003a7b',
955
+ },
956
+ 'vira-blue-on-self-invisible': {
957
+ foreground: viraColorPalette['vira-blue-80'],
958
+ background: '#003a7b',
959
+ },
960
+ 'vira-purple-foreground-body': {
961
+ foreground: viraColorPalette['vira-purple-20'],
962
+ background: 'black',
963
+ },
964
+ 'vira-purple-foreground-header': {
965
+ background: 'black',
966
+ },
967
+ 'vira-purple-foreground-placeholder': {
968
+ foreground: viraColorPalette['vira-purple-60'],
969
+ background: 'black',
970
+ },
971
+ 'vira-purple-foreground-decoration': {
972
+ foreground: viraColorPalette['vira-purple-80'],
973
+ background: 'black',
974
+ },
975
+ 'vira-purple-foreground-invisible': {
976
+ foreground: viraColorPalette['vira-purple-90'],
977
+ background: 'black',
978
+ },
979
+ 'vira-purple-background-body': {
980
+ foreground: 'black',
981
+ background: viraColorPalette['vira-purple-20'],
982
+ },
983
+ 'vira-purple-background-header': {
984
+ foreground: 'black',
985
+ background: viraColorPalette['vira-purple-50'],
986
+ },
987
+ 'vira-purple-background-placeholder': {
988
+ foreground: 'black',
989
+ background: viraColorPalette['vira-purple-60'],
990
+ },
991
+ 'vira-purple-background-decoration': {
992
+ foreground: 'black',
993
+ background: viraColorPalette['vira-purple-80'],
994
+ },
995
+ 'vira-purple-background-invisible': {
996
+ foreground: 'black',
997
+ background: viraColorPalette['vira-purple-90'],
998
+ },
999
+ 'vira-purple-on-self-body': {
1000
+ foreground: viraColorPalette['vira-purple-10'],
1001
+ background: '#4c0099',
1002
+ },
1003
+ 'vira-purple-on-self-header': {
1004
+ foreground: viraColorPalette['vira-purple-40'],
1005
+ background: '#4c0099',
1006
+ },
1007
+ 'vira-purple-on-self-placeholder': {
1008
+ foreground: viraColorPalette['vira-purple-50'],
1009
+ background: '#4c0099',
1010
+ },
1011
+ 'vira-purple-on-self-decoration': {
1012
+ foreground: viraColorPalette['vira-purple-70'],
1013
+ background: '#4c0099',
1014
+ },
1015
+ 'vira-purple-on-self-invisible': {
1016
+ foreground: viraColorPalette['vira-purple-80'],
1017
+ background: '#4c0099',
1018
+ },
1019
+ 'vira-pink-foreground-body': {
1020
+ foreground: viraColorPalette['vira-pink-20'],
1021
+ background: 'black',
1022
+ },
1023
+ 'vira-pink-foreground-header': {
1024
+ background: 'black',
1025
+ },
1026
+ 'vira-pink-foreground-placeholder': {
1027
+ foreground: viraColorPalette['vira-pink-60'],
1028
+ background: 'black',
1029
+ },
1030
+ 'vira-pink-foreground-decoration': {
1031
+ foreground: viraColorPalette['vira-pink-80'],
1032
+ background: 'black',
1033
+ },
1034
+ 'vira-pink-foreground-invisible': {
1035
+ foreground: viraColorPalette['vira-pink-90'],
1036
+ background: 'black',
1037
+ },
1038
+ 'vira-pink-background-body': {
1039
+ foreground: 'black',
1040
+ background: viraColorPalette['vira-pink-20'],
1041
+ },
1042
+ 'vira-pink-background-header': {
1043
+ foreground: 'black',
1044
+ background: viraColorPalette['vira-pink-50'],
1045
+ },
1046
+ 'vira-pink-background-placeholder': {
1047
+ foreground: 'black',
1048
+ background: viraColorPalette['vira-pink-60'],
1049
+ },
1050
+ 'vira-pink-background-decoration': {
1051
+ foreground: 'black',
1052
+ background: viraColorPalette['vira-pink-80'],
1053
+ },
1054
+ 'vira-pink-background-invisible': {
1055
+ foreground: 'black',
1056
+ background: viraColorPalette['vira-pink-90'],
1057
+ },
1058
+ 'vira-pink-on-self-body': {
1059
+ foreground: viraColorPalette['vira-pink-10'],
1060
+ background: '#6f0050',
1061
+ },
1062
+ 'vira-pink-on-self-header': {
1063
+ foreground: viraColorPalette['vira-pink-40'],
1064
+ background: '#6f0050',
1065
+ },
1066
+ 'vira-pink-on-self-placeholder': {
1067
+ background: '#6f0050',
1068
+ },
1069
+ 'vira-pink-on-self-decoration': {
1070
+ foreground: viraColorPalette['vira-pink-70'],
1071
+ background: '#6f0050',
1072
+ },
1073
+ 'vira-pink-on-self-invisible': {
1074
+ foreground: viraColorPalette['vira-pink-80'],
1075
+ background: '#6f0050',
1076
+ },
1077
+ 'vira-grey-foreground-body': {
1078
+ foreground: viraColorPalette['vira-grey-20'],
1079
+ background: 'black',
1080
+ },
1081
+ 'vira-grey-foreground-header': {
1082
+ background: 'black',
1083
+ },
1084
+ 'vira-grey-foreground-placeholder': {
1085
+ foreground: viraColorPalette['vira-grey-60'],
1086
+ background: 'black',
1087
+ },
1088
+ 'vira-grey-foreground-decoration': {
1089
+ foreground: viraColorPalette['vira-grey-80'],
1090
+ background: 'black',
1091
+ },
1092
+ 'vira-grey-foreground-invisible': {
1093
+ foreground: viraColorPalette['vira-grey-90'],
1094
+ background: 'black',
1095
+ },
1096
+ 'vira-grey-background-body': {
1097
+ foreground: 'black',
1098
+ background: viraColorPalette['vira-grey-20'],
1099
+ },
1100
+ 'vira-grey-background-header': {
1101
+ foreground: 'black',
1102
+ background: viraColorPalette['vira-grey-50'],
1103
+ },
1104
+ 'vira-grey-background-placeholder': {
1105
+ foreground: 'black',
1106
+ background: viraColorPalette['vira-grey-60'],
1107
+ },
1108
+ 'vira-grey-background-decoration': {
1109
+ foreground: 'black',
1110
+ background: viraColorPalette['vira-grey-80'],
1111
+ },
1112
+ 'vira-grey-background-invisible': {
1113
+ foreground: 'black',
1114
+ background: viraColorPalette['vira-grey-90'],
1115
+ },
1116
+ 'vira-grey-on-self-body': {
1117
+ foreground: viraColorPalette['vira-grey-10'],
1118
+ background: '#3d3d43',
1119
+ },
1120
+ 'vira-grey-on-self-header': {
1121
+ foreground: viraColorPalette['vira-grey-40'],
1122
+ background: '#3d3d43',
1123
+ },
1124
+ 'vira-grey-on-self-placeholder': {
1125
+ foreground: viraColorPalette['vira-grey-50'],
1126
+ background: '#3d3d43',
1127
+ },
1128
+ 'vira-grey-on-self-decoration': {
1129
+ foreground: viraColorPalette['vira-grey-70'],
1130
+ background: '#3d3d43',
1131
+ },
1132
+ 'vira-grey-on-self-invisible': {
1133
+ foreground: viraColorPalette['vira-grey-80'],
1134
+ background: '#3d3d43',
1135
+ },
947
1136
  },
948
1137
  });