vrembem 3.0.10 → 4.0.0-alpha.1
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/dev/scripts.esm.js +713 -803
- package/dev/scripts.esm.js.map +1 -1
- package/dev/scripts.js +713 -803
- package/dev/scripts.js.map +1 -1
- package/dev/scripts.modern.mjs +576 -530
- package/dev/scripts.modern.mjs.map +1 -1
- package/dev/scripts.umd.js +713 -803
- package/dev/scripts.umd.js.map +1 -1
- package/dev/styles.css +837 -1368
- package/dev/styles.css.map +1 -1
- package/dist/scripts.esm.js +1 -1
- package/dist/scripts.esm.js.map +1 -1
- package/dist/scripts.js +1 -1
- package/dist/scripts.js.map +1 -1
- package/dist/scripts.modern.mjs +1 -1
- package/dist/scripts.modern.mjs.map +1 -1
- package/dist/scripts.umd.js +1 -1
- package/dist/scripts.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/index.scss +1 -4
- package/package.json +24 -26
package/dev/styles.css
CHANGED
|
@@ -1,3 +1,91 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--vrembem-variable-prefix: vb-;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
:root {
|
|
6
|
+
--vb-breakpoint-xs: 480px;
|
|
7
|
+
--vb-breakpoint-sm: 620px;
|
|
8
|
+
--vb-breakpoint-md: 760px;
|
|
9
|
+
--vb-breakpoint-lg: 990px;
|
|
10
|
+
--vb-breakpoint-xl: 1380px;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
:root {
|
|
14
|
+
--vb-primary-hs: 152deg, 60%;
|
|
15
|
+
--vb-primary: var(--vb-primary-50);
|
|
16
|
+
--vb-primary-0: hsl(var(--vb-primary-hs), 0%);
|
|
17
|
+
--vb-primary-10: hsl(var(--vb-primary-hs), 10%);
|
|
18
|
+
--vb-primary-20: hsl(var(--vb-primary-hs), 20%);
|
|
19
|
+
--vb-primary-30: hsl(var(--vb-primary-hs), 30%);
|
|
20
|
+
--vb-primary-40: hsl(var(--vb-primary-hs), 40%);
|
|
21
|
+
--vb-primary-50: hsl(var(--vb-primary-hs), 50%);
|
|
22
|
+
--vb-primary-60: hsl(var(--vb-primary-hs), 60%);
|
|
23
|
+
--vb-primary-70: hsl(var(--vb-primary-hs), 70%);
|
|
24
|
+
--vb-primary-80: hsl(var(--vb-primary-hs), 80%);
|
|
25
|
+
--vb-primary-90: hsl(var(--vb-primary-hs), 90%);
|
|
26
|
+
--vb-primary-95: hsl(var(--vb-primary-hs), 95%);
|
|
27
|
+
--vb-primary-98: hsl(var(--vb-primary-hs), 98%);
|
|
28
|
+
--vb-primary-100: hsl(var(--vb-primary-hs), 100%);
|
|
29
|
+
--vb-secondary-hs: 214deg, 50%;
|
|
30
|
+
--vb-secondary: var(--vb-secondary-50);
|
|
31
|
+
--vb-secondary-0: hsl(var(--vb-secondary-hs), 0%);
|
|
32
|
+
--vb-secondary-10: hsl(var(--vb-secondary-hs), 10%);
|
|
33
|
+
--vb-secondary-20: hsl(var(--vb-secondary-hs), 20%);
|
|
34
|
+
--vb-secondary-30: hsl(var(--vb-secondary-hs), 30%);
|
|
35
|
+
--vb-secondary-40: hsl(var(--vb-secondary-hs), 40%);
|
|
36
|
+
--vb-secondary-50: hsl(var(--vb-secondary-hs), 50%);
|
|
37
|
+
--vb-secondary-60: hsl(var(--vb-secondary-hs), 60%);
|
|
38
|
+
--vb-secondary-70: hsl(var(--vb-secondary-hs), 70%);
|
|
39
|
+
--vb-secondary-80: hsl(var(--vb-secondary-hs), 80%);
|
|
40
|
+
--vb-secondary-90: hsl(var(--vb-secondary-hs), 90%);
|
|
41
|
+
--vb-secondary-95: hsl(var(--vb-secondary-hs), 95%);
|
|
42
|
+
--vb-secondary-98: hsl(var(--vb-secondary-hs), 98%);
|
|
43
|
+
--vb-secondary-100: hsl(var(--vb-secondary-hs), 100%);
|
|
44
|
+
--vb-neutral-hs: 214deg, 20%;
|
|
45
|
+
--vb-neutral: var(--vb-neutral-50);
|
|
46
|
+
--vb-neutral-0: hsl(var(--vb-neutral-hs), 0%);
|
|
47
|
+
--vb-neutral-10: hsl(var(--vb-neutral-hs), 10%);
|
|
48
|
+
--vb-neutral-20: hsl(var(--vb-neutral-hs), 20%);
|
|
49
|
+
--vb-neutral-30: hsl(var(--vb-neutral-hs), 30%);
|
|
50
|
+
--vb-neutral-40: hsl(var(--vb-neutral-hs), 40%);
|
|
51
|
+
--vb-neutral-50: hsl(var(--vb-neutral-hs), 50%);
|
|
52
|
+
--vb-neutral-60: hsl(var(--vb-neutral-hs), 60%);
|
|
53
|
+
--vb-neutral-70: hsl(var(--vb-neutral-hs), 70%);
|
|
54
|
+
--vb-neutral-80: hsl(var(--vb-neutral-hs), 80%);
|
|
55
|
+
--vb-neutral-90: hsl(var(--vb-neutral-hs), 90%);
|
|
56
|
+
--vb-neutral-95: hsl(var(--vb-neutral-hs), 95%);
|
|
57
|
+
--vb-neutral-98: hsl(var(--vb-neutral-hs), 98%);
|
|
58
|
+
--vb-neutral-100: hsl(var(--vb-neutral-hs), 100%);
|
|
59
|
+
--vb-important-hs: 0deg, 80%;
|
|
60
|
+
--vb-important: var(--vb-important-50);
|
|
61
|
+
--vb-important-0: hsl(var(--vb-important-hs), 0%);
|
|
62
|
+
--vb-important-10: hsl(var(--vb-important-hs), 10%);
|
|
63
|
+
--vb-important-20: hsl(var(--vb-important-hs), 20%);
|
|
64
|
+
--vb-important-30: hsl(var(--vb-important-hs), 30%);
|
|
65
|
+
--vb-important-40: hsl(var(--vb-important-hs), 40%);
|
|
66
|
+
--vb-important-50: hsl(var(--vb-important-hs), 50%);
|
|
67
|
+
--vb-important-60: hsl(var(--vb-important-hs), 60%);
|
|
68
|
+
--vb-important-70: hsl(var(--vb-important-hs), 70%);
|
|
69
|
+
--vb-important-80: hsl(var(--vb-important-hs), 80%);
|
|
70
|
+
--vb-important-90: hsl(var(--vb-important-hs), 90%);
|
|
71
|
+
--vb-important-95: hsl(var(--vb-important-hs), 95%);
|
|
72
|
+
--vb-important-98: hsl(var(--vb-important-hs), 98%);
|
|
73
|
+
--vb-important-100: hsl(var(--vb-important-hs), 100%);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
:root {
|
|
77
|
+
--vb-background: var(--vb-neutral-100, hsl(214, 20%, 100%));
|
|
78
|
+
--vb-background-dark: var(--vb-neutral-98, hsl(214, 20%, 98%));
|
|
79
|
+
--vb-background-darker: var(--vb-neutral-95, hsl(214, 20%, 95%));
|
|
80
|
+
--vb-foreground: var(--vb-neutral-20, hsl(214, 20%, 20%));
|
|
81
|
+
--vb-foreground-light: var(--vb-neutral-40, hsl(214, 20%, 40%));
|
|
82
|
+
--vb-foreground-lighter: var(--vb-neutral-60, hsl(214, 20%, 60%));
|
|
83
|
+
--vb-border-color: rgba(0, 0, 0, 0.1);
|
|
84
|
+
--vb-border-color-dark: rgba(0, 0, 0, 0.2);
|
|
85
|
+
--vb-border-color-darker: rgba(0, 0, 0, 0.3);
|
|
86
|
+
--vb-shadow-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%);
|
|
87
|
+
}
|
|
88
|
+
|
|
1
89
|
*,
|
|
2
90
|
*::before,
|
|
3
91
|
*::after {
|
|
@@ -20,7 +108,8 @@ html {
|
|
|
20
108
|
}
|
|
21
109
|
|
|
22
110
|
body {
|
|
23
|
-
|
|
111
|
+
background: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
112
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
24
113
|
font-family: blinkmacsystemfont, -apple-system, system-ui, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif;
|
|
25
114
|
}
|
|
26
115
|
|
|
@@ -71,7 +160,7 @@ table {
|
|
|
71
160
|
|
|
72
161
|
caption {
|
|
73
162
|
caption-side: bottom;
|
|
74
|
-
color:
|
|
163
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
75
164
|
text-align: left;
|
|
76
165
|
}
|
|
77
166
|
|
|
@@ -157,7 +246,7 @@ input::-moz-placeholder {
|
|
|
157
246
|
.blockquote {
|
|
158
247
|
position: relative;
|
|
159
248
|
padding: 1.5em;
|
|
160
|
-
border: 1px solid rgba(0, 0, 0, 0.
|
|
249
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
161
250
|
color: inherit;
|
|
162
251
|
}
|
|
163
252
|
.blockquote > * + * {
|
|
@@ -170,11 +259,11 @@ input::-moz-placeholder {
|
|
|
170
259
|
bottom: -1px;
|
|
171
260
|
left: -1px;
|
|
172
261
|
width: 4px;
|
|
173
|
-
background-color:
|
|
262
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
174
263
|
}
|
|
175
264
|
|
|
176
265
|
.code {
|
|
177
|
-
color:
|
|
266
|
+
color: var(--vb-secondary-50, hsl(214, 50%, 50%));
|
|
178
267
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
179
268
|
font-size: 0.9em;
|
|
180
269
|
word-break: break-word;
|
|
@@ -240,73 +329,18 @@ input::-moz-placeholder {
|
|
|
240
329
|
}
|
|
241
330
|
|
|
242
331
|
.link {
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
text-decoration: none;
|
|
332
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
333
|
+
text-decoration: underline;
|
|
246
334
|
}
|
|
247
335
|
.link:hover {
|
|
248
|
-
|
|
249
|
-
|
|
336
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
337
|
+
text-decoration: none;
|
|
250
338
|
}
|
|
251
339
|
.link:focus {
|
|
252
340
|
outline: currentcolor dotted 1px;
|
|
253
341
|
outline-offset: 0.125rem;
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
}
|
|
257
|
-
|
|
258
|
-
.link_subtle {
|
|
259
|
-
border-color: rgba(0, 0, 0, 0.1);
|
|
260
|
-
color: #9e9e9e;
|
|
261
|
-
}
|
|
262
|
-
.link_subtle:hover, .link_subtle:focus {
|
|
263
|
-
border-color: currentcolor;
|
|
264
|
-
color: #0097a7;
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
.link_invert {
|
|
268
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
269
|
-
color: #fff;
|
|
270
|
-
}
|
|
271
|
-
.link_invert:hover, .link_invert:focus {
|
|
272
|
-
border-color: currentcolor;
|
|
273
|
-
color: #fff;
|
|
274
|
-
}
|
|
275
|
-
|
|
276
|
-
.link_invert-subtle {
|
|
277
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
278
|
-
color: rgba(255, 255, 255, 0.6);
|
|
279
|
-
}
|
|
280
|
-
.link_invert-subtle:hover, .link_invert-subtle:focus {
|
|
281
|
-
border-color: currentcolor;
|
|
282
|
-
color: #fff;
|
|
283
|
-
}
|
|
284
|
-
|
|
285
|
-
.type .link_subtle {
|
|
286
|
-
border-color: rgba(0, 0, 0, 0.1);
|
|
287
|
-
color: #9e9e9e;
|
|
288
|
-
}
|
|
289
|
-
.type .link_subtle:hover, .type .link_subtle:focus {
|
|
290
|
-
border-color: currentcolor;
|
|
291
|
-
color: #0097a7;
|
|
292
|
-
}
|
|
293
|
-
|
|
294
|
-
.type .link_invert {
|
|
295
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
296
|
-
color: #fff;
|
|
297
|
-
}
|
|
298
|
-
.type .link_invert:hover, .type .link_invert:focus {
|
|
299
|
-
border-color: currentcolor;
|
|
300
|
-
color: #fff;
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
.type .link_invert-subtle {
|
|
304
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
305
|
-
color: rgba(255, 255, 255, 0.6);
|
|
306
|
-
}
|
|
307
|
-
.type .link_invert-subtle:hover, .type .link_invert-subtle:focus {
|
|
308
|
-
border-color: currentcolor;
|
|
309
|
-
color: #fff;
|
|
342
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
343
|
+
text-decoration: none;
|
|
310
344
|
}
|
|
311
345
|
|
|
312
346
|
.list {
|
|
@@ -321,12 +355,16 @@ input::-moz-placeholder {
|
|
|
321
355
|
margin-top: 0.5em;
|
|
322
356
|
}
|
|
323
357
|
|
|
358
|
+
.list-style-none {
|
|
359
|
+
list-style: none !important;
|
|
360
|
+
}
|
|
361
|
+
|
|
324
362
|
.pre {
|
|
325
363
|
padding: 1em;
|
|
326
364
|
overflow: auto;
|
|
327
365
|
border-radius: 0.25rem;
|
|
328
|
-
background:
|
|
329
|
-
color:
|
|
366
|
+
background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
367
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
330
368
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
331
369
|
}
|
|
332
370
|
.pre code {
|
|
@@ -348,14 +386,7 @@ input::-moz-placeholder {
|
|
|
348
386
|
display: block;
|
|
349
387
|
height: 0;
|
|
350
388
|
border: none;
|
|
351
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
.sep-invert {
|
|
355
|
-
display: block;
|
|
356
|
-
height: 0;
|
|
357
|
-
border: none;
|
|
358
|
-
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
|
389
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
359
390
|
}
|
|
360
391
|
|
|
361
392
|
.type h1,
|
|
@@ -391,25 +422,24 @@ input::-moz-placeholder {
|
|
|
391
422
|
}
|
|
392
423
|
.type > a,
|
|
393
424
|
.type > :not(div) a {
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
text-decoration: none;
|
|
425
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
426
|
+
text-decoration: underline;
|
|
397
427
|
}
|
|
398
428
|
.type > a:hover,
|
|
399
429
|
.type > :not(div) a:hover {
|
|
400
|
-
|
|
401
|
-
|
|
430
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
431
|
+
text-decoration: none;
|
|
402
432
|
}
|
|
403
433
|
.type > a:focus,
|
|
404
434
|
.type > :not(div) a:focus {
|
|
405
435
|
outline: currentcolor dotted 1px;
|
|
406
436
|
outline-offset: 0.125rem;
|
|
407
|
-
|
|
408
|
-
|
|
437
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
438
|
+
text-decoration: none;
|
|
409
439
|
}
|
|
410
440
|
.type > code,
|
|
411
441
|
.type > :not(div) code {
|
|
412
|
-
color:
|
|
442
|
+
color: var(--vb-secondary-50, hsl(214, 50%, 50%));
|
|
413
443
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
414
444
|
font-size: 0.9em;
|
|
415
445
|
word-break: break-word;
|
|
@@ -418,7 +448,7 @@ input::-moz-placeholder {
|
|
|
418
448
|
display: block;
|
|
419
449
|
height: 0;
|
|
420
450
|
border: none;
|
|
421
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
451
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
422
452
|
}
|
|
423
453
|
.type > ul,
|
|
424
454
|
.type > ol {
|
|
@@ -439,7 +469,7 @@ input::-moz-placeholder {
|
|
|
439
469
|
.type > blockquote {
|
|
440
470
|
position: relative;
|
|
441
471
|
padding: 1.5em;
|
|
442
|
-
border: 1px solid rgba(0, 0, 0, 0.
|
|
472
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
443
473
|
color: inherit;
|
|
444
474
|
}
|
|
445
475
|
.type > blockquote > * + * {
|
|
@@ -452,14 +482,14 @@ input::-moz-placeholder {
|
|
|
452
482
|
bottom: -1px;
|
|
453
483
|
left: -1px;
|
|
454
484
|
width: 4px;
|
|
455
|
-
background-color:
|
|
485
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
456
486
|
}
|
|
457
487
|
.type > pre {
|
|
458
488
|
padding: 1em;
|
|
459
489
|
overflow: auto;
|
|
460
490
|
border-radius: 0.25rem;
|
|
461
|
-
background:
|
|
462
|
-
color:
|
|
491
|
+
background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
492
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
463
493
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
464
494
|
}
|
|
465
495
|
.type > pre code {
|
|
@@ -470,89 +500,6 @@ input::-moz-placeholder {
|
|
|
470
500
|
font-size: 1em;
|
|
471
501
|
}
|
|
472
502
|
|
|
473
|
-
.type_invert {
|
|
474
|
-
color: #fff;
|
|
475
|
-
}
|
|
476
|
-
.type_invert > hr {
|
|
477
|
-
display: block;
|
|
478
|
-
height: 0;
|
|
479
|
-
border: none;
|
|
480
|
-
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
|
481
|
-
}
|
|
482
|
-
.type_invert > blockquote {
|
|
483
|
-
border-color: rgba(255, 255, 255, 0.1);
|
|
484
|
-
}
|
|
485
|
-
.type_invert > a,
|
|
486
|
-
.type_invert > :not(div) a {
|
|
487
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
488
|
-
color: #fff;
|
|
489
|
-
}
|
|
490
|
-
.type_invert > a:hover, .type_invert > a:focus,
|
|
491
|
-
.type_invert > :not(div) a:hover,
|
|
492
|
-
.type_invert > :not(div) a:focus {
|
|
493
|
-
border-color: currentcolor;
|
|
494
|
-
color: #fff;
|
|
495
|
-
}
|
|
496
|
-
.type_invert > code,
|
|
497
|
-
.type_invert > :not(div) code {
|
|
498
|
-
color: #f06292;
|
|
499
|
-
}
|
|
500
|
-
.type_invert > pre {
|
|
501
|
-
color: #212121;
|
|
502
|
-
}
|
|
503
|
-
.type_invert > pre code {
|
|
504
|
-
color: inherit;
|
|
505
|
-
}
|
|
506
|
-
|
|
507
|
-
.breadcrumb {
|
|
508
|
-
display: inline-flex;
|
|
509
|
-
flex-wrap: wrap;
|
|
510
|
-
align-items: center;
|
|
511
|
-
color: #9e9e9e;
|
|
512
|
-
list-style: none;
|
|
513
|
-
}
|
|
514
|
-
|
|
515
|
-
.breadcrumb__item {
|
|
516
|
-
display: flex;
|
|
517
|
-
align-items: center;
|
|
518
|
-
margin: 0;
|
|
519
|
-
}
|
|
520
|
-
.breadcrumb__item > * + * {
|
|
521
|
-
margin-left: 0.5em;
|
|
522
|
-
}
|
|
523
|
-
.breadcrumb__item::after {
|
|
524
|
-
content: "/";
|
|
525
|
-
padding: 0 0.5em;
|
|
526
|
-
color: rgba(0, 0, 0, 0.2);
|
|
527
|
-
}
|
|
528
|
-
.breadcrumb__item:last-child::after {
|
|
529
|
-
content: none;
|
|
530
|
-
}
|
|
531
|
-
|
|
532
|
-
.breadcrumb__link {
|
|
533
|
-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
534
|
-
color: #00bcd4;
|
|
535
|
-
}
|
|
536
|
-
.breadcrumb__link:focus, .breadcrumb__link:hover {
|
|
537
|
-
border-bottom: 1px solid #0097a7;
|
|
538
|
-
color: #0097a7;
|
|
539
|
-
}
|
|
540
|
-
|
|
541
|
-
.breadcrumb_invert {
|
|
542
|
-
color: rgba(255, 255, 255, 0.6);
|
|
543
|
-
}
|
|
544
|
-
.breadcrumb_invert .breadcrumb__item::after {
|
|
545
|
-
color: rgba(255, 255, 255, 0.2);
|
|
546
|
-
}
|
|
547
|
-
.breadcrumb_invert .breadcrumb__link {
|
|
548
|
-
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
549
|
-
color: #fff;
|
|
550
|
-
}
|
|
551
|
-
.breadcrumb_invert .breadcrumb__link:focus, .breadcrumb_invert .breadcrumb__link:hover {
|
|
552
|
-
border-bottom: 1px solid #fff;
|
|
553
|
-
color: #fff;
|
|
554
|
-
}
|
|
555
|
-
|
|
556
503
|
.button {
|
|
557
504
|
position: relative;
|
|
558
505
|
display: inline-flex;
|
|
@@ -565,12 +512,12 @@ input::-moz-placeholder {
|
|
|
565
512
|
transition-duration: 0.15s;
|
|
566
513
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
567
514
|
outline: none;
|
|
568
|
-
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
515
|
+
border: 1px solid var(--vb-border-color-dark, rgba(0, 0, 0, 0.2));
|
|
569
516
|
border-radius: 0.25rem;
|
|
570
517
|
background: transparent;
|
|
571
518
|
background-clip: border-box;
|
|
572
519
|
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
573
|
-
color:
|
|
520
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
574
521
|
font-family: inherit;
|
|
575
522
|
font-size: 1em;
|
|
576
523
|
font-weight: inherit;
|
|
@@ -587,11 +534,11 @@ input::-moz-placeholder {
|
|
|
587
534
|
pointer-events: none;
|
|
588
535
|
}
|
|
589
536
|
.button:hover {
|
|
590
|
-
border-color: rgba(0, 0, 0, 0.
|
|
537
|
+
border-color: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3));
|
|
591
538
|
background-color: transparent;
|
|
592
539
|
}
|
|
593
540
|
.button:focus {
|
|
594
|
-
border-color: rgba(0, 0, 0, 0.
|
|
541
|
+
border-color: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3));
|
|
595
542
|
background-color: transparent;
|
|
596
543
|
box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.15);
|
|
597
544
|
}
|
|
@@ -612,7 +559,7 @@ input::-moz-placeholder {
|
|
|
612
559
|
animation: spin 0.6s infinite linear;
|
|
613
560
|
border: 2px solid;
|
|
614
561
|
border-radius: 9999px;
|
|
615
|
-
border-color:
|
|
562
|
+
border-color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))) var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))) transparent transparent;
|
|
616
563
|
}
|
|
617
564
|
|
|
618
565
|
@keyframes spin {
|
|
@@ -685,503 +632,122 @@ input::-moz-placeholder {
|
|
|
685
632
|
}
|
|
686
633
|
.button_color_primary {
|
|
687
634
|
border-color: transparent;
|
|
688
|
-
background-color:
|
|
689
|
-
box-shadow: 0 0 0 0 rgba(
|
|
690
|
-
color:
|
|
635
|
+
background-color: hsl(152, 60%, 50%);
|
|
636
|
+
box-shadow: 0 0 0 0 rgba(51, 204, 133, 0);
|
|
637
|
+
color: white;
|
|
691
638
|
}
|
|
692
639
|
.button_color_primary:hover {
|
|
693
640
|
border-color: transparent;
|
|
694
|
-
background-color: #
|
|
641
|
+
background-color: #2eb877;
|
|
695
642
|
}
|
|
696
643
|
.button_color_primary:focus {
|
|
697
644
|
border-color: transparent;
|
|
698
|
-
background-color: #
|
|
699
|
-
box-shadow: 0 0 0 0.2rem rgba(
|
|
645
|
+
background-color: #2eb877;
|
|
646
|
+
box-shadow: 0 0 0 0.2rem rgba(51, 204, 133, 0.5);
|
|
700
647
|
}
|
|
701
648
|
.button_color_primary:active {
|
|
702
649
|
border-color: transparent;
|
|
703
|
-
background-color: #
|
|
650
|
+
background-color: #29a36a;
|
|
704
651
|
}
|
|
705
652
|
.button_color_primary.is-loading::after {
|
|
706
|
-
border-color:
|
|
653
|
+
border-color: white white transparent transparent;
|
|
707
654
|
}
|
|
708
655
|
|
|
709
656
|
.button_color_secondary {
|
|
710
657
|
border-color: transparent;
|
|
711
|
-
background-color:
|
|
712
|
-
box-shadow: 0 0 0 0 rgba(
|
|
713
|
-
color:
|
|
658
|
+
background-color: hsl(214, 50%, 50%);
|
|
659
|
+
box-shadow: 0 0 0 0 rgba(64, 119, 191, 0);
|
|
660
|
+
color: white;
|
|
714
661
|
}
|
|
715
662
|
.button_color_secondary:hover {
|
|
716
663
|
border-color: transparent;
|
|
717
|
-
background-color: #
|
|
664
|
+
background-color: #396bac;
|
|
718
665
|
}
|
|
719
666
|
.button_color_secondary:focus {
|
|
720
667
|
border-color: transparent;
|
|
721
|
-
background-color: #
|
|
722
|
-
box-shadow: 0 0 0 0.2rem rgba(
|
|
668
|
+
background-color: #396bac;
|
|
669
|
+
box-shadow: 0 0 0 0.2rem rgba(64, 119, 191, 0.5);
|
|
723
670
|
}
|
|
724
671
|
.button_color_secondary:active {
|
|
725
672
|
border-color: transparent;
|
|
726
|
-
background-color: #
|
|
673
|
+
background-color: #335f99;
|
|
727
674
|
}
|
|
728
675
|
.button_color_secondary.is-loading::after {
|
|
729
|
-
border-color:
|
|
730
|
-
}
|
|
731
|
-
|
|
732
|
-
.button_icon {
|
|
733
|
-
padding: calc(0.5em - 1px);
|
|
734
|
-
}
|
|
735
|
-
.button_icon.button_size_sm {
|
|
736
|
-
padding: calc(0.25rem - 1px);
|
|
737
|
-
}
|
|
738
|
-
.button_icon.button_size_lg {
|
|
739
|
-
padding: calc(0.648rem - 1px);
|
|
676
|
+
border-color: white white transparent transparent;
|
|
740
677
|
}
|
|
741
678
|
|
|
742
|
-
.
|
|
743
|
-
border-color: rgba(255, 255, 255, 0.2);
|
|
744
|
-
background-color: transparent;
|
|
745
|
-
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
|
|
746
|
-
color: #fff;
|
|
747
|
-
}
|
|
748
|
-
.button_invert:hover {
|
|
749
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
750
|
-
background-color: transparent;
|
|
751
|
-
}
|
|
752
|
-
.button_invert:focus {
|
|
753
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
754
|
-
background-color: transparent;
|
|
755
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.15);
|
|
756
|
-
}
|
|
757
|
-
.button_invert:active {
|
|
758
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
759
|
-
background-color: rgba(255, 255, 255, 0.05);
|
|
760
|
-
}
|
|
761
|
-
.button_invert.is-loading::after {
|
|
762
|
-
border-color: #fff #fff transparent transparent;
|
|
763
|
-
}
|
|
764
|
-
|
|
765
|
-
.button_size_sm {
|
|
766
|
-
min-width: 1.875rem;
|
|
767
|
-
height: 1.875rem;
|
|
768
|
-
padding: calc(0.25rem - 1px) 0.5rem;
|
|
769
|
-
font-size: 0.875rem;
|
|
770
|
-
line-height: 1.375;
|
|
771
|
-
}
|
|
772
|
-
|
|
773
|
-
.button_size_lg {
|
|
774
|
-
min-width: 3.125rem;
|
|
775
|
-
height: 3.125rem;
|
|
776
|
-
padding: calc(0.648rem - 1px) 1.5rem;
|
|
777
|
-
font-size: 1.125rem;
|
|
778
|
-
line-height: 1.625;
|
|
779
|
-
}
|
|
780
|
-
|
|
781
|
-
.button_state_info {
|
|
782
|
-
border-color: transparent;
|
|
783
|
-
background-color: #03a9f4;
|
|
784
|
-
box-shadow: 0 0 0 0 rgba(3, 169, 244, 0);
|
|
785
|
-
color: #fff;
|
|
786
|
-
}
|
|
787
|
-
.button_state_info:hover {
|
|
788
|
-
border-color: transparent;
|
|
789
|
-
background-color: #0398dc;
|
|
790
|
-
}
|
|
791
|
-
.button_state_info:focus {
|
|
792
|
-
border-color: transparent;
|
|
793
|
-
background-color: #0398dc;
|
|
794
|
-
box-shadow: 0 0 0 0.2rem rgba(3, 169, 244, 0.5);
|
|
795
|
-
}
|
|
796
|
-
.button_state_info:active {
|
|
679
|
+
.button_color_neutral {
|
|
797
680
|
border-color: transparent;
|
|
798
|
-
background-color:
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
border-color: #fff #fff transparent transparent;
|
|
681
|
+
background-color: hsl(214, 20%, 50%);
|
|
682
|
+
box-shadow: 0 0 0 0 rgba(102, 124, 153, 0);
|
|
683
|
+
color: white;
|
|
802
684
|
}
|
|
803
|
-
|
|
804
|
-
.button_state_success {
|
|
685
|
+
.button_color_neutral:hover {
|
|
805
686
|
border-color: transparent;
|
|
806
|
-
background-color: #
|
|
807
|
-
box-shadow: 0 0 0 0 rgba(76, 175, 80, 0);
|
|
808
|
-
color: #fff;
|
|
687
|
+
background-color: #5c708a;
|
|
809
688
|
}
|
|
810
|
-
.
|
|
689
|
+
.button_color_neutral:focus {
|
|
811
690
|
border-color: transparent;
|
|
812
|
-
background-color: #
|
|
691
|
+
background-color: #5c708a;
|
|
692
|
+
box-shadow: 0 0 0 0.2rem rgba(102, 124, 153, 0.5);
|
|
813
693
|
}
|
|
814
|
-
.
|
|
694
|
+
.button_color_neutral:active {
|
|
815
695
|
border-color: transparent;
|
|
816
|
-
background-color: #
|
|
817
|
-
box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5);
|
|
696
|
+
background-color: #52637a;
|
|
818
697
|
}
|
|
819
|
-
.
|
|
820
|
-
border-color: transparent;
|
|
821
|
-
background-color: #3d8c40;
|
|
822
|
-
}
|
|
823
|
-
.button_state_success.is-loading::after {
|
|
824
|
-
border-color: #fff #fff transparent transparent;
|
|
698
|
+
.button_color_neutral.is-loading::after {
|
|
699
|
+
border-color: white white transparent transparent;
|
|
825
700
|
}
|
|
826
701
|
|
|
827
|
-
.
|
|
828
|
-
border-color: transparent;
|
|
829
|
-
background-color: #ff9800;
|
|
830
|
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0);
|
|
831
|
-
color: #fff;
|
|
832
|
-
}
|
|
833
|
-
.button_state_caution:hover {
|
|
702
|
+
.button_color_important {
|
|
834
703
|
border-color: transparent;
|
|
835
|
-
background-color:
|
|
704
|
+
background-color: hsl(0, 80%, 50%);
|
|
705
|
+
box-shadow: 0 0 0 0 rgba(230, 26, 26, 0);
|
|
706
|
+
color: white;
|
|
836
707
|
}
|
|
837
|
-
.
|
|
708
|
+
.button_color_important:hover {
|
|
838
709
|
border-color: transparent;
|
|
839
|
-
background-color: #
|
|
840
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.5);
|
|
710
|
+
background-color: #cf1717;
|
|
841
711
|
}
|
|
842
|
-
.
|
|
712
|
+
.button_color_important:focus {
|
|
843
713
|
border-color: transparent;
|
|
844
|
-
background-color: #
|
|
714
|
+
background-color: #cf1717;
|
|
715
|
+
box-shadow: 0 0 0 0.2rem rgba(230, 26, 26, 0.5);
|
|
845
716
|
}
|
|
846
|
-
.
|
|
847
|
-
border-color: #fff #fff transparent transparent;
|
|
848
|
-
}
|
|
849
|
-
|
|
850
|
-
.button_state_danger {
|
|
851
|
-
border-color: transparent;
|
|
852
|
-
background-color: #f44336;
|
|
853
|
-
box-shadow: 0 0 0 0 rgba(244, 67, 54, 0);
|
|
854
|
-
color: #fff;
|
|
855
|
-
}
|
|
856
|
-
.button_state_danger:hover {
|
|
717
|
+
.button_color_important:active {
|
|
857
718
|
border-color: transparent;
|
|
858
|
-
background-color: #
|
|
859
|
-
}
|
|
860
|
-
.button_state_danger:focus {
|
|
861
|
-
border-color: transparent;
|
|
862
|
-
background-color: #f2291a;
|
|
863
|
-
box-shadow: 0 0 0 0.2rem rgba(244, 67, 54, 0.5);
|
|
864
|
-
}
|
|
865
|
-
.button_state_danger:active {
|
|
866
|
-
border-color: transparent;
|
|
867
|
-
background-color: #e21b0c;
|
|
868
|
-
}
|
|
869
|
-
.button_state_danger.is-loading::after {
|
|
870
|
-
border-color: #fff #fff transparent transparent;
|
|
871
|
-
}
|
|
872
|
-
|
|
873
|
-
.button_subtle {
|
|
874
|
-
border-color: transparent;
|
|
875
|
-
background-color: transparent;
|
|
876
|
-
box-shadow: 0 0 0 0 rgba(33, 33, 33, 0);
|
|
877
|
-
color: #9e9e9e;
|
|
878
|
-
}
|
|
879
|
-
.button_subtle:hover {
|
|
880
|
-
border-color: transparent;
|
|
881
|
-
background-color: transparent;
|
|
882
|
-
color: #212121;
|
|
883
|
-
}
|
|
884
|
-
.button_subtle:focus {
|
|
885
|
-
border-color: rgba(0, 0, 0, 0.2);
|
|
886
|
-
background-color: transparent;
|
|
887
|
-
box-shadow: 0 0 0 0.2rem rgba(33, 33, 33, 0.05);
|
|
888
|
-
color: #212121;
|
|
889
|
-
}
|
|
890
|
-
.button_subtle:active {
|
|
891
|
-
border-color: rgba(0, 0, 0, 0.5);
|
|
892
|
-
background-color: transparent;
|
|
893
|
-
}
|
|
894
|
-
.button_subtle.is-loading::after {
|
|
895
|
-
border-color: #9e9e9e #9e9e9e transparent transparent;
|
|
896
|
-
}
|
|
897
|
-
.button_subtle.button_invert {
|
|
898
|
-
border-color: transparent;
|
|
899
|
-
background-color: transparent;
|
|
900
|
-
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
|
|
901
|
-
color: rgba(255, 255, 255, 0.6);
|
|
902
|
-
}
|
|
903
|
-
.button_subtle.button_invert:hover {
|
|
904
|
-
border-color: transparent;
|
|
905
|
-
background-color: transparent;
|
|
906
|
-
color: #fff;
|
|
907
|
-
}
|
|
908
|
-
.button_subtle.button_invert:focus {
|
|
909
|
-
border-color: rgba(255, 255, 255, 0.2);
|
|
910
|
-
background-color: transparent;
|
|
911
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.05);
|
|
912
|
-
color: #fff;
|
|
913
|
-
}
|
|
914
|
-
.button_subtle.button_invert:active {
|
|
915
|
-
border-color: rgba(255, 255, 255, 0.5);
|
|
916
|
-
background-color: transparent;
|
|
917
|
-
}
|
|
918
|
-
.button_subtle.button_invert.is-loading::after {
|
|
919
|
-
border-color: rgba(255, 255, 255, 0.6) rgba(255, 255, 255, 0.6) transparent transparent;
|
|
920
|
-
}
|
|
921
|
-
|
|
922
|
-
.button-group {
|
|
923
|
-
margin-top: -0.5em;
|
|
924
|
-
margin-left: -0.5em;
|
|
925
|
-
display: inline-flex;
|
|
926
|
-
flex-wrap: wrap;
|
|
927
|
-
align-items: center;
|
|
928
|
-
}
|
|
929
|
-
.button-group > * {
|
|
930
|
-
margin-top: 0.5em;
|
|
931
|
-
margin-left: 0.5em;
|
|
932
|
-
}
|
|
933
|
-
.button-group + .button-group {
|
|
934
|
-
margin-top: 0;
|
|
935
|
-
}
|
|
936
|
-
.button-group > * {
|
|
937
|
-
z-index: 1;
|
|
938
|
-
flex: 0 0 auto;
|
|
939
|
-
border-radius: 0.25rem;
|
|
940
|
-
}
|
|
941
|
-
.button-group > *:hover {
|
|
942
|
-
z-index: 2;
|
|
943
|
-
}
|
|
944
|
-
.button-group > *:focus {
|
|
945
|
-
z-index: 3;
|
|
946
|
-
}
|
|
947
|
-
.button-group > *:active {
|
|
948
|
-
z-index: 4;
|
|
949
|
-
}
|
|
950
|
-
.button-group > *.is-active {
|
|
951
|
-
z-index: 5;
|
|
952
|
-
}
|
|
953
|
-
|
|
954
|
-
.button-group_full {
|
|
955
|
-
display: flex;
|
|
956
|
-
align-items: stretch;
|
|
957
|
-
}
|
|
958
|
-
.button-group_full > * {
|
|
959
|
-
flex: 1 1 auto;
|
|
960
|
-
}
|
|
961
|
-
|
|
962
|
-
@media (max-width: 479px) {
|
|
963
|
-
.button-group_full_xs {
|
|
964
|
-
display: flex;
|
|
965
|
-
align-items: stretch;
|
|
966
|
-
}
|
|
967
|
-
.button-group_full_xs > * {
|
|
968
|
-
flex: 1 1 auto;
|
|
969
|
-
}
|
|
970
|
-
}
|
|
971
|
-
@media (max-width: 619px) {
|
|
972
|
-
.button-group_full_sm {
|
|
973
|
-
display: flex;
|
|
974
|
-
align-items: stretch;
|
|
975
|
-
}
|
|
976
|
-
.button-group_full_sm > * {
|
|
977
|
-
flex: 1 1 auto;
|
|
978
|
-
}
|
|
979
|
-
}
|
|
980
|
-
@media (max-width: 759px) {
|
|
981
|
-
.button-group_full_md {
|
|
982
|
-
display: flex;
|
|
983
|
-
align-items: stretch;
|
|
984
|
-
}
|
|
985
|
-
.button-group_full_md > * {
|
|
986
|
-
flex: 1 1 auto;
|
|
987
|
-
}
|
|
988
|
-
}
|
|
989
|
-
@media (max-width: 989px) {
|
|
990
|
-
.button-group_full_lg {
|
|
991
|
-
display: flex;
|
|
992
|
-
align-items: stretch;
|
|
993
|
-
}
|
|
994
|
-
.button-group_full_lg > * {
|
|
995
|
-
flex: 1 1 auto;
|
|
996
|
-
}
|
|
997
|
-
}
|
|
998
|
-
@media (max-width: 1379px) {
|
|
999
|
-
.button-group_full_xl {
|
|
1000
|
-
display: flex;
|
|
1001
|
-
align-items: stretch;
|
|
1002
|
-
}
|
|
1003
|
-
.button-group_full_xl > * {
|
|
1004
|
-
flex: 1 1 auto;
|
|
1005
|
-
}
|
|
1006
|
-
}
|
|
1007
|
-
.button-group_gap_none {
|
|
1008
|
-
margin-top: 0;
|
|
1009
|
-
margin-left: 0;
|
|
719
|
+
background-color: #b81414;
|
|
1010
720
|
}
|
|
1011
|
-
.
|
|
1012
|
-
|
|
1013
|
-
margin-left: 0;
|
|
1014
|
-
}
|
|
1015
|
-
|
|
1016
|
-
.button-group_gap_xs {
|
|
1017
|
-
margin-top: -1px;
|
|
1018
|
-
margin-left: -1px;
|
|
1019
|
-
}
|
|
1020
|
-
.button-group_gap_xs > * {
|
|
1021
|
-
margin-top: 1px;
|
|
1022
|
-
margin-left: 1px;
|
|
1023
|
-
}
|
|
1024
|
-
|
|
1025
|
-
.button-group_gap_sm {
|
|
1026
|
-
margin-top: -0.25em;
|
|
1027
|
-
margin-left: -0.25em;
|
|
1028
|
-
}
|
|
1029
|
-
.button-group_gap_sm > * {
|
|
1030
|
-
margin-top: 0.25em;
|
|
1031
|
-
margin-left: 0.25em;
|
|
1032
|
-
}
|
|
1033
|
-
|
|
1034
|
-
.button-group_gap_md {
|
|
1035
|
-
margin-top: -0.5em;
|
|
1036
|
-
margin-left: -0.5em;
|
|
1037
|
-
}
|
|
1038
|
-
.button-group_gap_md > * {
|
|
1039
|
-
margin-top: 0.5em;
|
|
1040
|
-
margin-left: 0.5em;
|
|
1041
|
-
}
|
|
1042
|
-
|
|
1043
|
-
.button-group_gap_lg {
|
|
1044
|
-
margin-top: -1em;
|
|
1045
|
-
margin-left: -1em;
|
|
1046
|
-
}
|
|
1047
|
-
.button-group_gap_lg > * {
|
|
1048
|
-
margin-top: 1em;
|
|
1049
|
-
margin-left: 1em;
|
|
1050
|
-
}
|
|
1051
|
-
|
|
1052
|
-
.button-group_gap_xl {
|
|
1053
|
-
margin-top: -1.5em;
|
|
1054
|
-
margin-left: -1.5em;
|
|
1055
|
-
}
|
|
1056
|
-
.button-group_gap_xl > * {
|
|
1057
|
-
margin-top: 1.5em;
|
|
1058
|
-
margin-left: 1.5em;
|
|
721
|
+
.button_color_important.is-loading::after {
|
|
722
|
+
border-color: white white transparent transparent;
|
|
1059
723
|
}
|
|
1060
724
|
|
|
1061
|
-
.
|
|
1062
|
-
|
|
1063
|
-
margin-left: 1px;
|
|
1064
|
-
}
|
|
1065
|
-
.button-group_join > * {
|
|
1066
|
-
margin-top: -1px;
|
|
1067
|
-
margin-left: -1px;
|
|
1068
|
-
border-radius: 0;
|
|
725
|
+
.button_icon {
|
|
726
|
+
padding: calc(0.5em - 1px);
|
|
1069
727
|
}
|
|
1070
|
-
.
|
|
1071
|
-
|
|
1072
|
-
border-bottom-left-radius: 0.25rem;
|
|
728
|
+
.button_icon.button_size_sm {
|
|
729
|
+
padding: calc(0.25rem - 1px);
|
|
1073
730
|
}
|
|
1074
|
-
.
|
|
1075
|
-
|
|
1076
|
-
border-bottom-right-radius: 0.25rem;
|
|
731
|
+
.button_icon.button_size_lg {
|
|
732
|
+
padding: calc(0.648rem - 1px);
|
|
1077
733
|
}
|
|
1078
734
|
|
|
1079
|
-
.
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
.
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
}
|
|
1086
|
-
.button-group_join.button-group_stack > *:last-child {
|
|
1087
|
-
border-bottom-left-radius: 0.25rem;
|
|
1088
|
-
border-bottom-right-radius: 0.25rem;
|
|
735
|
+
.button_size_sm {
|
|
736
|
+
min-width: 1.875rem;
|
|
737
|
+
height: 1.875rem;
|
|
738
|
+
padding: calc(0.25rem - 1px) 0.5rem;
|
|
739
|
+
font-size: 0.875rem;
|
|
740
|
+
line-height: 1.375;
|
|
1089
741
|
}
|
|
1090
742
|
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
border-top-right-radius: 0.25rem;
|
|
1098
|
-
}
|
|
1099
|
-
.button-group_join.button-group_stack_xs > *:last-child {
|
|
1100
|
-
border-bottom-left-radius: 0.25rem;
|
|
1101
|
-
border-bottom-right-radius: 0.25rem;
|
|
1102
|
-
}
|
|
1103
|
-
}
|
|
1104
|
-
@media (max-width: 619px) {
|
|
1105
|
-
.button-group_join.button-group_stack_sm > * {
|
|
1106
|
-
border-radius: 0;
|
|
1107
|
-
}
|
|
1108
|
-
.button-group_join.button-group_stack_sm > *:first-child {
|
|
1109
|
-
border-top-left-radius: 0.25rem;
|
|
1110
|
-
border-top-right-radius: 0.25rem;
|
|
1111
|
-
}
|
|
1112
|
-
.button-group_join.button-group_stack_sm > *:last-child {
|
|
1113
|
-
border-bottom-left-radius: 0.25rem;
|
|
1114
|
-
border-bottom-right-radius: 0.25rem;
|
|
1115
|
-
}
|
|
1116
|
-
}
|
|
1117
|
-
@media (max-width: 759px) {
|
|
1118
|
-
.button-group_join.button-group_stack_md > * {
|
|
1119
|
-
border-radius: 0;
|
|
1120
|
-
}
|
|
1121
|
-
.button-group_join.button-group_stack_md > *:first-child {
|
|
1122
|
-
border-top-left-radius: 0.25rem;
|
|
1123
|
-
border-top-right-radius: 0.25rem;
|
|
1124
|
-
}
|
|
1125
|
-
.button-group_join.button-group_stack_md > *:last-child {
|
|
1126
|
-
border-bottom-left-radius: 0.25rem;
|
|
1127
|
-
border-bottom-right-radius: 0.25rem;
|
|
1128
|
-
}
|
|
1129
|
-
}
|
|
1130
|
-
@media (max-width: 989px) {
|
|
1131
|
-
.button-group_join.button-group_stack_lg > * {
|
|
1132
|
-
border-radius: 0;
|
|
1133
|
-
}
|
|
1134
|
-
.button-group_join.button-group_stack_lg > *:first-child {
|
|
1135
|
-
border-top-left-radius: 0.25rem;
|
|
1136
|
-
border-top-right-radius: 0.25rem;
|
|
1137
|
-
}
|
|
1138
|
-
.button-group_join.button-group_stack_lg > *:last-child {
|
|
1139
|
-
border-bottom-left-radius: 0.25rem;
|
|
1140
|
-
border-bottom-right-radius: 0.25rem;
|
|
1141
|
-
}
|
|
1142
|
-
}
|
|
1143
|
-
@media (max-width: 1379px) {
|
|
1144
|
-
.button-group_join.button-group_stack_xl > * {
|
|
1145
|
-
border-radius: 0;
|
|
1146
|
-
}
|
|
1147
|
-
.button-group_join.button-group_stack_xl > *:first-child {
|
|
1148
|
-
border-top-left-radius: 0.25rem;
|
|
1149
|
-
border-top-right-radius: 0.25rem;
|
|
1150
|
-
}
|
|
1151
|
-
.button-group_join.button-group_stack_xl > *:last-child {
|
|
1152
|
-
border-bottom-left-radius: 0.25rem;
|
|
1153
|
-
border-bottom-right-radius: 0.25rem;
|
|
1154
|
-
}
|
|
1155
|
-
}
|
|
1156
|
-
.button-group_stack {
|
|
1157
|
-
flex-direction: column;
|
|
743
|
+
.button_size_lg {
|
|
744
|
+
min-width: 3.125rem;
|
|
745
|
+
height: 3.125rem;
|
|
746
|
+
padding: calc(0.648rem - 1px) 1.5rem;
|
|
747
|
+
font-size: 1.125rem;
|
|
748
|
+
line-height: 1.625;
|
|
1158
749
|
}
|
|
1159
750
|
|
|
1160
|
-
@media (max-width: 479px) {
|
|
1161
|
-
.button-group_stack_xs {
|
|
1162
|
-
flex-direction: column;
|
|
1163
|
-
}
|
|
1164
|
-
}
|
|
1165
|
-
@media (max-width: 619px) {
|
|
1166
|
-
.button-group_stack_sm {
|
|
1167
|
-
flex-direction: column;
|
|
1168
|
-
}
|
|
1169
|
-
}
|
|
1170
|
-
@media (max-width: 759px) {
|
|
1171
|
-
.button-group_stack_md {
|
|
1172
|
-
flex-direction: column;
|
|
1173
|
-
}
|
|
1174
|
-
}
|
|
1175
|
-
@media (max-width: 989px) {
|
|
1176
|
-
.button-group_stack_lg {
|
|
1177
|
-
flex-direction: column;
|
|
1178
|
-
}
|
|
1179
|
-
}
|
|
1180
|
-
@media (max-width: 1379px) {
|
|
1181
|
-
.button-group_stack_xl {
|
|
1182
|
-
flex-direction: column;
|
|
1183
|
-
}
|
|
1184
|
-
}
|
|
1185
751
|
.card {
|
|
1186
752
|
position: relative;
|
|
1187
753
|
display: flex;
|
|
@@ -1191,8 +757,8 @@ input::-moz-placeholder {
|
|
|
1191
757
|
transition-duration: 0.3s;
|
|
1192
758
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1193
759
|
border-radius: 0.25rem;
|
|
1194
|
-
background:
|
|
1195
|
-
box-shadow: 0
|
|
760
|
+
background: white;
|
|
761
|
+
box-shadow: 0 1px 3px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1196
762
|
}
|
|
1197
763
|
|
|
1198
764
|
.card__header,
|
|
@@ -1213,7 +779,7 @@ input::-moz-placeholder {
|
|
|
1213
779
|
flex: 1 1 auto;
|
|
1214
780
|
}
|
|
1215
781
|
.card__body + .card__body {
|
|
1216
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
782
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1217
783
|
}
|
|
1218
784
|
|
|
1219
785
|
.card__image {
|
|
@@ -1231,7 +797,7 @@ input::-moz-placeholder {
|
|
|
1231
797
|
}
|
|
1232
798
|
|
|
1233
799
|
.card__header {
|
|
1234
|
-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
800
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1235
801
|
}
|
|
1236
802
|
.card__header:first-child {
|
|
1237
803
|
border-top-left-radius: 0.25rem;
|
|
@@ -1239,7 +805,7 @@ input::-moz-placeholder {
|
|
|
1239
805
|
}
|
|
1240
806
|
|
|
1241
807
|
.card__footer {
|
|
1242
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
808
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1243
809
|
}
|
|
1244
810
|
.card__footer:last-child {
|
|
1245
811
|
border-bottom-left-radius: 0.25rem;
|
|
@@ -1275,51 +841,38 @@ input::-moz-placeholder {
|
|
|
1275
841
|
|
|
1276
842
|
.card__screen {
|
|
1277
843
|
z-index: 2;
|
|
1278
|
-
background:
|
|
844
|
+
background: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
1279
845
|
opacity: 0.7;
|
|
1280
846
|
}
|
|
1281
847
|
|
|
1282
848
|
@media (min-width: 760px) {
|
|
1283
849
|
.card_fade .card__header,
|
|
1284
|
-
.card_fade .card__body,
|
|
1285
|
-
.card_fade .card__footer,
|
|
1286
|
-
.card_fade .card__screen {
|
|
850
|
+
.card_fade .card__body,
|
|
851
|
+
.card_fade .card__footer,
|
|
852
|
+
.card_fade .card__screen {
|
|
1287
853
|
transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
1288
854
|
opacity: 0;
|
|
1289
855
|
}
|
|
1290
856
|
.card_fade:hover .card__header,
|
|
1291
|
-
.card_fade:hover .card__body,
|
|
1292
|
-
.card_fade:hover .card__footer, .card_fade:focus .card__header,
|
|
1293
|
-
.card_fade:focus .card__body,
|
|
1294
|
-
.card_fade:focus .card__footer, .card_fade:focus-within .card__header,
|
|
1295
|
-
.card_fade:focus-within .card__body,
|
|
1296
|
-
.card_fade:focus-within .card__footer {
|
|
857
|
+
.card_fade:hover .card__body,
|
|
858
|
+
.card_fade:hover .card__footer, .card_fade:focus .card__header,
|
|
859
|
+
.card_fade:focus .card__body,
|
|
860
|
+
.card_fade:focus .card__footer, .card_fade:focus-within .card__header,
|
|
861
|
+
.card_fade:focus-within .card__body,
|
|
862
|
+
.card_fade:focus-within .card__footer {
|
|
1297
863
|
opacity: 1;
|
|
1298
864
|
}
|
|
1299
865
|
.card_fade:hover .card__screen, .card_fade:focus .card__screen, .card_fade:focus-within .card__screen {
|
|
1300
866
|
opacity: 0.7;
|
|
1301
867
|
}
|
|
1302
868
|
}
|
|
1303
|
-
.card_invert {
|
|
1304
|
-
background: #424242;
|
|
1305
|
-
color: #fff;
|
|
1306
|
-
}
|
|
1307
|
-
.card_invert .card__body,
|
|
1308
|
-
.card_invert .card__header,
|
|
1309
|
-
.card_invert .card__footer {
|
|
1310
|
-
border-color: rgba(255, 255, 255, 0.1);
|
|
1311
|
-
}
|
|
1312
|
-
.card_invert .card__screen {
|
|
1313
|
-
background: #424242;
|
|
1314
|
-
}
|
|
1315
|
-
|
|
1316
869
|
.card_link {
|
|
1317
870
|
transform: translate(0, 0);
|
|
1318
|
-
box-shadow: 0
|
|
871
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1319
872
|
}
|
|
1320
873
|
.card_link:hover, .card_link:focus, .card_link:focus-within {
|
|
1321
874
|
transform: translate(0, -0.25em);
|
|
1322
|
-
box-shadow: 0
|
|
875
|
+
box-shadow: 0 4px 12px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1323
876
|
}
|
|
1324
877
|
|
|
1325
878
|
.card_zoom .card__background {
|
|
@@ -1356,9 +909,9 @@ input::-moz-placeholder {
|
|
|
1356
909
|
display: flex;
|
|
1357
910
|
align-items: center;
|
|
1358
911
|
justify-content: center;
|
|
1359
|
-
border: 2px solid
|
|
912
|
+
border: 2px solid var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
1360
913
|
border-radius: 0.25rem;
|
|
1361
|
-
background-color:
|
|
914
|
+
background-color: white;
|
|
1362
915
|
color: transparent;
|
|
1363
916
|
}
|
|
1364
917
|
|
|
@@ -1383,26 +936,26 @@ input::-moz-placeholder {
|
|
|
1383
936
|
cursor: pointer;
|
|
1384
937
|
}
|
|
1385
938
|
.checkbox__native:hover + .checkbox__background {
|
|
1386
|
-
background-color: rgba(
|
|
939
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
1387
940
|
}
|
|
1388
941
|
.checkbox__native:hover + .checkbox__background .checkbox__box {
|
|
1389
|
-
border-color:
|
|
942
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1390
943
|
}
|
|
1391
944
|
.checkbox__native:focus + .checkbox__background {
|
|
1392
|
-
background-color: rgba(
|
|
945
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
1393
946
|
}
|
|
1394
947
|
.checkbox__native:focus + .checkbox__background .checkbox__box {
|
|
1395
|
-
border-color:
|
|
948
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1396
949
|
}
|
|
1397
950
|
.checkbox__native:focus-visible + .checkbox__background, .checkbox__native:active + .checkbox__background {
|
|
1398
|
-
background-color: rgba(
|
|
951
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.2);
|
|
1399
952
|
}
|
|
1400
953
|
.checkbox__native:focus-visible + .checkbox__background .checkbox__box, .checkbox__native:active + .checkbox__background .checkbox__box {
|
|
1401
|
-
border-color:
|
|
954
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1402
955
|
}
|
|
1403
956
|
.checkbox__native:checked + .checkbox__background .checkbox__box {
|
|
1404
|
-
border-color:
|
|
1405
|
-
background-color:
|
|
957
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
958
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1406
959
|
}
|
|
1407
960
|
.checkbox__native:checked + .checkbox__background .checkbox__icon {
|
|
1408
961
|
transition-property: opacity, background-position;
|
|
@@ -1412,8 +965,8 @@ input::-moz-placeholder {
|
|
|
1412
965
|
opacity: 1;
|
|
1413
966
|
}
|
|
1414
967
|
.checkbox__native:indeterminate + .checkbox__background .checkbox__box {
|
|
1415
|
-
border-color:
|
|
1416
|
-
background-color:
|
|
968
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
969
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1417
970
|
}
|
|
1418
971
|
.checkbox__native:indeterminate + .checkbox__background .checkbox__icon {
|
|
1419
972
|
transition-property: opacity, background-position;
|
|
@@ -1467,9 +1020,9 @@ input::-moz-placeholder {
|
|
|
1467
1020
|
flex-direction: column;
|
|
1468
1021
|
overflow: auto;
|
|
1469
1022
|
border-radius: 0.25rem;
|
|
1470
|
-
background:
|
|
1023
|
+
background: white;
|
|
1471
1024
|
background-clip: padding-box;
|
|
1472
|
-
box-shadow: 0
|
|
1025
|
+
box-shadow: 0 8px 18px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1473
1026
|
-webkit-overflow-scrolling: touch;
|
|
1474
1027
|
}
|
|
1475
1028
|
|
|
@@ -1486,7 +1039,7 @@ input::-moz-placeholder {
|
|
|
1486
1039
|
z-index: 1;
|
|
1487
1040
|
display: flex;
|
|
1488
1041
|
align-items: center;
|
|
1489
|
-
background:
|
|
1042
|
+
background: white;
|
|
1490
1043
|
vertical-align: middle;
|
|
1491
1044
|
}
|
|
1492
1045
|
.dialog__header > * + *,
|
|
@@ -1496,19 +1049,19 @@ input::-moz-placeholder {
|
|
|
1496
1049
|
|
|
1497
1050
|
.dialog__header {
|
|
1498
1051
|
top: 0;
|
|
1499
|
-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
1052
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1500
1053
|
}
|
|
1501
1054
|
|
|
1502
1055
|
.dialog__body {
|
|
1503
1056
|
flex-grow: 1;
|
|
1504
1057
|
}
|
|
1505
1058
|
.dialog__body + .dialog__body {
|
|
1506
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
1059
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1507
1060
|
}
|
|
1508
1061
|
|
|
1509
1062
|
.dialog__footer {
|
|
1510
1063
|
bottom: 0;
|
|
1511
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
1064
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1512
1065
|
}
|
|
1513
1066
|
|
|
1514
1067
|
.dialog__title {
|
|
@@ -1569,17 +1122,17 @@ input::-moz-placeholder {
|
|
|
1569
1122
|
height: 100%;
|
|
1570
1123
|
overflow: auto;
|
|
1571
1124
|
border-radius: 0;
|
|
1572
|
-
background:
|
|
1125
|
+
background: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
1573
1126
|
box-shadow: none;
|
|
1574
1127
|
opacity: 0;
|
|
1575
1128
|
-webkit-overflow-scrolling: touch;
|
|
1576
1129
|
}
|
|
1577
1130
|
.drawer__dialog .dialog__header,
|
|
1578
1131
|
.drawer__dialog .dialog__footer {
|
|
1579
|
-
background:
|
|
1132
|
+
background: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
1580
1133
|
}
|
|
1581
1134
|
.drawer__dialog .dialog__body {
|
|
1582
|
-
background:
|
|
1135
|
+
background: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
1583
1136
|
}
|
|
1584
1137
|
|
|
1585
1138
|
/**
|
|
@@ -1632,15 +1185,15 @@ input::-moz-placeholder {
|
|
|
1632
1185
|
z-index: 901;
|
|
1633
1186
|
width: 18em;
|
|
1634
1187
|
max-width: 80%;
|
|
1635
|
-
background-color:
|
|
1636
|
-
box-shadow: 0
|
|
1188
|
+
background-color: white;
|
|
1189
|
+
box-shadow: 0 12px 24px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1637
1190
|
}
|
|
1638
1191
|
.drawer_modal .dialog__header,
|
|
1639
1192
|
.drawer_modal .dialog__footer {
|
|
1640
|
-
background:
|
|
1193
|
+
background: white;
|
|
1641
1194
|
}
|
|
1642
1195
|
.drawer_modal .dialog__body {
|
|
1643
|
-
background:
|
|
1196
|
+
background: white;
|
|
1644
1197
|
}
|
|
1645
1198
|
|
|
1646
1199
|
.drawer_modal.is-opening,
|
|
@@ -1658,11 +1211,11 @@ input::-moz-placeholder {
|
|
|
1658
1211
|
|
|
1659
1212
|
.drawer_modal.is-opening,
|
|
1660
1213
|
.drawer_modal.is-opened {
|
|
1661
|
-
background-color: rgba(
|
|
1214
|
+
background-color: rgba(var(--vb-neutral-10, hsl(214, 20%, 10%)), 0.8);
|
|
1662
1215
|
}
|
|
1663
1216
|
|
|
1664
1217
|
.drawer_modal.is-closing {
|
|
1665
|
-
background-color: rgba(
|
|
1218
|
+
background-color: rgba(var(--vb-neutral-10, hsl(214, 20%, 10%)), 0);
|
|
1666
1219
|
}
|
|
1667
1220
|
|
|
1668
1221
|
.drawer:not(.drawer_switch) {
|
|
@@ -2354,7 +1907,7 @@ input::-moz-placeholder {
|
|
|
2354
1907
|
background: rgba(0, 0, 0, 0.4);
|
|
2355
1908
|
background-clip: border-box;
|
|
2356
1909
|
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
2357
|
-
color:
|
|
1910
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
2358
1911
|
cursor: pointer;
|
|
2359
1912
|
}
|
|
2360
1913
|
.icon-action:disabled:not(.is-loading) {
|
|
@@ -2389,7 +1942,7 @@ input::-moz-placeholder {
|
|
|
2389
1942
|
animation: spin 0.6s infinite linear;
|
|
2390
1943
|
border: 2px solid;
|
|
2391
1944
|
border-radius: 9999px;
|
|
2392
|
-
border-color:
|
|
1945
|
+
border-color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))) var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))) transparent transparent;
|
|
2393
1946
|
}
|
|
2394
1947
|
|
|
2395
1948
|
@keyframes spin {
|
|
@@ -2400,166 +1953,6 @@ input::-moz-placeholder {
|
|
|
2400
1953
|
transform: rotate(360deg);
|
|
2401
1954
|
}
|
|
2402
1955
|
}
|
|
2403
|
-
.icon-action_invert {
|
|
2404
|
-
border-color: transparent;
|
|
2405
|
-
background-color: rgba(255, 255, 255, 0.5);
|
|
2406
|
-
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
|
|
2407
|
-
color: #212121;
|
|
2408
|
-
}
|
|
2409
|
-
.icon-action_invert:hover {
|
|
2410
|
-
border-color: transparent;
|
|
2411
|
-
background-color: rgba(255, 255, 255, 0.6);
|
|
2412
|
-
}
|
|
2413
|
-
.icon-action_invert:focus {
|
|
2414
|
-
border-color: transparent;
|
|
2415
|
-
background-color: rgba(255, 255, 255, 0.6);
|
|
2416
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
|
|
2417
|
-
}
|
|
2418
|
-
.icon-action_invert:active {
|
|
2419
|
-
border-color: transparent;
|
|
2420
|
-
background-color: rgba(255, 255, 255, 0.7);
|
|
2421
|
-
}
|
|
2422
|
-
.icon-action_invert.is-loading::after {
|
|
2423
|
-
border-color: #212121 #212121 transparent transparent;
|
|
2424
|
-
}
|
|
2425
|
-
|
|
2426
|
-
.icon-action_state_info {
|
|
2427
|
-
border-color: transparent;
|
|
2428
|
-
background-color: #03a9f4;
|
|
2429
|
-
box-shadow: 0 0 0 0 rgba(3, 169, 244, 0);
|
|
2430
|
-
color: #fff;
|
|
2431
|
-
}
|
|
2432
|
-
.icon-action_state_info:hover {
|
|
2433
|
-
border-color: transparent;
|
|
2434
|
-
background-color: #0398dc;
|
|
2435
|
-
}
|
|
2436
|
-
.icon-action_state_info:focus {
|
|
2437
|
-
border-color: transparent;
|
|
2438
|
-
background-color: #0398dc;
|
|
2439
|
-
box-shadow: 0 0 0 0.2rem rgba(3, 169, 244, 0.5);
|
|
2440
|
-
}
|
|
2441
|
-
.icon-action_state_info:active {
|
|
2442
|
-
border-color: transparent;
|
|
2443
|
-
background-color: #0287c3;
|
|
2444
|
-
}
|
|
2445
|
-
.icon-action_state_info.is-loading::after {
|
|
2446
|
-
border-color: #fff #fff transparent transparent;
|
|
2447
|
-
}
|
|
2448
|
-
|
|
2449
|
-
.icon-action_state_success {
|
|
2450
|
-
border-color: transparent;
|
|
2451
|
-
background-color: #4caf50;
|
|
2452
|
-
box-shadow: 0 0 0 0 rgba(76, 175, 80, 0);
|
|
2453
|
-
color: #fff;
|
|
2454
|
-
}
|
|
2455
|
-
.icon-action_state_success:hover {
|
|
2456
|
-
border-color: transparent;
|
|
2457
|
-
background-color: #449e48;
|
|
2458
|
-
}
|
|
2459
|
-
.icon-action_state_success:focus {
|
|
2460
|
-
border-color: transparent;
|
|
2461
|
-
background-color: #449e48;
|
|
2462
|
-
box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5);
|
|
2463
|
-
}
|
|
2464
|
-
.icon-action_state_success:active {
|
|
2465
|
-
border-color: transparent;
|
|
2466
|
-
background-color: #3d8c40;
|
|
2467
|
-
}
|
|
2468
|
-
.icon-action_state_success.is-loading::after {
|
|
2469
|
-
border-color: #fff #fff transparent transparent;
|
|
2470
|
-
}
|
|
2471
|
-
|
|
2472
|
-
.icon-action_state_caution {
|
|
2473
|
-
border-color: transparent;
|
|
2474
|
-
background-color: #ff9800;
|
|
2475
|
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0);
|
|
2476
|
-
color: #fff;
|
|
2477
|
-
}
|
|
2478
|
-
.icon-action_state_caution:hover {
|
|
2479
|
-
border-color: transparent;
|
|
2480
|
-
background-color: #e68900;
|
|
2481
|
-
}
|
|
2482
|
-
.icon-action_state_caution:focus {
|
|
2483
|
-
border-color: transparent;
|
|
2484
|
-
background-color: #e68900;
|
|
2485
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.5);
|
|
2486
|
-
}
|
|
2487
|
-
.icon-action_state_caution:active {
|
|
2488
|
-
border-color: transparent;
|
|
2489
|
-
background-color: #cc7a00;
|
|
2490
|
-
}
|
|
2491
|
-
.icon-action_state_caution.is-loading::after {
|
|
2492
|
-
border-color: #fff #fff transparent transparent;
|
|
2493
|
-
}
|
|
2494
|
-
|
|
2495
|
-
.icon-action_state_danger {
|
|
2496
|
-
border-color: transparent;
|
|
2497
|
-
background-color: #f44336;
|
|
2498
|
-
box-shadow: 0 0 0 0 rgba(244, 67, 54, 0);
|
|
2499
|
-
color: #fff;
|
|
2500
|
-
}
|
|
2501
|
-
.icon-action_state_danger:hover {
|
|
2502
|
-
border-color: transparent;
|
|
2503
|
-
background-color: #f2291a;
|
|
2504
|
-
}
|
|
2505
|
-
.icon-action_state_danger:focus {
|
|
2506
|
-
border-color: transparent;
|
|
2507
|
-
background-color: #f2291a;
|
|
2508
|
-
box-shadow: 0 0 0 0.2rem rgba(244, 67, 54, 0.5);
|
|
2509
|
-
}
|
|
2510
|
-
.icon-action_state_danger:active {
|
|
2511
|
-
border-color: transparent;
|
|
2512
|
-
background-color: #e21b0c;
|
|
2513
|
-
}
|
|
2514
|
-
.icon-action_state_danger.is-loading::after {
|
|
2515
|
-
border-color: #fff #fff transparent transparent;
|
|
2516
|
-
}
|
|
2517
|
-
|
|
2518
|
-
.icon-action_subtle {
|
|
2519
|
-
border-color: transparent;
|
|
2520
|
-
background-color: transparent;
|
|
2521
|
-
box-shadow: none;
|
|
2522
|
-
color: #212121;
|
|
2523
|
-
}
|
|
2524
|
-
.icon-action_subtle:hover {
|
|
2525
|
-
border-color: transparent;
|
|
2526
|
-
background-color: rgba(33, 33, 33, 0.1);
|
|
2527
|
-
}
|
|
2528
|
-
.icon-action_subtle:focus {
|
|
2529
|
-
border-color: transparent;
|
|
2530
|
-
background-color: rgba(33, 33, 33, 0.1);
|
|
2531
|
-
box-shadow: none;
|
|
2532
|
-
}
|
|
2533
|
-
.icon-action_subtle:active {
|
|
2534
|
-
border-color: transparent;
|
|
2535
|
-
background-color: rgba(33, 33, 33, 0.15);
|
|
2536
|
-
}
|
|
2537
|
-
.icon-action_subtle.is-loading::after {
|
|
2538
|
-
border-color: #212121 #212121 transparent transparent;
|
|
2539
|
-
}
|
|
2540
|
-
.icon-action_subtle.icon-action_invert {
|
|
2541
|
-
border-color: transparent;
|
|
2542
|
-
background-color: transparent;
|
|
2543
|
-
box-shadow: none;
|
|
2544
|
-
color: #fff;
|
|
2545
|
-
}
|
|
2546
|
-
.icon-action_subtle.icon-action_invert:hover {
|
|
2547
|
-
border-color: transparent;
|
|
2548
|
-
background-color: rgba(255, 255, 255, 0.1);
|
|
2549
|
-
}
|
|
2550
|
-
.icon-action_subtle.icon-action_invert:focus {
|
|
2551
|
-
border-color: transparent;
|
|
2552
|
-
background-color: rgba(255, 255, 255, 0.1);
|
|
2553
|
-
box-shadow: none;
|
|
2554
|
-
}
|
|
2555
|
-
.icon-action_subtle.icon-action_invert:active {
|
|
2556
|
-
border-color: transparent;
|
|
2557
|
-
background-color: rgba(255, 255, 255, 0.15);
|
|
2558
|
-
}
|
|
2559
|
-
.icon-action_subtle.icon-action_invert.is-loading::after {
|
|
2560
|
-
border-color: #fff #fff transparent transparent;
|
|
2561
|
-
}
|
|
2562
|
-
|
|
2563
1956
|
.input {
|
|
2564
1957
|
position: relative;
|
|
2565
1958
|
display: block;
|
|
@@ -2571,11 +1964,11 @@ input::-moz-placeholder {
|
|
|
2571
1964
|
transition-duration: 0.15s;
|
|
2572
1965
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2573
1966
|
outline: none;
|
|
2574
|
-
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
1967
|
+
border: 1px solid var(--vb-border-color-dark, rgba(0, 0, 0, 0.2));
|
|
2575
1968
|
border-radius: 0.25rem;
|
|
2576
|
-
background:
|
|
2577
|
-
box-shadow: 0 0 0 0 rgba(
|
|
2578
|
-
color:
|
|
1969
|
+
background: white;
|
|
1970
|
+
box-shadow: 0 0 0 0 rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
1971
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
2579
1972
|
font-family: blinkmacsystemfont, -apple-system, system-ui, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif;
|
|
2580
1973
|
font-size: 16px;
|
|
2581
1974
|
line-height: 1.5;
|
|
@@ -2584,21 +1977,21 @@ input::-moz-placeholder {
|
|
|
2584
1977
|
appearance: none;
|
|
2585
1978
|
}
|
|
2586
1979
|
.input:hover {
|
|
2587
|
-
border-color: rgba(0, 0, 0, 0.
|
|
1980
|
+
border-color: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3));
|
|
2588
1981
|
}
|
|
2589
1982
|
.input:focus {
|
|
2590
|
-
border-color:
|
|
2591
|
-
box-shadow: 0 0 0 0.2rem rgba(
|
|
1983
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1984
|
+
box-shadow: 0 0 0 0.2rem rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2592
1985
|
}
|
|
2593
1986
|
.input:disabled {
|
|
2594
|
-
background-color:
|
|
1987
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
2595
1988
|
pointer-events: none;
|
|
2596
1989
|
}
|
|
2597
1990
|
.input:read-only {
|
|
2598
|
-
background-color:
|
|
1991
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
2599
1992
|
}
|
|
2600
1993
|
.input::placeholder {
|
|
2601
|
-
color:
|
|
1994
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
2602
1995
|
}
|
|
2603
1996
|
|
|
2604
1997
|
.input_auto {
|
|
@@ -2619,70 +2012,31 @@ input::-moz-placeholder {
|
|
|
2619
2012
|
line-height: 1.625;
|
|
2620
2013
|
}
|
|
2621
2014
|
|
|
2622
|
-
.
|
|
2623
|
-
border-color:
|
|
2624
|
-
box-shadow: 0 0 0 0 rgba(
|
|
2625
|
-
color:
|
|
2015
|
+
.input_error {
|
|
2016
|
+
border-color: hsl(0, 80%, 50%);
|
|
2017
|
+
box-shadow: 0 0 0 0 rgba(230, 26, 26, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2018
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
2626
2019
|
}
|
|
2627
|
-
.
|
|
2628
|
-
border-color:
|
|
2020
|
+
.input_error:hover {
|
|
2021
|
+
border-color: hsl(0, 80%, 50%);
|
|
2629
2022
|
}
|
|
2630
|
-
.
|
|
2631
|
-
border-color:
|
|
2632
|
-
box-shadow: 0 0 0 0.2rem rgba(
|
|
2633
|
-
}
|
|
2634
|
-
|
|
2635
|
-
.input_state_success {
|
|
2636
|
-
border-color: #4caf50;
|
|
2637
|
-
box-shadow: 0 0 0 0 rgba(76, 175, 80, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2638
|
-
color: #212121;
|
|
2639
|
-
}
|
|
2640
|
-
.input_state_success:hover {
|
|
2641
|
-
border-color: #4caf50;
|
|
2642
|
-
}
|
|
2643
|
-
.input_state_success:focus {
|
|
2644
|
-
border-color: #4caf50;
|
|
2645
|
-
box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2646
|
-
}
|
|
2647
|
-
|
|
2648
|
-
.input_state_caution {
|
|
2649
|
-
border-color: #ff9800;
|
|
2650
|
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2651
|
-
color: #212121;
|
|
2652
|
-
}
|
|
2653
|
-
.input_state_caution:hover {
|
|
2654
|
-
border-color: #ff9800;
|
|
2655
|
-
}
|
|
2656
|
-
.input_state_caution:focus {
|
|
2657
|
-
border-color: #ff9800;
|
|
2658
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2659
|
-
}
|
|
2660
|
-
|
|
2661
|
-
.input_state_danger {
|
|
2662
|
-
border-color: #f44336;
|
|
2663
|
-
box-shadow: 0 0 0 0 rgba(244, 67, 54, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2664
|
-
color: #212121;
|
|
2665
|
-
}
|
|
2666
|
-
.input_state_danger:hover {
|
|
2667
|
-
border-color: #f44336;
|
|
2668
|
-
}
|
|
2669
|
-
.input_state_danger:focus {
|
|
2670
|
-
border-color: #f44336;
|
|
2671
|
-
box-shadow: 0 0 0 0.2rem rgba(244, 67, 54, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2023
|
+
.input_error:focus {
|
|
2024
|
+
border-color: hsl(0, 80%, 50%);
|
|
2025
|
+
box-shadow: 0 0 0 0.2rem rgba(230, 26, 26, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2672
2026
|
}
|
|
2673
2027
|
|
|
2674
2028
|
.input_type_select {
|
|
2675
2029
|
padding-right: 2em;
|
|
2676
|
-
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" fill="%
|
|
2030
|
+
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" fill="%23667C99"><polyline points="0 8 3.5 12 7 8"></polyline><polyline points="0 4 3.5 0 7 4"></polyline></svg>');
|
|
2677
2031
|
background-repeat: no-repeat;
|
|
2678
2032
|
background-position: 100% center;
|
|
2679
2033
|
cursor: pointer;
|
|
2680
2034
|
}
|
|
2681
2035
|
.input_type_select:read-only {
|
|
2682
|
-
background-color:
|
|
2036
|
+
background-color: white;
|
|
2683
2037
|
}
|
|
2684
2038
|
.input_type_select:disabled {
|
|
2685
|
-
background-color:
|
|
2039
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
2686
2040
|
}
|
|
2687
2041
|
|
|
2688
2042
|
.input_type_textarea {
|
|
@@ -3061,32 +2415,32 @@ input::-moz-placeholder {
|
|
|
3061
2415
|
margin-left: 0;
|
|
3062
2416
|
}
|
|
3063
2417
|
.media_gap_none.media_stack_xs > * + *,
|
|
3064
|
-
.media_gap-y_none.media_stack_xs > * + * {
|
|
2418
|
+
.media_gap-y_none.media_stack_xs > * + * {
|
|
3065
2419
|
margin-top: 0;
|
|
3066
2420
|
margin-left: 0;
|
|
3067
2421
|
}
|
|
3068
2422
|
.media_gap_xs.media_stack_xs > * + *,
|
|
3069
|
-
.media_gap-y_xs.media_stack_xs > * + * {
|
|
2423
|
+
.media_gap-y_xs.media_stack_xs > * + * {
|
|
3070
2424
|
margin-top: 0.5em;
|
|
3071
2425
|
margin-left: 0;
|
|
3072
2426
|
}
|
|
3073
2427
|
.media_gap_sm.media_stack_xs > * + *,
|
|
3074
|
-
.media_gap-y_sm.media_stack_xs > * + * {
|
|
2428
|
+
.media_gap-y_sm.media_stack_xs > * + * {
|
|
3075
2429
|
margin-top: 1em;
|
|
3076
2430
|
margin-left: 0;
|
|
3077
2431
|
}
|
|
3078
2432
|
.media_gap_md.media_stack_xs > * + *,
|
|
3079
|
-
.media_gap-y_md.media_stack_xs > * + * {
|
|
2433
|
+
.media_gap-y_md.media_stack_xs > * + * {
|
|
3080
2434
|
margin-top: 1.5em;
|
|
3081
2435
|
margin-left: 0;
|
|
3082
2436
|
}
|
|
3083
2437
|
.media_gap_lg.media_stack_xs > * + *,
|
|
3084
|
-
.media_gap-y_lg.media_stack_xs > * + * {
|
|
2438
|
+
.media_gap-y_lg.media_stack_xs > * + * {
|
|
3085
2439
|
margin-top: 2em;
|
|
3086
2440
|
margin-left: 0;
|
|
3087
2441
|
}
|
|
3088
2442
|
.media_gap_xl.media_stack_xs > * + *,
|
|
3089
|
-
.media_gap-y_xl.media_stack_xs > * + * {
|
|
2443
|
+
.media_gap-y_xl.media_stack_xs > * + * {
|
|
3090
2444
|
margin-top: 3em;
|
|
3091
2445
|
margin-left: 0;
|
|
3092
2446
|
}
|
|
@@ -3097,32 +2451,32 @@ input::-moz-placeholder {
|
|
|
3097
2451
|
margin-left: 0;
|
|
3098
2452
|
}
|
|
3099
2453
|
.media_gap_none.media_stack_sm > * + *,
|
|
3100
|
-
.media_gap-y_none.media_stack_sm > * + * {
|
|
2454
|
+
.media_gap-y_none.media_stack_sm > * + * {
|
|
3101
2455
|
margin-top: 0;
|
|
3102
2456
|
margin-left: 0;
|
|
3103
2457
|
}
|
|
3104
2458
|
.media_gap_xs.media_stack_sm > * + *,
|
|
3105
|
-
.media_gap-y_xs.media_stack_sm > * + * {
|
|
2459
|
+
.media_gap-y_xs.media_stack_sm > * + * {
|
|
3106
2460
|
margin-top: 0.5em;
|
|
3107
2461
|
margin-left: 0;
|
|
3108
2462
|
}
|
|
3109
2463
|
.media_gap_sm.media_stack_sm > * + *,
|
|
3110
|
-
.media_gap-y_sm.media_stack_sm > * + * {
|
|
2464
|
+
.media_gap-y_sm.media_stack_sm > * + * {
|
|
3111
2465
|
margin-top: 1em;
|
|
3112
2466
|
margin-left: 0;
|
|
3113
2467
|
}
|
|
3114
2468
|
.media_gap_md.media_stack_sm > * + *,
|
|
3115
|
-
.media_gap-y_md.media_stack_sm > * + * {
|
|
2469
|
+
.media_gap-y_md.media_stack_sm > * + * {
|
|
3116
2470
|
margin-top: 1.5em;
|
|
3117
2471
|
margin-left: 0;
|
|
3118
2472
|
}
|
|
3119
2473
|
.media_gap_lg.media_stack_sm > * + *,
|
|
3120
|
-
.media_gap-y_lg.media_stack_sm > * + * {
|
|
2474
|
+
.media_gap-y_lg.media_stack_sm > * + * {
|
|
3121
2475
|
margin-top: 2em;
|
|
3122
2476
|
margin-left: 0;
|
|
3123
2477
|
}
|
|
3124
2478
|
.media_gap_xl.media_stack_sm > * + *,
|
|
3125
|
-
.media_gap-y_xl.media_stack_sm > * + * {
|
|
2479
|
+
.media_gap-y_xl.media_stack_sm > * + * {
|
|
3126
2480
|
margin-top: 3em;
|
|
3127
2481
|
margin-left: 0;
|
|
3128
2482
|
}
|
|
@@ -3133,32 +2487,32 @@ input::-moz-placeholder {
|
|
|
3133
2487
|
margin-left: 0;
|
|
3134
2488
|
}
|
|
3135
2489
|
.media_gap_none.media_stack_md > * + *,
|
|
3136
|
-
.media_gap-y_none.media_stack_md > * + * {
|
|
2490
|
+
.media_gap-y_none.media_stack_md > * + * {
|
|
3137
2491
|
margin-top: 0;
|
|
3138
2492
|
margin-left: 0;
|
|
3139
2493
|
}
|
|
3140
2494
|
.media_gap_xs.media_stack_md > * + *,
|
|
3141
|
-
.media_gap-y_xs.media_stack_md > * + * {
|
|
2495
|
+
.media_gap-y_xs.media_stack_md > * + * {
|
|
3142
2496
|
margin-top: 0.5em;
|
|
3143
2497
|
margin-left: 0;
|
|
3144
2498
|
}
|
|
3145
2499
|
.media_gap_sm.media_stack_md > * + *,
|
|
3146
|
-
.media_gap-y_sm.media_stack_md > * + * {
|
|
2500
|
+
.media_gap-y_sm.media_stack_md > * + * {
|
|
3147
2501
|
margin-top: 1em;
|
|
3148
2502
|
margin-left: 0;
|
|
3149
2503
|
}
|
|
3150
2504
|
.media_gap_md.media_stack_md > * + *,
|
|
3151
|
-
.media_gap-y_md.media_stack_md > * + * {
|
|
2505
|
+
.media_gap-y_md.media_stack_md > * + * {
|
|
3152
2506
|
margin-top: 1.5em;
|
|
3153
2507
|
margin-left: 0;
|
|
3154
2508
|
}
|
|
3155
2509
|
.media_gap_lg.media_stack_md > * + *,
|
|
3156
|
-
.media_gap-y_lg.media_stack_md > * + * {
|
|
2510
|
+
.media_gap-y_lg.media_stack_md > * + * {
|
|
3157
2511
|
margin-top: 2em;
|
|
3158
2512
|
margin-left: 0;
|
|
3159
2513
|
}
|
|
3160
2514
|
.media_gap_xl.media_stack_md > * + *,
|
|
3161
|
-
.media_gap-y_xl.media_stack_md > * + * {
|
|
2515
|
+
.media_gap-y_xl.media_stack_md > * + * {
|
|
3162
2516
|
margin-top: 3em;
|
|
3163
2517
|
margin-left: 0;
|
|
3164
2518
|
}
|
|
@@ -3169,32 +2523,32 @@ input::-moz-placeholder {
|
|
|
3169
2523
|
margin-left: 0;
|
|
3170
2524
|
}
|
|
3171
2525
|
.media_gap_none.media_stack_lg > * + *,
|
|
3172
|
-
.media_gap-y_none.media_stack_lg > * + * {
|
|
2526
|
+
.media_gap-y_none.media_stack_lg > * + * {
|
|
3173
2527
|
margin-top: 0;
|
|
3174
2528
|
margin-left: 0;
|
|
3175
2529
|
}
|
|
3176
2530
|
.media_gap_xs.media_stack_lg > * + *,
|
|
3177
|
-
.media_gap-y_xs.media_stack_lg > * + * {
|
|
2531
|
+
.media_gap-y_xs.media_stack_lg > * + * {
|
|
3178
2532
|
margin-top: 0.5em;
|
|
3179
2533
|
margin-left: 0;
|
|
3180
2534
|
}
|
|
3181
2535
|
.media_gap_sm.media_stack_lg > * + *,
|
|
3182
|
-
.media_gap-y_sm.media_stack_lg > * + * {
|
|
2536
|
+
.media_gap-y_sm.media_stack_lg > * + * {
|
|
3183
2537
|
margin-top: 1em;
|
|
3184
2538
|
margin-left: 0;
|
|
3185
2539
|
}
|
|
3186
2540
|
.media_gap_md.media_stack_lg > * + *,
|
|
3187
|
-
.media_gap-y_md.media_stack_lg > * + * {
|
|
2541
|
+
.media_gap-y_md.media_stack_lg > * + * {
|
|
3188
2542
|
margin-top: 1.5em;
|
|
3189
2543
|
margin-left: 0;
|
|
3190
2544
|
}
|
|
3191
2545
|
.media_gap_lg.media_stack_lg > * + *,
|
|
3192
|
-
.media_gap-y_lg.media_stack_lg > * + * {
|
|
2546
|
+
.media_gap-y_lg.media_stack_lg > * + * {
|
|
3193
2547
|
margin-top: 2em;
|
|
3194
2548
|
margin-left: 0;
|
|
3195
2549
|
}
|
|
3196
2550
|
.media_gap_xl.media_stack_lg > * + *,
|
|
3197
|
-
.media_gap-y_xl.media_stack_lg > * + * {
|
|
2551
|
+
.media_gap-y_xl.media_stack_lg > * + * {
|
|
3198
2552
|
margin-top: 3em;
|
|
3199
2553
|
margin-left: 0;
|
|
3200
2554
|
}
|
|
@@ -3205,32 +2559,32 @@ input::-moz-placeholder {
|
|
|
3205
2559
|
margin-left: 0;
|
|
3206
2560
|
}
|
|
3207
2561
|
.media_gap_none.media_stack_xl > * + *,
|
|
3208
|
-
.media_gap-y_none.media_stack_xl > * + * {
|
|
2562
|
+
.media_gap-y_none.media_stack_xl > * + * {
|
|
3209
2563
|
margin-top: 0;
|
|
3210
2564
|
margin-left: 0;
|
|
3211
2565
|
}
|
|
3212
2566
|
.media_gap_xs.media_stack_xl > * + *,
|
|
3213
|
-
.media_gap-y_xs.media_stack_xl > * + * {
|
|
2567
|
+
.media_gap-y_xs.media_stack_xl > * + * {
|
|
3214
2568
|
margin-top: 0.5em;
|
|
3215
2569
|
margin-left: 0;
|
|
3216
2570
|
}
|
|
3217
2571
|
.media_gap_sm.media_stack_xl > * + *,
|
|
3218
|
-
.media_gap-y_sm.media_stack_xl > * + * {
|
|
2572
|
+
.media_gap-y_sm.media_stack_xl > * + * {
|
|
3219
2573
|
margin-top: 1em;
|
|
3220
2574
|
margin-left: 0;
|
|
3221
2575
|
}
|
|
3222
2576
|
.media_gap_md.media_stack_xl > * + *,
|
|
3223
|
-
.media_gap-y_md.media_stack_xl > * + * {
|
|
2577
|
+
.media_gap-y_md.media_stack_xl > * + * {
|
|
3224
2578
|
margin-top: 1.5em;
|
|
3225
2579
|
margin-left: 0;
|
|
3226
2580
|
}
|
|
3227
2581
|
.media_gap_lg.media_stack_xl > * + *,
|
|
3228
|
-
.media_gap-y_lg.media_stack_xl > * + * {
|
|
2582
|
+
.media_gap-y_lg.media_stack_xl > * + * {
|
|
3229
2583
|
margin-top: 2em;
|
|
3230
2584
|
margin-left: 0;
|
|
3231
2585
|
}
|
|
3232
2586
|
.media_gap_xl.media_stack_xl > * + *,
|
|
3233
|
-
.media_gap-y_xl.media_stack_xl > * + * {
|
|
2587
|
+
.media_gap-y_xl.media_stack_xl > * + * {
|
|
3234
2588
|
margin-top: 3em;
|
|
3235
2589
|
margin-left: 0;
|
|
3236
2590
|
}
|
|
@@ -3254,7 +2608,7 @@ input::-moz-placeholder {
|
|
|
3254
2608
|
width: auto;
|
|
3255
2609
|
height: 1px;
|
|
3256
2610
|
margin: 0.5em 0;
|
|
3257
|
-
background: rgba(0, 0, 0, 0.1);
|
|
2611
|
+
background: var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
3258
2612
|
}
|
|
3259
2613
|
.menu__sep:first-child {
|
|
3260
2614
|
margin-top: 0;
|
|
@@ -3274,7 +2628,7 @@ input::-moz-placeholder {
|
|
|
3274
2628
|
padding: 0.5em 1em;
|
|
3275
2629
|
border-radius: 0.25rem;
|
|
3276
2630
|
background: none;
|
|
3277
|
-
color:
|
|
2631
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
3278
2632
|
white-space: normal;
|
|
3279
2633
|
}
|
|
3280
2634
|
.menu__action > * {
|
|
@@ -3298,21 +2652,21 @@ input::-moz-placeholder {
|
|
|
3298
2652
|
}
|
|
3299
2653
|
.menu__action.is-active, .menu__action.is-active[disabled] {
|
|
3300
2654
|
background: none;
|
|
3301
|
-
color:
|
|
2655
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3302
2656
|
cursor: pointer;
|
|
3303
2657
|
}
|
|
3304
2658
|
.menu__action.is-active:hover, .menu__action.is-active:focus, .menu__action.is-active:active, .menu__action.is-active[disabled]:hover, .menu__action.is-active[disabled]:focus, .menu__action.is-active[disabled]:active {
|
|
3305
2659
|
background: none;
|
|
3306
|
-
color:
|
|
2660
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3307
2661
|
}
|
|
3308
2662
|
.menu__action.is-disabled, .menu__action[disabled] {
|
|
3309
2663
|
background: none;
|
|
3310
|
-
color:
|
|
2664
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
3311
2665
|
cursor: default;
|
|
3312
2666
|
}
|
|
3313
2667
|
.menu__action.is-disabled:hover, .menu__action.is-disabled:focus, .menu__action.is-disabled:active, .menu__action[disabled]:hover, .menu__action[disabled]:focus, .menu__action[disabled]:active {
|
|
3314
2668
|
background: none;
|
|
3315
|
-
color:
|
|
2669
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
3316
2670
|
}
|
|
3317
2671
|
|
|
3318
2672
|
.menu__text {
|
|
@@ -3511,42 +2865,10 @@ input::-moz-placeholder {
|
|
|
3511
2865
|
margin-right: 0;
|
|
3512
2866
|
}
|
|
3513
2867
|
.menu_inline_xl .menu__action {
|
|
3514
|
-
justify-content: center;
|
|
3515
|
-
white-space: nowrap;
|
|
3516
|
-
}
|
|
3517
|
-
}
|
|
3518
|
-
.menu_invert .menu__sep {
|
|
3519
|
-
background: rgba(255, 255, 255, 0.1);
|
|
3520
|
-
}
|
|
3521
|
-
.menu_invert .menu__action {
|
|
3522
|
-
color: #fff;
|
|
3523
|
-
}
|
|
3524
|
-
.menu_invert .menu__action:hover {
|
|
3525
|
-
background: rgba(255, 255, 255, 0.05);
|
|
3526
|
-
}
|
|
3527
|
-
.menu_invert .menu__action:focus {
|
|
3528
|
-
background: rgba(255, 255, 255, 0.05);
|
|
3529
|
-
}
|
|
3530
|
-
.menu_invert .menu__action:active {
|
|
3531
|
-
background: rgba(255, 255, 255, 0.1);
|
|
3532
|
-
}
|
|
3533
|
-
.menu_invert .menu__action.is-active, .menu_invert .menu__action.is-active[disabled] {
|
|
3534
|
-
background: none;
|
|
3535
|
-
color: #00bcd4;
|
|
3536
|
-
}
|
|
3537
|
-
.menu_invert .menu__action.is-active:hover, .menu_invert .menu__action.is-active:focus, .menu_invert .menu__action.is-active:active, .menu_invert .menu__action.is-active[disabled]:hover, .menu_invert .menu__action.is-active[disabled]:focus, .menu_invert .menu__action.is-active[disabled]:active {
|
|
3538
|
-
background: none;
|
|
3539
|
-
color: #00bcd4;
|
|
3540
|
-
}
|
|
3541
|
-
.menu_invert .menu__action.is-disabled, .menu_invert .menu__action[disabled] {
|
|
3542
|
-
background: none;
|
|
3543
|
-
color: rgba(255, 255, 255, 0.5);
|
|
3544
|
-
}
|
|
3545
|
-
.menu_invert .menu__action.is-disabled:hover, .menu_invert .menu__action.is-disabled:focus, .menu_invert .menu__action.is-disabled:active, .menu_invert .menu__action[disabled]:hover, .menu_invert .menu__action[disabled]:focus, .menu_invert .menu__action[disabled]:active {
|
|
3546
|
-
background: none;
|
|
3547
|
-
color: rgba(255, 255, 255, 0.5);
|
|
2868
|
+
justify-content: center;
|
|
2869
|
+
white-space: nowrap;
|
|
2870
|
+
}
|
|
3548
2871
|
}
|
|
3549
|
-
|
|
3550
2872
|
.menu_size_sm {
|
|
3551
2873
|
font-size: 0.875rem;
|
|
3552
2874
|
line-height: 1.375;
|
|
@@ -3586,7 +2908,18 @@ input::-moz-placeholder {
|
|
|
3586
2908
|
width: 0;
|
|
3587
2909
|
height: 0;
|
|
3588
2910
|
overflow: hidden;
|
|
3589
|
-
|
|
2911
|
+
}
|
|
2912
|
+
.modal::before {
|
|
2913
|
+
content: "";
|
|
2914
|
+
position: absolute;
|
|
2915
|
+
top: 0;
|
|
2916
|
+
right: 0;
|
|
2917
|
+
bottom: 0;
|
|
2918
|
+
left: 0;
|
|
2919
|
+
width: 100%;
|
|
2920
|
+
height: 100%;
|
|
2921
|
+
background-color: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
2922
|
+
opacity: 0;
|
|
3590
2923
|
}
|
|
3591
2924
|
|
|
3592
2925
|
.modal__dialog {
|
|
@@ -3597,15 +2930,15 @@ input::-moz-placeholder {
|
|
|
3597
2930
|
transition-property: outline;
|
|
3598
2931
|
transition-duration: 0.3s;
|
|
3599
2932
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
3600
|
-
outline: 0 solid
|
|
3601
|
-
box-shadow: 0
|
|
2933
|
+
outline: 0 solid transparent;
|
|
2934
|
+
box-shadow: 0 12px 24px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
3602
2935
|
opacity: 0;
|
|
3603
2936
|
}
|
|
3604
2937
|
.modal__dialog:focus {
|
|
3605
|
-
outline: 4px solid
|
|
2938
|
+
outline: 4px solid var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3606
2939
|
}
|
|
3607
2940
|
.modal__dialog[role=alertdialog]:focus {
|
|
3608
|
-
outline: 4px solid
|
|
2941
|
+
outline: 4px solid var(--vb-important-50, hsl(0, 80%, 50%));
|
|
3609
2942
|
}
|
|
3610
2943
|
|
|
3611
2944
|
.modal.is-closed {
|
|
@@ -3621,9 +2954,9 @@ input::-moz-placeholder {
|
|
|
3621
2954
|
padding: 1em;
|
|
3622
2955
|
}
|
|
3623
2956
|
|
|
3624
|
-
.modal.is-opening,
|
|
3625
|
-
.modal.is-closing {
|
|
3626
|
-
transition:
|
|
2957
|
+
.modal.is-opening::before,
|
|
2958
|
+
.modal.is-closing::before {
|
|
2959
|
+
transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
3627
2960
|
}
|
|
3628
2961
|
.modal.is-opening .modal__dialog,
|
|
3629
2962
|
.modal.is-closing .modal__dialog {
|
|
@@ -3632,9 +2965,9 @@ input::-moz-placeholder {
|
|
|
3632
2965
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
3633
2966
|
}
|
|
3634
2967
|
|
|
3635
|
-
.modal.is-opening,
|
|
3636
|
-
.modal.is-opened {
|
|
3637
|
-
|
|
2968
|
+
.modal.is-opening::before,
|
|
2969
|
+
.modal.is-opened::before {
|
|
2970
|
+
opacity: 0.8;
|
|
3638
2971
|
}
|
|
3639
2972
|
.modal.is-opening .modal__dialog,
|
|
3640
2973
|
.modal.is-opened .modal__dialog {
|
|
@@ -3724,7 +3057,7 @@ input::-moz-placeholder {
|
|
|
3724
3057
|
.notice {
|
|
3725
3058
|
padding: 1em;
|
|
3726
3059
|
border-radius: 0.25rem;
|
|
3727
|
-
background:
|
|
3060
|
+
background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
3728
3061
|
}
|
|
3729
3062
|
.notice > * + * {
|
|
3730
3063
|
margin-top: 0.5em;
|
|
@@ -3736,28 +3069,24 @@ input::-moz-placeholder {
|
|
|
3736
3069
|
line-height: 1.625;
|
|
3737
3070
|
}
|
|
3738
3071
|
|
|
3739
|
-
.
|
|
3740
|
-
background-color:
|
|
3741
|
-
color:
|
|
3742
|
-
}
|
|
3743
|
-
|
|
3744
|
-
.notice_state_success {
|
|
3745
|
-
background-color: #e8f5e9;
|
|
3746
|
-
color: #1b5e20;
|
|
3072
|
+
.notice_theme_primary {
|
|
3073
|
+
background-color: var(--vb-primary-90, hsl(152, 60%, 90%));
|
|
3074
|
+
color: var(--vb-primary-30, hsl(152, 60%, 30%));
|
|
3747
3075
|
}
|
|
3748
3076
|
|
|
3749
|
-
.
|
|
3750
|
-
background-color:
|
|
3751
|
-
color:
|
|
3077
|
+
.notice_theme_secondary {
|
|
3078
|
+
background-color: var(--vb-secondary-90, hsl(214, 50%, 90%));
|
|
3079
|
+
color: var(--vb-secondary-30, hsl(214, 50%, 30%));
|
|
3752
3080
|
}
|
|
3753
3081
|
|
|
3754
|
-
.
|
|
3755
|
-
background-color:
|
|
3756
|
-
color:
|
|
3082
|
+
.notice_theme_neutral {
|
|
3083
|
+
background-color: var(--vb-neutral-90, hsl(214, 20%, 90%));
|
|
3084
|
+
color: var(--vb-neutral-30, hsl(214, 20%, 30%));
|
|
3757
3085
|
}
|
|
3758
3086
|
|
|
3759
|
-
|
|
3760
|
-
--
|
|
3087
|
+
.notice_theme_important {
|
|
3088
|
+
background-color: var(--vb-important-90, hsl(0, 80%, 90%));
|
|
3089
|
+
color: var(--vb-important-30, hsl(0, 80%, 30%));
|
|
3761
3090
|
}
|
|
3762
3091
|
|
|
3763
3092
|
:root {
|
|
@@ -3778,9 +3107,9 @@ input::-moz-placeholder {
|
|
|
3778
3107
|
margin: calc(var(--vb-popover-offset) * 1px) 0 0;
|
|
3779
3108
|
padding: 0.5em;
|
|
3780
3109
|
border-radius: 0.25rem;
|
|
3781
|
-
background:
|
|
3110
|
+
background: white;
|
|
3782
3111
|
background-clip: padding-box;
|
|
3783
|
-
box-shadow: 0
|
|
3112
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
3784
3113
|
font-size: 0.875rem;
|
|
3785
3114
|
}
|
|
3786
3115
|
.popover::before {
|
|
@@ -3863,7 +3192,7 @@ input::-moz-placeholder {
|
|
|
3863
3192
|
content: "";
|
|
3864
3193
|
visibility: visible;
|
|
3865
3194
|
transform: rotate(45deg);
|
|
3866
|
-
border: var(--vb-popover-arrow-border, 1px solid rgba(0, 0, 0, 0.
|
|
3195
|
+
border: var(--vb-popover-arrow-border, 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)));
|
|
3867
3196
|
border-right-color: transparent;
|
|
3868
3197
|
border-bottom-color: transparent;
|
|
3869
3198
|
background-clip: padding-box;
|
|
@@ -3917,8 +3246,8 @@ input::-moz-placeholder {
|
|
|
3917
3246
|
width: auto;
|
|
3918
3247
|
max-width: 16rem;
|
|
3919
3248
|
padding: 0.5rem 0.75rem;
|
|
3920
|
-
background:
|
|
3921
|
-
color:
|
|
3249
|
+
background: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
3250
|
+
color: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
3922
3251
|
font-size: 0.75em;
|
|
3923
3252
|
}
|
|
3924
3253
|
|
|
@@ -3949,9 +3278,9 @@ input::-moz-placeholder {
|
|
|
3949
3278
|
display: flex;
|
|
3950
3279
|
align-items: center;
|
|
3951
3280
|
justify-content: center;
|
|
3952
|
-
border: 2px solid
|
|
3281
|
+
border: 2px solid var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
3953
3282
|
border-radius: 20px;
|
|
3954
|
-
background-color:
|
|
3283
|
+
background-color: white;
|
|
3955
3284
|
color: transparent;
|
|
3956
3285
|
}
|
|
3957
3286
|
|
|
@@ -3959,7 +3288,7 @@ input::-moz-placeholder {
|
|
|
3959
3288
|
width: 0;
|
|
3960
3289
|
height: 0;
|
|
3961
3290
|
border-radius: 8px;
|
|
3962
|
-
background-color:
|
|
3291
|
+
background-color: white;
|
|
3963
3292
|
opacity: 0;
|
|
3964
3293
|
}
|
|
3965
3294
|
|
|
@@ -3974,26 +3303,26 @@ input::-moz-placeholder {
|
|
|
3974
3303
|
cursor: pointer;
|
|
3975
3304
|
}
|
|
3976
3305
|
.radio__native:hover + .radio__background {
|
|
3977
|
-
background-color: rgba(
|
|
3306
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
3978
3307
|
}
|
|
3979
3308
|
.radio__native:hover + .radio__background .radio__circle {
|
|
3980
|
-
border-color:
|
|
3309
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3981
3310
|
}
|
|
3982
3311
|
.radio__native:focus + .radio__background {
|
|
3983
|
-
background-color: rgba(
|
|
3312
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
3984
3313
|
}
|
|
3985
3314
|
.radio__native:focus + .radio__background .radio__circle {
|
|
3986
|
-
border-color:
|
|
3315
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3987
3316
|
}
|
|
3988
3317
|
.radio__native:focus-visible + .radio__background, .radio__native:active + .radio__background {
|
|
3989
|
-
background-color: rgba(
|
|
3318
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.2);
|
|
3990
3319
|
}
|
|
3991
3320
|
.radio__native:focus-visible + .radio__background .radio__circle, .radio__native:active + .radio__background .radio__circle {
|
|
3992
|
-
border-color:
|
|
3321
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3993
3322
|
}
|
|
3994
3323
|
.radio__native:checked + .radio__background .radio__circle {
|
|
3995
|
-
border-color:
|
|
3996
|
-
background-color:
|
|
3324
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3325
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3997
3326
|
}
|
|
3998
3327
|
.radio__native:checked + .radio__background .radio__dot {
|
|
3999
3328
|
width: 8px;
|
|
@@ -4076,7 +3405,7 @@ input::-moz-placeholder {
|
|
|
4076
3405
|
|
|
4077
3406
|
.section__screen {
|
|
4078
3407
|
z-index: 2;
|
|
4079
|
-
background:
|
|
3408
|
+
background: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
4080
3409
|
opacity: 0.7;
|
|
4081
3410
|
}
|
|
4082
3411
|
|
|
@@ -4187,9 +3516,9 @@ input::-moz-placeholder {
|
|
|
4187
3516
|
height: 20px;
|
|
4188
3517
|
position: relative;
|
|
4189
3518
|
display: block;
|
|
4190
|
-
border: 2px solid
|
|
3519
|
+
border: 2px solid var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4191
3520
|
border-radius: 9999px;
|
|
4192
|
-
background-color:
|
|
3521
|
+
background-color: var(--vb-neutral-80, hsl(214, 20%, 80%));
|
|
4193
3522
|
}
|
|
4194
3523
|
|
|
4195
3524
|
.switch__thumb {
|
|
@@ -4202,8 +3531,8 @@ input::-moz-placeholder {
|
|
|
4202
3531
|
display: block;
|
|
4203
3532
|
transition: left 0.15s cubic-bezier(0.4, 0, 0.2, 1);
|
|
4204
3533
|
border-radius: 9999px;
|
|
4205
|
-
background-color:
|
|
4206
|
-
box-shadow: 0 0 0 2px
|
|
3534
|
+
background-color: white;
|
|
3535
|
+
box-shadow: 0 0 0 2px var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4207
3536
|
}
|
|
4208
3537
|
|
|
4209
3538
|
.switch__native {
|
|
@@ -4217,33 +3546,33 @@ input::-moz-placeholder {
|
|
|
4217
3546
|
cursor: pointer;
|
|
4218
3547
|
}
|
|
4219
3548
|
.switch__native:hover + .switch__background::after {
|
|
4220
|
-
background-color: rgba(
|
|
3549
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
4221
3550
|
}
|
|
4222
3551
|
.switch__native:hover + .switch__background .switch__thumb {
|
|
4223
|
-
box-shadow: 0 0 0 2px
|
|
3552
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4224
3553
|
}
|
|
4225
3554
|
.switch__native:focus + .switch__background::after {
|
|
4226
|
-
background-color: rgba(
|
|
3555
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
4227
3556
|
}
|
|
4228
3557
|
.switch__native:focus + .switch__background .switch__thumb {
|
|
4229
|
-
box-shadow: 0 0 0 2px
|
|
3558
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4230
3559
|
}
|
|
4231
3560
|
.switch__native:focus-visible + .switch__background::after, .switch__native:active + .switch__background::after {
|
|
4232
|
-
background-color: rgba(
|
|
3561
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.2);
|
|
4233
3562
|
}
|
|
4234
3563
|
.switch__native:focus-visible + .switch__background .switch__thumb, .switch__native:active + .switch__background .switch__thumb {
|
|
4235
|
-
box-shadow: 0 0 0 2px
|
|
3564
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4236
3565
|
}
|
|
4237
3566
|
.switch__native:checked + .switch__background::after {
|
|
4238
3567
|
left: calc(100% - 1.875rem);
|
|
4239
3568
|
}
|
|
4240
3569
|
.switch__native:checked + .switch__background .switch__track {
|
|
4241
|
-
border-color:
|
|
4242
|
-
background-color:
|
|
3570
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3571
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4243
3572
|
}
|
|
4244
3573
|
.switch__native:checked + .switch__background .switch__thumb {
|
|
4245
3574
|
left: calc(100% - 16px);
|
|
4246
|
-
box-shadow: 0 0 0 2px
|
|
3575
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4247
3576
|
}
|
|
4248
3577
|
|
|
4249
3578
|
.switch_size_sm {
|
|
@@ -4267,23 +3596,23 @@ input::-moz-placeholder {
|
|
|
4267
3596
|
.switch_size_sm .switch__thumb {
|
|
4268
3597
|
width: 12px;
|
|
4269
3598
|
height: 12px;
|
|
4270
|
-
box-shadow: 0 0 0 2px
|
|
3599
|
+
box-shadow: 0 0 0 2px var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4271
3600
|
}
|
|
4272
3601
|
.switch_size_sm .switch__native:hover + .switch__background .switch__thumb {
|
|
4273
|
-
box-shadow: 0 0 0 2px
|
|
3602
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4274
3603
|
}
|
|
4275
3604
|
.switch_size_sm .switch__native:focus + .switch__background .switch__thumb {
|
|
4276
|
-
box-shadow: 0 0 0 2px
|
|
3605
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4277
3606
|
}
|
|
4278
3607
|
.switch_size_sm .switch__native:active + .switch__background .switch__thumb {
|
|
4279
|
-
box-shadow: 0 0 0 2px
|
|
3608
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4280
3609
|
}
|
|
4281
3610
|
.switch_size_sm .switch__native:checked + .switch__background::after {
|
|
4282
3611
|
left: calc(100% - 1.40625rem);
|
|
4283
3612
|
}
|
|
4284
3613
|
.switch_size_sm .switch__native:checked + .switch__background .switch__thumb {
|
|
4285
3614
|
left: calc(100% - 12px);
|
|
4286
|
-
box-shadow: 0 0 0 2px
|
|
3615
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4287
3616
|
}
|
|
4288
3617
|
|
|
4289
3618
|
.switch_size_lg {
|
|
@@ -4307,23 +3636,23 @@ input::-moz-placeholder {
|
|
|
4307
3636
|
.switch_size_lg .switch__thumb {
|
|
4308
3637
|
width: 21px;
|
|
4309
3638
|
height: 21px;
|
|
4310
|
-
box-shadow: 0 0 0 2.5px
|
|
3639
|
+
box-shadow: 0 0 0 2.5px var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4311
3640
|
}
|
|
4312
3641
|
.switch_size_lg .switch__native:hover + .switch__background .switch__thumb {
|
|
4313
|
-
box-shadow: 0 0 0 2.5px
|
|
3642
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4314
3643
|
}
|
|
4315
3644
|
.switch_size_lg .switch__native:focus + .switch__background .switch__thumb {
|
|
4316
|
-
box-shadow: 0 0 0 2.5px
|
|
3645
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4317
3646
|
}
|
|
4318
3647
|
.switch_size_lg .switch__native:active + .switch__background .switch__thumb {
|
|
4319
|
-
box-shadow: 0 0 0 2.5px
|
|
3648
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4320
3649
|
}
|
|
4321
3650
|
.switch_size_lg .switch__native:checked + .switch__background::after {
|
|
4322
3651
|
left: calc(100% - 2.34375rem);
|
|
4323
3652
|
}
|
|
4324
3653
|
.switch_size_lg .switch__native:checked + .switch__background .switch__thumb {
|
|
4325
3654
|
left: calc(100% - 21px);
|
|
4326
|
-
box-shadow: 0 0 0 2.5px
|
|
3655
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4327
3656
|
}
|
|
4328
3657
|
|
|
4329
3658
|
.table {
|
|
@@ -4361,7 +3690,7 @@ input::-moz-placeholder {
|
|
|
4361
3690
|
.table_hover tbody tr:hover,
|
|
4362
3691
|
.table_hover tbody tr:focus {
|
|
4363
3692
|
z-index: 2;
|
|
4364
|
-
background-color:
|
|
3693
|
+
background-color: hsla(53, 100%, 50%, 0.15);
|
|
4365
3694
|
}
|
|
4366
3695
|
|
|
4367
3696
|
.table_responsive thead,
|
|
@@ -4408,32 +3737,32 @@ input::-moz-placeholder {
|
|
|
4408
3737
|
padding: 0.648rem 1.5rem;
|
|
4409
3738
|
}
|
|
4410
3739
|
.table_responsive.table_style_bordered {
|
|
4411
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3740
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4412
3741
|
}
|
|
4413
3742
|
.table_responsive.table_style_bordered td {
|
|
4414
3743
|
border: none;
|
|
4415
3744
|
}
|
|
4416
3745
|
.table_responsive.table_style_bordered td + td,
|
|
4417
3746
|
.table_responsive.table_style_bordered th + td {
|
|
4418
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3747
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4419
3748
|
}
|
|
4420
3749
|
.table_responsive.table_style_bordered [data-mobile-label]::before {
|
|
4421
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3750
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4422
3751
|
}
|
|
4423
3752
|
.table_responsive.table_style_bordered tr + tr {
|
|
4424
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3753
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4425
3754
|
}
|
|
4426
3755
|
|
|
4427
3756
|
@media (max-width: 479px) {
|
|
4428
3757
|
.table_responsive_xs thead,
|
|
4429
|
-
.table_responsive_xs tbody,
|
|
4430
|
-
.table_responsive_xs tr,
|
|
4431
|
-
.table_responsive_xs th,
|
|
4432
|
-
.table_responsive_xs td {
|
|
3758
|
+
.table_responsive_xs tbody,
|
|
3759
|
+
.table_responsive_xs tr,
|
|
3760
|
+
.table_responsive_xs th,
|
|
3761
|
+
.table_responsive_xs td {
|
|
4433
3762
|
display: block;
|
|
4434
3763
|
}
|
|
4435
3764
|
.table_responsive_xs thead,
|
|
4436
|
-
.table_responsive_xs [rowspan] {
|
|
3765
|
+
.table_responsive_xs [rowspan] {
|
|
4437
3766
|
position: absolute;
|
|
4438
3767
|
top: -9999px;
|
|
4439
3768
|
left: -9999px;
|
|
@@ -4469,33 +3798,33 @@ input::-moz-placeholder {
|
|
|
4469
3798
|
padding: 0.648rem 1.5rem;
|
|
4470
3799
|
}
|
|
4471
3800
|
.table_responsive_xs.table_style_bordered {
|
|
4472
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3801
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4473
3802
|
}
|
|
4474
3803
|
.table_responsive_xs.table_style_bordered td {
|
|
4475
3804
|
border: none;
|
|
4476
3805
|
}
|
|
4477
3806
|
.table_responsive_xs.table_style_bordered td + td,
|
|
4478
|
-
.table_responsive_xs.table_style_bordered th + td {
|
|
4479
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3807
|
+
.table_responsive_xs.table_style_bordered th + td {
|
|
3808
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4480
3809
|
}
|
|
4481
3810
|
.table_responsive_xs.table_style_bordered [data-mobile-label]::before {
|
|
4482
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3811
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4483
3812
|
}
|
|
4484
3813
|
.table_responsive_xs.table_style_bordered tr + tr {
|
|
4485
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3814
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4486
3815
|
}
|
|
4487
3816
|
}
|
|
4488
3817
|
|
|
4489
3818
|
@media (max-width: 619px) {
|
|
4490
3819
|
.table_responsive_sm thead,
|
|
4491
|
-
.table_responsive_sm tbody,
|
|
4492
|
-
.table_responsive_sm tr,
|
|
4493
|
-
.table_responsive_sm th,
|
|
4494
|
-
.table_responsive_sm td {
|
|
3820
|
+
.table_responsive_sm tbody,
|
|
3821
|
+
.table_responsive_sm tr,
|
|
3822
|
+
.table_responsive_sm th,
|
|
3823
|
+
.table_responsive_sm td {
|
|
4495
3824
|
display: block;
|
|
4496
3825
|
}
|
|
4497
3826
|
.table_responsive_sm thead,
|
|
4498
|
-
.table_responsive_sm [rowspan] {
|
|
3827
|
+
.table_responsive_sm [rowspan] {
|
|
4499
3828
|
position: absolute;
|
|
4500
3829
|
top: -9999px;
|
|
4501
3830
|
left: -9999px;
|
|
@@ -4531,33 +3860,33 @@ input::-moz-placeholder {
|
|
|
4531
3860
|
padding: 0.648rem 1.5rem;
|
|
4532
3861
|
}
|
|
4533
3862
|
.table_responsive_sm.table_style_bordered {
|
|
4534
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3863
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4535
3864
|
}
|
|
4536
3865
|
.table_responsive_sm.table_style_bordered td {
|
|
4537
3866
|
border: none;
|
|
4538
3867
|
}
|
|
4539
3868
|
.table_responsive_sm.table_style_bordered td + td,
|
|
4540
|
-
.table_responsive_sm.table_style_bordered th + td {
|
|
4541
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3869
|
+
.table_responsive_sm.table_style_bordered th + td {
|
|
3870
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4542
3871
|
}
|
|
4543
3872
|
.table_responsive_sm.table_style_bordered [data-mobile-label]::before {
|
|
4544
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3873
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4545
3874
|
}
|
|
4546
3875
|
.table_responsive_sm.table_style_bordered tr + tr {
|
|
4547
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3876
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4548
3877
|
}
|
|
4549
3878
|
}
|
|
4550
3879
|
|
|
4551
3880
|
@media (max-width: 759px) {
|
|
4552
3881
|
.table_responsive_md thead,
|
|
4553
|
-
.table_responsive_md tbody,
|
|
4554
|
-
.table_responsive_md tr,
|
|
4555
|
-
.table_responsive_md th,
|
|
4556
|
-
.table_responsive_md td {
|
|
3882
|
+
.table_responsive_md tbody,
|
|
3883
|
+
.table_responsive_md tr,
|
|
3884
|
+
.table_responsive_md th,
|
|
3885
|
+
.table_responsive_md td {
|
|
4557
3886
|
display: block;
|
|
4558
3887
|
}
|
|
4559
3888
|
.table_responsive_md thead,
|
|
4560
|
-
.table_responsive_md [rowspan] {
|
|
3889
|
+
.table_responsive_md [rowspan] {
|
|
4561
3890
|
position: absolute;
|
|
4562
3891
|
top: -9999px;
|
|
4563
3892
|
left: -9999px;
|
|
@@ -4593,33 +3922,33 @@ input::-moz-placeholder {
|
|
|
4593
3922
|
padding: 0.648rem 1.5rem;
|
|
4594
3923
|
}
|
|
4595
3924
|
.table_responsive_md.table_style_bordered {
|
|
4596
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3925
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4597
3926
|
}
|
|
4598
3927
|
.table_responsive_md.table_style_bordered td {
|
|
4599
3928
|
border: none;
|
|
4600
3929
|
}
|
|
4601
3930
|
.table_responsive_md.table_style_bordered td + td,
|
|
4602
|
-
.table_responsive_md.table_style_bordered th + td {
|
|
4603
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3931
|
+
.table_responsive_md.table_style_bordered th + td {
|
|
3932
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4604
3933
|
}
|
|
4605
3934
|
.table_responsive_md.table_style_bordered [data-mobile-label]::before {
|
|
4606
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3935
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4607
3936
|
}
|
|
4608
3937
|
.table_responsive_md.table_style_bordered tr + tr {
|
|
4609
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3938
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4610
3939
|
}
|
|
4611
3940
|
}
|
|
4612
3941
|
|
|
4613
3942
|
@media (max-width: 989px) {
|
|
4614
3943
|
.table_responsive_lg thead,
|
|
4615
|
-
.table_responsive_lg tbody,
|
|
4616
|
-
.table_responsive_lg tr,
|
|
4617
|
-
.table_responsive_lg th,
|
|
4618
|
-
.table_responsive_lg td {
|
|
3944
|
+
.table_responsive_lg tbody,
|
|
3945
|
+
.table_responsive_lg tr,
|
|
3946
|
+
.table_responsive_lg th,
|
|
3947
|
+
.table_responsive_lg td {
|
|
4619
3948
|
display: block;
|
|
4620
3949
|
}
|
|
4621
3950
|
.table_responsive_lg thead,
|
|
4622
|
-
.table_responsive_lg [rowspan] {
|
|
3951
|
+
.table_responsive_lg [rowspan] {
|
|
4623
3952
|
position: absolute;
|
|
4624
3953
|
top: -9999px;
|
|
4625
3954
|
left: -9999px;
|
|
@@ -4655,33 +3984,33 @@ input::-moz-placeholder {
|
|
|
4655
3984
|
padding: 0.648rem 1.5rem;
|
|
4656
3985
|
}
|
|
4657
3986
|
.table_responsive_lg.table_style_bordered {
|
|
4658
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3987
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4659
3988
|
}
|
|
4660
3989
|
.table_responsive_lg.table_style_bordered td {
|
|
4661
3990
|
border: none;
|
|
4662
3991
|
}
|
|
4663
3992
|
.table_responsive_lg.table_style_bordered td + td,
|
|
4664
|
-
.table_responsive_lg.table_style_bordered th + td {
|
|
4665
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3993
|
+
.table_responsive_lg.table_style_bordered th + td {
|
|
3994
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4666
3995
|
}
|
|
4667
3996
|
.table_responsive_lg.table_style_bordered [data-mobile-label]::before {
|
|
4668
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3997
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4669
3998
|
}
|
|
4670
3999
|
.table_responsive_lg.table_style_bordered tr + tr {
|
|
4671
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
4000
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4672
4001
|
}
|
|
4673
4002
|
}
|
|
4674
4003
|
|
|
4675
4004
|
@media (max-width: 1379px) {
|
|
4676
4005
|
.table_responsive_xl thead,
|
|
4677
|
-
.table_responsive_xl tbody,
|
|
4678
|
-
.table_responsive_xl tr,
|
|
4679
|
-
.table_responsive_xl th,
|
|
4680
|
-
.table_responsive_xl td {
|
|
4006
|
+
.table_responsive_xl tbody,
|
|
4007
|
+
.table_responsive_xl tr,
|
|
4008
|
+
.table_responsive_xl th,
|
|
4009
|
+
.table_responsive_xl td {
|
|
4681
4010
|
display: block;
|
|
4682
4011
|
}
|
|
4683
4012
|
.table_responsive_xl thead,
|
|
4684
|
-
.table_responsive_xl [rowspan] {
|
|
4013
|
+
.table_responsive_xl [rowspan] {
|
|
4685
4014
|
position: absolute;
|
|
4686
4015
|
top: -9999px;
|
|
4687
4016
|
left: -9999px;
|
|
@@ -4717,20 +4046,20 @@ input::-moz-placeholder {
|
|
|
4717
4046
|
padding: 0.648rem 1.5rem;
|
|
4718
4047
|
}
|
|
4719
4048
|
.table_responsive_xl.table_style_bordered {
|
|
4720
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
4049
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4721
4050
|
}
|
|
4722
4051
|
.table_responsive_xl.table_style_bordered td {
|
|
4723
4052
|
border: none;
|
|
4724
4053
|
}
|
|
4725
4054
|
.table_responsive_xl.table_style_bordered td + td,
|
|
4726
|
-
.table_responsive_xl.table_style_bordered th + td {
|
|
4727
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
4055
|
+
.table_responsive_xl.table_style_bordered th + td {
|
|
4056
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4728
4057
|
}
|
|
4729
4058
|
.table_responsive_xl.table_style_bordered [data-mobile-label]::before {
|
|
4730
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
4059
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4731
4060
|
}
|
|
4732
4061
|
.table_responsive_xl.table_style_bordered tr + tr {
|
|
4733
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
4062
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4734
4063
|
}
|
|
4735
4064
|
}
|
|
4736
4065
|
|
|
@@ -4747,22 +4076,22 @@ input::-moz-placeholder {
|
|
|
4747
4076
|
}
|
|
4748
4077
|
|
|
4749
4078
|
.table_style_rowed {
|
|
4750
|
-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
4079
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4751
4080
|
}
|
|
4752
4081
|
.table_style_rowed tr {
|
|
4753
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
4082
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4754
4083
|
}
|
|
4755
4084
|
|
|
4756
4085
|
.table_style_bordered th,
|
|
4757
4086
|
.table_style_bordered td {
|
|
4758
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
4087
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4759
4088
|
}
|
|
4760
4089
|
|
|
4761
4090
|
.table_zebra thead tr {
|
|
4762
|
-
background-color:
|
|
4091
|
+
background-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 50%, 3%);
|
|
4763
4092
|
}
|
|
4764
4093
|
.table_zebra tr:nth-child(even) {
|
|
4765
|
-
background-color:
|
|
4094
|
+
background-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 50%, 3%);
|
|
4766
4095
|
}
|
|
4767
4096
|
|
|
4768
4097
|
.background-clip-border {
|
|
@@ -4777,516 +4106,664 @@ input::-moz-placeholder {
|
|
|
4777
4106
|
background-clip: padding-box !important;
|
|
4778
4107
|
}
|
|
4779
4108
|
|
|
4109
|
+
.background {
|
|
4110
|
+
background-color: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%))) !important;
|
|
4111
|
+
}
|
|
4112
|
+
|
|
4113
|
+
.background-dark {
|
|
4114
|
+
background-color: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%))) !important;
|
|
4115
|
+
}
|
|
4116
|
+
|
|
4117
|
+
.background-darker {
|
|
4118
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%))) !important;
|
|
4119
|
+
}
|
|
4120
|
+
|
|
4780
4121
|
.background-black {
|
|
4781
|
-
background-color:
|
|
4122
|
+
background-color: black !important;
|
|
4782
4123
|
}
|
|
4783
4124
|
|
|
4784
4125
|
.background-white {
|
|
4785
|
-
background-color:
|
|
4126
|
+
background-color: white !important;
|
|
4786
4127
|
}
|
|
4787
4128
|
|
|
4788
4129
|
.background-transparent {
|
|
4789
4130
|
background-color: transparent !important;
|
|
4790
4131
|
}
|
|
4791
4132
|
|
|
4792
|
-
.background-primary
|
|
4793
|
-
background-color:
|
|
4133
|
+
.background-primary {
|
|
4134
|
+
background-color: var(--vb-primary) !important;
|
|
4794
4135
|
}
|
|
4795
4136
|
|
|
4796
|
-
.background-primary-
|
|
4797
|
-
background-color:
|
|
4137
|
+
.background-primary-0 {
|
|
4138
|
+
background-color: var(--vb-primary-0, hsl(152, 60%, 0%)) !important;
|
|
4798
4139
|
}
|
|
4799
4140
|
|
|
4800
|
-
.background-primary {
|
|
4801
|
-
background-color:
|
|
4141
|
+
.background-primary-10 {
|
|
4142
|
+
background-color: var(--vb-primary-10, hsl(152, 60%, 10%)) !important;
|
|
4143
|
+
}
|
|
4144
|
+
|
|
4145
|
+
.background-primary-20 {
|
|
4146
|
+
background-color: var(--vb-primary-20, hsl(152, 60%, 20%)) !important;
|
|
4802
4147
|
}
|
|
4803
4148
|
|
|
4804
|
-
.background-primary-
|
|
4805
|
-
background-color:
|
|
4149
|
+
.background-primary-30 {
|
|
4150
|
+
background-color: var(--vb-primary-30, hsl(152, 60%, 30%)) !important;
|
|
4806
4151
|
}
|
|
4807
4152
|
|
|
4808
|
-
.background-primary-
|
|
4809
|
-
background-color:
|
|
4153
|
+
.background-primary-40 {
|
|
4154
|
+
background-color: var(--vb-primary-40, hsl(152, 60%, 40%)) !important;
|
|
4810
4155
|
}
|
|
4811
4156
|
|
|
4812
|
-
.background-
|
|
4813
|
-
background-color:
|
|
4157
|
+
.background-primary-50 {
|
|
4158
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%)) !important;
|
|
4814
4159
|
}
|
|
4815
4160
|
|
|
4816
|
-
.background-
|
|
4817
|
-
background-color:
|
|
4161
|
+
.background-primary-60 {
|
|
4162
|
+
background-color: var(--vb-primary-60, hsl(152, 60%, 60%)) !important;
|
|
4163
|
+
}
|
|
4164
|
+
|
|
4165
|
+
.background-primary-70 {
|
|
4166
|
+
background-color: var(--vb-primary-70, hsl(152, 60%, 70%)) !important;
|
|
4167
|
+
}
|
|
4168
|
+
|
|
4169
|
+
.background-primary-80 {
|
|
4170
|
+
background-color: var(--vb-primary-80, hsl(152, 60%, 80%)) !important;
|
|
4171
|
+
}
|
|
4172
|
+
|
|
4173
|
+
.background-primary-90 {
|
|
4174
|
+
background-color: var(--vb-primary-90, hsl(152, 60%, 90%)) !important;
|
|
4175
|
+
}
|
|
4176
|
+
|
|
4177
|
+
.background-primary-95 {
|
|
4178
|
+
background-color: var(--vb-primary-95, hsl(152, 60%, 95%)) !important;
|
|
4179
|
+
}
|
|
4180
|
+
|
|
4181
|
+
.background-primary-98 {
|
|
4182
|
+
background-color: var(--vb-primary-98, hsl(152, 60%, 98%)) !important;
|
|
4183
|
+
}
|
|
4184
|
+
|
|
4185
|
+
.background-primary-100 {
|
|
4186
|
+
background-color: var(--vb-primary-100, hsl(152, 60%, 100%)) !important;
|
|
4818
4187
|
}
|
|
4819
4188
|
|
|
4820
4189
|
.background-secondary {
|
|
4821
|
-
background-color:
|
|
4190
|
+
background-color: var(--vb-secondary) !important;
|
|
4822
4191
|
}
|
|
4823
4192
|
|
|
4824
|
-
.background-secondary-
|
|
4825
|
-
background-color:
|
|
4193
|
+
.background-secondary-0 {
|
|
4194
|
+
background-color: var(--vb-secondary-0, hsl(214, 50%, 0%)) !important;
|
|
4826
4195
|
}
|
|
4827
4196
|
|
|
4828
|
-
.background-secondary-
|
|
4829
|
-
background-color:
|
|
4197
|
+
.background-secondary-10 {
|
|
4198
|
+
background-color: var(--vb-secondary-10, hsl(214, 50%, 10%)) !important;
|
|
4830
4199
|
}
|
|
4831
4200
|
|
|
4832
|
-
.background-
|
|
4833
|
-
background-color:
|
|
4201
|
+
.background-secondary-20 {
|
|
4202
|
+
background-color: var(--vb-secondary-20, hsl(214, 50%, 20%)) !important;
|
|
4834
4203
|
}
|
|
4835
4204
|
|
|
4836
|
-
.background-
|
|
4837
|
-
background-color:
|
|
4205
|
+
.background-secondary-30 {
|
|
4206
|
+
background-color: var(--vb-secondary-30, hsl(214, 50%, 30%)) !important;
|
|
4838
4207
|
}
|
|
4839
4208
|
|
|
4840
|
-
.background-
|
|
4841
|
-
background-color:
|
|
4209
|
+
.background-secondary-40 {
|
|
4210
|
+
background-color: var(--vb-secondary-40, hsl(214, 50%, 40%)) !important;
|
|
4842
4211
|
}
|
|
4843
4212
|
|
|
4844
|
-
.background-
|
|
4845
|
-
background-color:
|
|
4213
|
+
.background-secondary-50 {
|
|
4214
|
+
background-color: var(--vb-secondary-50, hsl(214, 50%, 50%)) !important;
|
|
4846
4215
|
}
|
|
4847
4216
|
|
|
4848
|
-
.background-
|
|
4849
|
-
background-color:
|
|
4217
|
+
.background-secondary-60 {
|
|
4218
|
+
background-color: var(--vb-secondary-60, hsl(214, 50%, 60%)) !important;
|
|
4850
4219
|
}
|
|
4851
4220
|
|
|
4852
|
-
.background-
|
|
4853
|
-
background-color:
|
|
4221
|
+
.background-secondary-70 {
|
|
4222
|
+
background-color: var(--vb-secondary-70, hsl(214, 50%, 70%)) !important;
|
|
4854
4223
|
}
|
|
4855
4224
|
|
|
4856
|
-
.background-
|
|
4857
|
-
background-color:
|
|
4225
|
+
.background-secondary-80 {
|
|
4226
|
+
background-color: var(--vb-secondary-80, hsl(214, 50%, 80%)) !important;
|
|
4858
4227
|
}
|
|
4859
4228
|
|
|
4860
|
-
.background-
|
|
4861
|
-
background-color:
|
|
4229
|
+
.background-secondary-90 {
|
|
4230
|
+
background-color: var(--vb-secondary-90, hsl(214, 50%, 90%)) !important;
|
|
4862
4231
|
}
|
|
4863
4232
|
|
|
4864
|
-
.background-
|
|
4865
|
-
background-color:
|
|
4233
|
+
.background-secondary-95 {
|
|
4234
|
+
background-color: var(--vb-secondary-95, hsl(214, 50%, 95%)) !important;
|
|
4866
4235
|
}
|
|
4867
4236
|
|
|
4868
|
-
.background-
|
|
4869
|
-
background-color:
|
|
4237
|
+
.background-secondary-98 {
|
|
4238
|
+
background-color: var(--vb-secondary-98, hsl(214, 50%, 98%)) !important;
|
|
4870
4239
|
}
|
|
4871
4240
|
|
|
4872
|
-
.background-
|
|
4873
|
-
background-color:
|
|
4241
|
+
.background-secondary-100 {
|
|
4242
|
+
background-color: var(--vb-secondary-100, hsl(214, 50%, 100%)) !important;
|
|
4874
4243
|
}
|
|
4875
4244
|
|
|
4876
|
-
.background-
|
|
4877
|
-
background-color:
|
|
4245
|
+
.background-neutral {
|
|
4246
|
+
background-color: var(--vb-neutral) !important;
|
|
4878
4247
|
}
|
|
4879
4248
|
|
|
4880
|
-
.background-
|
|
4881
|
-
background-color:
|
|
4249
|
+
.background-neutral-0 {
|
|
4250
|
+
background-color: var(--vb-neutral-0, hsl(214, 20%, 0%)) !important;
|
|
4882
4251
|
}
|
|
4883
4252
|
|
|
4884
|
-
.background-
|
|
4885
|
-
background-color:
|
|
4253
|
+
.background-neutral-10 {
|
|
4254
|
+
background-color: var(--vb-neutral-10, hsl(214, 20%, 10%)) !important;
|
|
4886
4255
|
}
|
|
4887
4256
|
|
|
4888
|
-
.background-
|
|
4889
|
-
background-color:
|
|
4257
|
+
.background-neutral-20 {
|
|
4258
|
+
background-color: var(--vb-neutral-20, hsl(214, 20%, 20%)) !important;
|
|
4890
4259
|
}
|
|
4891
4260
|
|
|
4892
|
-
.background-
|
|
4893
|
-
background-color:
|
|
4261
|
+
.background-neutral-30 {
|
|
4262
|
+
background-color: var(--vb-neutral-30, hsl(214, 20%, 30%)) !important;
|
|
4894
4263
|
}
|
|
4895
4264
|
|
|
4896
|
-
.background-
|
|
4897
|
-
background-color:
|
|
4265
|
+
.background-neutral-40 {
|
|
4266
|
+
background-color: var(--vb-neutral-40, hsl(214, 20%, 40%)) !important;
|
|
4898
4267
|
}
|
|
4899
4268
|
|
|
4900
|
-
.background-
|
|
4901
|
-
background-color:
|
|
4269
|
+
.background-neutral-50 {
|
|
4270
|
+
background-color: var(--vb-neutral-50, hsl(214, 20%, 50%)) !important;
|
|
4902
4271
|
}
|
|
4903
4272
|
|
|
4904
|
-
.background-
|
|
4905
|
-
background-color:
|
|
4273
|
+
.background-neutral-60 {
|
|
4274
|
+
background-color: var(--vb-neutral-60, hsl(214, 20%, 60%)) !important;
|
|
4906
4275
|
}
|
|
4907
4276
|
|
|
4908
|
-
.background-
|
|
4909
|
-
background-color:
|
|
4277
|
+
.background-neutral-70 {
|
|
4278
|
+
background-color: var(--vb-neutral-70, hsl(214, 20%, 70%)) !important;
|
|
4910
4279
|
}
|
|
4911
4280
|
|
|
4912
|
-
.background-
|
|
4913
|
-
background-color:
|
|
4281
|
+
.background-neutral-80 {
|
|
4282
|
+
background-color: var(--vb-neutral-80, hsl(214, 20%, 80%)) !important;
|
|
4914
4283
|
}
|
|
4915
4284
|
|
|
4916
|
-
.background-
|
|
4917
|
-
background-color:
|
|
4285
|
+
.background-neutral-90 {
|
|
4286
|
+
background-color: var(--vb-neutral-90, hsl(214, 20%, 90%)) !important;
|
|
4918
4287
|
}
|
|
4919
4288
|
|
|
4920
|
-
.background-
|
|
4921
|
-
background-color:
|
|
4289
|
+
.background-neutral-95 {
|
|
4290
|
+
background-color: var(--vb-neutral-95, hsl(214, 20%, 95%)) !important;
|
|
4922
4291
|
}
|
|
4923
4292
|
|
|
4924
|
-
.background-
|
|
4925
|
-
background-color:
|
|
4293
|
+
.background-neutral-98 {
|
|
4294
|
+
background-color: var(--vb-neutral-98, hsl(214, 20%, 98%)) !important;
|
|
4926
4295
|
}
|
|
4927
4296
|
|
|
4928
|
-
.background-
|
|
4929
|
-
background-color:
|
|
4297
|
+
.background-neutral-100 {
|
|
4298
|
+
background-color: var(--vb-neutral-100, hsl(214, 20%, 100%)) !important;
|
|
4930
4299
|
}
|
|
4931
4300
|
|
|
4932
|
-
.background-
|
|
4933
|
-
background-color:
|
|
4301
|
+
.background-important {
|
|
4302
|
+
background-color: var(--vb-important) !important;
|
|
4934
4303
|
}
|
|
4935
4304
|
|
|
4936
|
-
.
|
|
4937
|
-
|
|
4305
|
+
.background-important-0 {
|
|
4306
|
+
background-color: var(--vb-important-0, hsl(0, 80%, 0%)) !important;
|
|
4938
4307
|
}
|
|
4939
4308
|
|
|
4940
|
-
.
|
|
4941
|
-
|
|
4309
|
+
.background-important-10 {
|
|
4310
|
+
background-color: var(--vb-important-10, hsl(0, 80%, 10%)) !important;
|
|
4942
4311
|
}
|
|
4943
4312
|
|
|
4944
|
-
.
|
|
4945
|
-
|
|
4313
|
+
.background-important-20 {
|
|
4314
|
+
background-color: var(--vb-important-20, hsl(0, 80%, 20%)) !important;
|
|
4946
4315
|
}
|
|
4947
4316
|
|
|
4948
|
-
.
|
|
4949
|
-
|
|
4317
|
+
.background-important-30 {
|
|
4318
|
+
background-color: var(--vb-important-30, hsl(0, 80%, 30%)) !important;
|
|
4950
4319
|
}
|
|
4951
4320
|
|
|
4952
|
-
.
|
|
4953
|
-
|
|
4321
|
+
.background-important-40 {
|
|
4322
|
+
background-color: var(--vb-important-40, hsl(0, 80%, 40%)) !important;
|
|
4954
4323
|
}
|
|
4955
4324
|
|
|
4956
|
-
.
|
|
4957
|
-
|
|
4325
|
+
.background-important-50 {
|
|
4326
|
+
background-color: var(--vb-important-50, hsl(0, 80%, 50%)) !important;
|
|
4958
4327
|
}
|
|
4959
4328
|
|
|
4960
|
-
.
|
|
4961
|
-
|
|
4329
|
+
.background-important-60 {
|
|
4330
|
+
background-color: var(--vb-important-60, hsl(0, 80%, 60%)) !important;
|
|
4962
4331
|
}
|
|
4963
4332
|
|
|
4964
|
-
.
|
|
4965
|
-
|
|
4333
|
+
.background-important-70 {
|
|
4334
|
+
background-color: var(--vb-important-70, hsl(0, 80%, 70%)) !important;
|
|
4966
4335
|
}
|
|
4967
4336
|
|
|
4968
|
-
.
|
|
4969
|
-
|
|
4337
|
+
.background-important-80 {
|
|
4338
|
+
background-color: var(--vb-important-80, hsl(0, 80%, 80%)) !important;
|
|
4970
4339
|
}
|
|
4971
4340
|
|
|
4972
|
-
.
|
|
4973
|
-
|
|
4341
|
+
.background-important-90 {
|
|
4342
|
+
background-color: var(--vb-important-90, hsl(0, 80%, 90%)) !important;
|
|
4974
4343
|
}
|
|
4975
4344
|
|
|
4976
|
-
.
|
|
4977
|
-
|
|
4345
|
+
.background-important-95 {
|
|
4346
|
+
background-color: var(--vb-important-95, hsl(0, 80%, 95%)) !important;
|
|
4978
4347
|
}
|
|
4979
4348
|
|
|
4980
|
-
.
|
|
4981
|
-
|
|
4349
|
+
.background-important-98 {
|
|
4350
|
+
background-color: var(--vb-important-98, hsl(0, 80%, 98%)) !important;
|
|
4982
4351
|
}
|
|
4983
4352
|
|
|
4984
|
-
.
|
|
4985
|
-
|
|
4353
|
+
.background-important-100 {
|
|
4354
|
+
background-color: var(--vb-important-100, hsl(0, 80%, 100%)) !important;
|
|
4986
4355
|
}
|
|
4987
4356
|
|
|
4988
|
-
.
|
|
4989
|
-
|
|
4357
|
+
.foreground {
|
|
4358
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))) !important;
|
|
4990
4359
|
}
|
|
4991
4360
|
|
|
4992
|
-
.
|
|
4993
|
-
|
|
4361
|
+
.foreground-light {
|
|
4362
|
+
color: var(--vb-foreground-light, var(--vb-neutral-40, hsl(214, 20%, 40%))) !important;
|
|
4994
4363
|
}
|
|
4995
4364
|
|
|
4996
|
-
.
|
|
4997
|
-
|
|
4365
|
+
.foreground-lighter {
|
|
4366
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%))) !important;
|
|
4998
4367
|
}
|
|
4999
4368
|
|
|
5000
|
-
.
|
|
5001
|
-
|
|
4369
|
+
.foreground-black {
|
|
4370
|
+
color: black !important;
|
|
5002
4371
|
}
|
|
5003
4372
|
|
|
5004
|
-
.
|
|
5005
|
-
|
|
4373
|
+
.foreground-white {
|
|
4374
|
+
color: white !important;
|
|
5006
4375
|
}
|
|
5007
4376
|
|
|
5008
|
-
.
|
|
5009
|
-
|
|
4377
|
+
.foreground-transparent {
|
|
4378
|
+
color: transparent !important;
|
|
5010
4379
|
}
|
|
5011
4380
|
|
|
5012
|
-
.
|
|
5013
|
-
|
|
5014
|
-
.radius-top-left {
|
|
5015
|
-
border-top-left-radius: 0.25rem !important;
|
|
4381
|
+
.foreground-primary {
|
|
4382
|
+
color: var(--vb-primary) !important;
|
|
5016
4383
|
}
|
|
5017
4384
|
|
|
5018
|
-
.
|
|
5019
|
-
|
|
5020
|
-
.radius-top-right {
|
|
5021
|
-
border-top-right-radius: 0.25rem !important;
|
|
4385
|
+
.foreground-primary-0 {
|
|
4386
|
+
color: var(--vb-primary-0, hsl(152, 60%, 0%)) !important;
|
|
5022
4387
|
}
|
|
5023
4388
|
|
|
5024
|
-
.
|
|
5025
|
-
|
|
5026
|
-
.radius-bottom-right {
|
|
5027
|
-
border-bottom-right-radius: 0.25rem !important;
|
|
4389
|
+
.foreground-primary-10 {
|
|
4390
|
+
color: var(--vb-primary-10, hsl(152, 60%, 10%)) !important;
|
|
5028
4391
|
}
|
|
5029
4392
|
|
|
5030
|
-
.
|
|
5031
|
-
|
|
5032
|
-
.radius-bottom-left {
|
|
5033
|
-
border-bottom-left-radius: 0.25rem !important;
|
|
4393
|
+
.foreground-primary-20 {
|
|
4394
|
+
color: var(--vb-primary-20, hsl(152, 60%, 20%)) !important;
|
|
5034
4395
|
}
|
|
5035
4396
|
|
|
5036
|
-
.
|
|
5037
|
-
|
|
4397
|
+
.foreground-primary-30 {
|
|
4398
|
+
color: var(--vb-primary-30, hsl(152, 60%, 30%)) !important;
|
|
5038
4399
|
}
|
|
5039
4400
|
|
|
5040
|
-
.
|
|
5041
|
-
|
|
5042
|
-
.radius-circle-top-left {
|
|
5043
|
-
border-top-left-radius: 9999px !important;
|
|
4401
|
+
.foreground-primary-40 {
|
|
4402
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%)) !important;
|
|
5044
4403
|
}
|
|
5045
4404
|
|
|
5046
|
-
.
|
|
5047
|
-
|
|
5048
|
-
.radius-circle-top-right {
|
|
5049
|
-
border-top-right-radius: 9999px !important;
|
|
4405
|
+
.foreground-primary-50 {
|
|
4406
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%)) !important;
|
|
5050
4407
|
}
|
|
5051
4408
|
|
|
5052
|
-
.
|
|
5053
|
-
|
|
5054
|
-
.radius-circle-bottom-right {
|
|
5055
|
-
border-bottom-right-radius: 9999px !important;
|
|
4409
|
+
.foreground-primary-60 {
|
|
4410
|
+
color: var(--vb-primary-60, hsl(152, 60%, 60%)) !important;
|
|
5056
4411
|
}
|
|
5057
4412
|
|
|
5058
|
-
.
|
|
5059
|
-
|
|
5060
|
-
.radius-circle-bottom-left {
|
|
5061
|
-
border-bottom-left-radius: 9999px !important;
|
|
4413
|
+
.foreground-primary-70 {
|
|
4414
|
+
color: var(--vb-primary-70, hsl(152, 60%, 70%)) !important;
|
|
5062
4415
|
}
|
|
5063
4416
|
|
|
5064
|
-
.
|
|
5065
|
-
|
|
4417
|
+
.foreground-primary-80 {
|
|
4418
|
+
color: var(--vb-primary-80, hsl(152, 60%, 80%)) !important;
|
|
5066
4419
|
}
|
|
5067
4420
|
|
|
5068
|
-
.
|
|
5069
|
-
|
|
5070
|
-
.radius-square-top-left {
|
|
5071
|
-
border-top-left-radius: 0 !important;
|
|
4421
|
+
.foreground-primary-90 {
|
|
4422
|
+
color: var(--vb-primary-90, hsl(152, 60%, 90%)) !important;
|
|
5072
4423
|
}
|
|
5073
4424
|
|
|
5074
|
-
.
|
|
5075
|
-
|
|
5076
|
-
.radius-square-top-right {
|
|
5077
|
-
border-top-right-radius: 0 !important;
|
|
4425
|
+
.foreground-primary-95 {
|
|
4426
|
+
color: var(--vb-primary-95, hsl(152, 60%, 95%)) !important;
|
|
5078
4427
|
}
|
|
5079
4428
|
|
|
5080
|
-
.
|
|
5081
|
-
|
|
5082
|
-
.radius-square-bottom-right {
|
|
5083
|
-
border-bottom-right-radius: 0 !important;
|
|
4429
|
+
.foreground-primary-98 {
|
|
4430
|
+
color: var(--vb-primary-98, hsl(152, 60%, 98%)) !important;
|
|
5084
4431
|
}
|
|
5085
4432
|
|
|
5086
|
-
.
|
|
5087
|
-
|
|
5088
|
-
.radius-square-bottom-left {
|
|
5089
|
-
border-bottom-left-radius: 0 !important;
|
|
4433
|
+
.foreground-primary-100 {
|
|
4434
|
+
color: var(--vb-primary-100, hsl(152, 60%, 100%)) !important;
|
|
5090
4435
|
}
|
|
5091
4436
|
|
|
5092
|
-
.
|
|
5093
|
-
|
|
4437
|
+
.foreground-secondary {
|
|
4438
|
+
color: var(--vb-secondary) !important;
|
|
5094
4439
|
}
|
|
5095
4440
|
|
|
5096
|
-
.
|
|
5097
|
-
|
|
4441
|
+
.foreground-secondary-0 {
|
|
4442
|
+
color: var(--vb-secondary-0, hsl(214, 50%, 0%)) !important;
|
|
5098
4443
|
}
|
|
5099
4444
|
|
|
5100
|
-
.
|
|
5101
|
-
|
|
4445
|
+
.foreground-secondary-10 {
|
|
4446
|
+
color: var(--vb-secondary-10, hsl(214, 50%, 10%)) !important;
|
|
5102
4447
|
}
|
|
5103
4448
|
|
|
5104
|
-
.
|
|
5105
|
-
|
|
4449
|
+
.foreground-secondary-20 {
|
|
4450
|
+
color: var(--vb-secondary-20, hsl(214, 50%, 20%)) !important;
|
|
5106
4451
|
}
|
|
5107
4452
|
|
|
5108
|
-
.
|
|
5109
|
-
|
|
4453
|
+
.foreground-secondary-30 {
|
|
4454
|
+
color: var(--vb-secondary-30, hsl(214, 50%, 30%)) !important;
|
|
5110
4455
|
}
|
|
5111
4456
|
|
|
5112
|
-
.
|
|
5113
|
-
|
|
4457
|
+
.foreground-secondary-40 {
|
|
4458
|
+
color: var(--vb-secondary-40, hsl(214, 50%, 40%)) !important;
|
|
5114
4459
|
}
|
|
5115
4460
|
|
|
5116
|
-
.
|
|
5117
|
-
|
|
4461
|
+
.foreground-secondary-50 {
|
|
4462
|
+
color: var(--vb-secondary-50, hsl(214, 50%, 50%)) !important;
|
|
5118
4463
|
}
|
|
5119
4464
|
|
|
5120
|
-
.
|
|
5121
|
-
color:
|
|
4465
|
+
.foreground-secondary-60 {
|
|
4466
|
+
color: var(--vb-secondary-60, hsl(214, 50%, 60%)) !important;
|
|
5122
4467
|
}
|
|
5123
4468
|
|
|
5124
|
-
.
|
|
5125
|
-
color:
|
|
4469
|
+
.foreground-secondary-70 {
|
|
4470
|
+
color: var(--vb-secondary-70, hsl(214, 50%, 70%)) !important;
|
|
5126
4471
|
}
|
|
5127
4472
|
|
|
5128
|
-
.
|
|
5129
|
-
color:
|
|
4473
|
+
.foreground-secondary-80 {
|
|
4474
|
+
color: var(--vb-secondary-80, hsl(214, 50%, 80%)) !important;
|
|
5130
4475
|
}
|
|
5131
4476
|
|
|
5132
|
-
.
|
|
5133
|
-
color:
|
|
4477
|
+
.foreground-secondary-90 {
|
|
4478
|
+
color: var(--vb-secondary-90, hsl(214, 50%, 90%)) !important;
|
|
5134
4479
|
}
|
|
5135
4480
|
|
|
5136
|
-
.
|
|
5137
|
-
color:
|
|
4481
|
+
.foreground-secondary-95 {
|
|
4482
|
+
color: var(--vb-secondary-95, hsl(214, 50%, 95%)) !important;
|
|
5138
4483
|
}
|
|
5139
4484
|
|
|
5140
|
-
.
|
|
5141
|
-
color:
|
|
4485
|
+
.foreground-secondary-98 {
|
|
4486
|
+
color: var(--vb-secondary-98, hsl(214, 50%, 98%)) !important;
|
|
5142
4487
|
}
|
|
5143
4488
|
|
|
5144
|
-
.
|
|
5145
|
-
color:
|
|
4489
|
+
.foreground-secondary-100 {
|
|
4490
|
+
color: var(--vb-secondary-100, hsl(214, 50%, 100%)) !important;
|
|
4491
|
+
}
|
|
4492
|
+
|
|
4493
|
+
.foreground-neutral {
|
|
4494
|
+
color: var(--vb-neutral) !important;
|
|
4495
|
+
}
|
|
4496
|
+
|
|
4497
|
+
.foreground-neutral-0 {
|
|
4498
|
+
color: var(--vb-neutral-0, hsl(214, 20%, 0%)) !important;
|
|
4499
|
+
}
|
|
4500
|
+
|
|
4501
|
+
.foreground-neutral-10 {
|
|
4502
|
+
color: var(--vb-neutral-10, hsl(214, 20%, 10%)) !important;
|
|
4503
|
+
}
|
|
4504
|
+
|
|
4505
|
+
.foreground-neutral-20 {
|
|
4506
|
+
color: var(--vb-neutral-20, hsl(214, 20%, 20%)) !important;
|
|
5146
4507
|
}
|
|
5147
4508
|
|
|
5148
|
-
.
|
|
5149
|
-
color:
|
|
4509
|
+
.foreground-neutral-30 {
|
|
4510
|
+
color: var(--vb-neutral-30, hsl(214, 20%, 30%)) !important;
|
|
5150
4511
|
}
|
|
5151
4512
|
|
|
5152
|
-
.
|
|
5153
|
-
color:
|
|
4513
|
+
.foreground-neutral-40 {
|
|
4514
|
+
color: var(--vb-neutral-40, hsl(214, 20%, 40%)) !important;
|
|
5154
4515
|
}
|
|
5155
4516
|
|
|
5156
|
-
.
|
|
5157
|
-
color:
|
|
4517
|
+
.foreground-neutral-50 {
|
|
4518
|
+
color: var(--vb-neutral-50, hsl(214, 20%, 50%)) !important;
|
|
5158
4519
|
}
|
|
5159
4520
|
|
|
5160
|
-
.
|
|
5161
|
-
color:
|
|
4521
|
+
.foreground-neutral-60 {
|
|
4522
|
+
color: var(--vb-neutral-60, hsl(214, 20%, 60%)) !important;
|
|
5162
4523
|
}
|
|
5163
4524
|
|
|
5164
|
-
.
|
|
5165
|
-
color:
|
|
4525
|
+
.foreground-neutral-70 {
|
|
4526
|
+
color: var(--vb-neutral-70, hsl(214, 20%, 70%)) !important;
|
|
5166
4527
|
}
|
|
5167
4528
|
|
|
5168
|
-
.
|
|
5169
|
-
color:
|
|
4529
|
+
.foreground-neutral-80 {
|
|
4530
|
+
color: var(--vb-neutral-80, hsl(214, 20%, 80%)) !important;
|
|
5170
4531
|
}
|
|
5171
4532
|
|
|
5172
|
-
.
|
|
5173
|
-
color:
|
|
4533
|
+
.foreground-neutral-90 {
|
|
4534
|
+
color: var(--vb-neutral-90, hsl(214, 20%, 90%)) !important;
|
|
5174
4535
|
}
|
|
5175
4536
|
|
|
5176
|
-
.
|
|
5177
|
-
color:
|
|
4537
|
+
.foreground-neutral-95 {
|
|
4538
|
+
color: var(--vb-neutral-95, hsl(214, 20%, 95%)) !important;
|
|
5178
4539
|
}
|
|
5179
4540
|
|
|
5180
|
-
.
|
|
5181
|
-
color:
|
|
4541
|
+
.foreground-neutral-98 {
|
|
4542
|
+
color: var(--vb-neutral-98, hsl(214, 20%, 98%)) !important;
|
|
5182
4543
|
}
|
|
5183
4544
|
|
|
5184
|
-
.
|
|
5185
|
-
color:
|
|
4545
|
+
.foreground-neutral-100 {
|
|
4546
|
+
color: var(--vb-neutral-100, hsl(214, 20%, 100%)) !important;
|
|
5186
4547
|
}
|
|
5187
4548
|
|
|
5188
|
-
.
|
|
5189
|
-
color:
|
|
4549
|
+
.foreground-important {
|
|
4550
|
+
color: var(--vb-important) !important;
|
|
5190
4551
|
}
|
|
5191
4552
|
|
|
5192
|
-
.
|
|
5193
|
-
color:
|
|
4553
|
+
.foreground-important-0 {
|
|
4554
|
+
color: var(--vb-important-0, hsl(0, 80%, 0%)) !important;
|
|
5194
4555
|
}
|
|
5195
4556
|
|
|
5196
|
-
.
|
|
5197
|
-
color:
|
|
4557
|
+
.foreground-important-10 {
|
|
4558
|
+
color: var(--vb-important-10, hsl(0, 80%, 10%)) !important;
|
|
5198
4559
|
}
|
|
5199
4560
|
|
|
5200
|
-
.
|
|
5201
|
-
color:
|
|
4561
|
+
.foreground-important-20 {
|
|
4562
|
+
color: var(--vb-important-20, hsl(0, 80%, 20%)) !important;
|
|
5202
4563
|
}
|
|
5203
4564
|
|
|
5204
|
-
.
|
|
5205
|
-
color:
|
|
4565
|
+
.foreground-important-30 {
|
|
4566
|
+
color: var(--vb-important-30, hsl(0, 80%, 30%)) !important;
|
|
5206
4567
|
}
|
|
5207
4568
|
|
|
5208
|
-
.
|
|
5209
|
-
color:
|
|
4569
|
+
.foreground-important-40 {
|
|
4570
|
+
color: var(--vb-important-40, hsl(0, 80%, 40%)) !important;
|
|
5210
4571
|
}
|
|
5211
4572
|
|
|
5212
|
-
.
|
|
5213
|
-
color:
|
|
4573
|
+
.foreground-important-50 {
|
|
4574
|
+
color: var(--vb-important-50, hsl(0, 80%, 50%)) !important;
|
|
5214
4575
|
}
|
|
5215
4576
|
|
|
5216
|
-
.
|
|
5217
|
-
color:
|
|
4577
|
+
.foreground-important-60 {
|
|
4578
|
+
color: var(--vb-important-60, hsl(0, 80%, 60%)) !important;
|
|
5218
4579
|
}
|
|
5219
4580
|
|
|
5220
|
-
.
|
|
5221
|
-
color:
|
|
4581
|
+
.foreground-important-70 {
|
|
4582
|
+
color: var(--vb-important-70, hsl(0, 80%, 70%)) !important;
|
|
5222
4583
|
}
|
|
5223
4584
|
|
|
5224
|
-
.
|
|
5225
|
-
color:
|
|
4585
|
+
.foreground-important-80 {
|
|
4586
|
+
color: var(--vb-important-80, hsl(0, 80%, 80%)) !important;
|
|
5226
4587
|
}
|
|
5227
4588
|
|
|
5228
|
-
.
|
|
5229
|
-
color:
|
|
4589
|
+
.foreground-important-90 {
|
|
4590
|
+
color: var(--vb-important-90, hsl(0, 80%, 90%)) !important;
|
|
5230
4591
|
}
|
|
5231
4592
|
|
|
5232
|
-
.
|
|
5233
|
-
color:
|
|
4593
|
+
.foreground-important-95 {
|
|
4594
|
+
color: var(--vb-important-95, hsl(0, 80%, 95%)) !important;
|
|
5234
4595
|
}
|
|
5235
4596
|
|
|
5236
|
-
.
|
|
5237
|
-
color:
|
|
4597
|
+
.foreground-important-98 {
|
|
4598
|
+
color: var(--vb-important-98, hsl(0, 80%, 98%)) !important;
|
|
5238
4599
|
}
|
|
5239
4600
|
|
|
5240
|
-
.
|
|
5241
|
-
color:
|
|
4601
|
+
.foreground-important-100 {
|
|
4602
|
+
color: var(--vb-important-100, hsl(0, 80%, 100%)) !important;
|
|
5242
4603
|
}
|
|
5243
4604
|
|
|
5244
|
-
.
|
|
5245
|
-
|
|
4605
|
+
.border {
|
|
4606
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4607
|
+
}
|
|
4608
|
+
|
|
4609
|
+
.border-top {
|
|
4610
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4611
|
+
}
|
|
4612
|
+
|
|
4613
|
+
.border-bottom {
|
|
4614
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4615
|
+
}
|
|
4616
|
+
|
|
4617
|
+
.border-left {
|
|
4618
|
+
border-left: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4619
|
+
}
|
|
4620
|
+
|
|
4621
|
+
.border-right {
|
|
4622
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4623
|
+
}
|
|
4624
|
+
|
|
4625
|
+
.border-none {
|
|
4626
|
+
border: 0 !important;
|
|
4627
|
+
}
|
|
4628
|
+
|
|
4629
|
+
.border-top-none {
|
|
4630
|
+
border-top: 0 !important;
|
|
4631
|
+
}
|
|
4632
|
+
|
|
4633
|
+
.border-bottom-none {
|
|
4634
|
+
border-bottom: 0 !important;
|
|
4635
|
+
}
|
|
4636
|
+
|
|
4637
|
+
.border-left-none {
|
|
4638
|
+
border-left: 0 !important;
|
|
4639
|
+
}
|
|
4640
|
+
|
|
4641
|
+
.border-right-none {
|
|
4642
|
+
border-right: 0 !important;
|
|
4643
|
+
}
|
|
4644
|
+
|
|
4645
|
+
.border-color-dark {
|
|
4646
|
+
border-color: var(--vb-border-color-dark, rgba(0, 0, 0, 0.2)) !important;
|
|
4647
|
+
}
|
|
4648
|
+
|
|
4649
|
+
.border-color-darker {
|
|
4650
|
+
border-color: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3)) !important;
|
|
4651
|
+
}
|
|
4652
|
+
|
|
4653
|
+
.border-color-transparent {
|
|
4654
|
+
border-color: transparent !important;
|
|
4655
|
+
}
|
|
4656
|
+
|
|
4657
|
+
.radius {
|
|
4658
|
+
border-radius: 0.25rem !important;
|
|
4659
|
+
}
|
|
4660
|
+
|
|
4661
|
+
.radius-top,
|
|
4662
|
+
.radius-left,
|
|
4663
|
+
.radius-top-left {
|
|
4664
|
+
border-top-left-radius: 0.25rem !important;
|
|
4665
|
+
}
|
|
4666
|
+
|
|
4667
|
+
.radius-top,
|
|
4668
|
+
.radius-right,
|
|
4669
|
+
.radius-top-right {
|
|
4670
|
+
border-top-right-radius: 0.25rem !important;
|
|
4671
|
+
}
|
|
4672
|
+
|
|
4673
|
+
.radius-bottom,
|
|
4674
|
+
.radius-right,
|
|
4675
|
+
.radius-bottom-right {
|
|
4676
|
+
border-bottom-right-radius: 0.25rem !important;
|
|
4677
|
+
}
|
|
4678
|
+
|
|
4679
|
+
.radius-bottom,
|
|
4680
|
+
.radius-left,
|
|
4681
|
+
.radius-bottom-left {
|
|
4682
|
+
border-bottom-left-radius: 0.25rem !important;
|
|
4683
|
+
}
|
|
4684
|
+
|
|
4685
|
+
.radius-circle {
|
|
4686
|
+
border-radius: 9999px !important;
|
|
4687
|
+
}
|
|
4688
|
+
|
|
4689
|
+
.radius-circle-top,
|
|
4690
|
+
.radius-circle-left,
|
|
4691
|
+
.radius-circle-top-left {
|
|
4692
|
+
border-top-left-radius: 9999px !important;
|
|
4693
|
+
}
|
|
4694
|
+
|
|
4695
|
+
.radius-circle-top,
|
|
4696
|
+
.radius-circle-right,
|
|
4697
|
+
.radius-circle-top-right {
|
|
4698
|
+
border-top-right-radius: 9999px !important;
|
|
4699
|
+
}
|
|
4700
|
+
|
|
4701
|
+
.radius-circle-bottom,
|
|
4702
|
+
.radius-circle-right,
|
|
4703
|
+
.radius-circle-bottom-right {
|
|
4704
|
+
border-bottom-right-radius: 9999px !important;
|
|
4705
|
+
}
|
|
4706
|
+
|
|
4707
|
+
.radius-circle-bottom,
|
|
4708
|
+
.radius-circle-left,
|
|
4709
|
+
.radius-circle-bottom-left {
|
|
4710
|
+
border-bottom-left-radius: 9999px !important;
|
|
4711
|
+
}
|
|
4712
|
+
|
|
4713
|
+
.radius-square {
|
|
4714
|
+
border-radius: 0 !important;
|
|
5246
4715
|
}
|
|
5247
4716
|
|
|
5248
|
-
.
|
|
5249
|
-
|
|
4717
|
+
.radius-square-top,
|
|
4718
|
+
.radius-square-left,
|
|
4719
|
+
.radius-square-top-left {
|
|
4720
|
+
border-top-left-radius: 0 !important;
|
|
5250
4721
|
}
|
|
5251
4722
|
|
|
5252
|
-
.
|
|
5253
|
-
|
|
4723
|
+
.radius-square-top,
|
|
4724
|
+
.radius-square-right,
|
|
4725
|
+
.radius-square-top-right {
|
|
4726
|
+
border-top-right-radius: 0 !important;
|
|
5254
4727
|
}
|
|
5255
4728
|
|
|
5256
|
-
.
|
|
5257
|
-
|
|
4729
|
+
.radius-square-bottom,
|
|
4730
|
+
.radius-square-right,
|
|
4731
|
+
.radius-square-bottom-right {
|
|
4732
|
+
border-bottom-right-radius: 0 !important;
|
|
5258
4733
|
}
|
|
5259
4734
|
|
|
5260
|
-
.
|
|
5261
|
-
|
|
4735
|
+
.radius-square-bottom,
|
|
4736
|
+
.radius-square-left,
|
|
4737
|
+
.radius-square-bottom-left {
|
|
4738
|
+
border-bottom-left-radius: 0 !important;
|
|
5262
4739
|
}
|
|
5263
4740
|
|
|
5264
|
-
.
|
|
5265
|
-
|
|
4741
|
+
.shadow {
|
|
4742
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5266
4743
|
}
|
|
5267
4744
|
|
|
5268
|
-
.
|
|
5269
|
-
|
|
4745
|
+
.shadow-flat {
|
|
4746
|
+
box-shadow: 0 0 0 0 transparent !important;
|
|
5270
4747
|
}
|
|
5271
4748
|
|
|
5272
|
-
.
|
|
5273
|
-
|
|
4749
|
+
.shadow-1 {
|
|
4750
|
+
box-shadow: 0 1px 3px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5274
4751
|
}
|
|
5275
4752
|
|
|
5276
|
-
.
|
|
5277
|
-
|
|
4753
|
+
.shadow-2 {
|
|
4754
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5278
4755
|
}
|
|
5279
4756
|
|
|
5280
|
-
.
|
|
5281
|
-
|
|
4757
|
+
.shadow-3 {
|
|
4758
|
+
box-shadow: 0 4px 12px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5282
4759
|
}
|
|
5283
4760
|
|
|
5284
|
-
.
|
|
5285
|
-
|
|
4761
|
+
.shadow-4 {
|
|
4762
|
+
box-shadow: 0 8px 18px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5286
4763
|
}
|
|
5287
4764
|
|
|
5288
|
-
.
|
|
5289
|
-
|
|
4765
|
+
.shadow-5 {
|
|
4766
|
+
box-shadow: 0 12px 24px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5290
4767
|
}
|
|
5291
4768
|
|
|
5292
4769
|
.display-inline {
|
|
@@ -6492,12 +5969,4 @@ input::-moz-placeholder {
|
|
|
6492
5969
|
white-space: nowrap !important;
|
|
6493
5970
|
}
|
|
6494
5971
|
|
|
6495
|
-
:root {
|
|
6496
|
-
--vb-breakpoint-xs: 480px;
|
|
6497
|
-
--vb-breakpoint-sm: 620px;
|
|
6498
|
-
--vb-breakpoint-md: 760px;
|
|
6499
|
-
--vb-breakpoint-lg: 990px;
|
|
6500
|
-
--vb-breakpoint-xl: 1380px;
|
|
6501
|
-
}
|
|
6502
|
-
|
|
6503
5972
|
/*# sourceMappingURL=styles.css.map */
|