vrembem 3.0.16 → 3.0.18
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/LICENSE +1 -1
- package/dev/{styles.css → index.css} +1246 -1738
- package/dev/index.css.map +1 -0
- package/dev/index.js +2250 -0
- package/dev/index.js.map +1 -0
- package/dev/index.umd.cjs +2254 -0
- package/dev/index.umd.cjs.map +1 -0
- package/dist/index.css +1 -0
- package/dist/index.css.map +1 -0
- package/dist/index.js +2231 -0
- package/dist/index.js.map +1 -0
- package/dist/index.umd.cjs +10 -0
- package/dist/index.umd.cjs.map +1 -0
- package/package.json +26 -26
- package/dev/scripts.esm.js +0 -4663
- package/dev/scripts.esm.js.map +0 -1
- package/dev/scripts.js +0 -4667
- package/dev/scripts.js.map +0 -1
- package/dev/scripts.modern.mjs +0 -4114
- package/dev/scripts.modern.mjs.map +0 -1
- package/dev/scripts.umd.js +0 -4674
- package/dev/scripts.umd.js.map +0 -1
- package/dev/styles.css.map +0 -1
- package/dist/scripts.esm.js +0 -2
- package/dist/scripts.esm.js.map +0 -1
- package/dist/scripts.js +0 -2
- package/dist/scripts.js.map +0 -1
- package/dist/scripts.modern.mjs +0 -2
- package/dist/scripts.modern.mjs.map +0 -1
- package/dist/scripts.umd.js +0 -2
- package/dist/scripts.umd.js.map +0 -1
- package/dist/styles.css +0 -1
- package/dist/styles.css.map +0 -1
|
@@ -14,13 +14,14 @@ body {
|
|
|
14
14
|
html {
|
|
15
15
|
box-sizing: border-box;
|
|
16
16
|
font-size: 16px;
|
|
17
|
-
line-height: 1.
|
|
17
|
+
line-height: 1.625;
|
|
18
18
|
-moz-osx-font-smoothing: grayscale;
|
|
19
19
|
-webkit-text-size-adjust: 100%;
|
|
20
20
|
}
|
|
21
21
|
|
|
22
22
|
body {
|
|
23
|
-
|
|
23
|
+
background: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
24
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
24
25
|
font-family: blinkmacsystemfont, -apple-system, system-ui, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif;
|
|
25
26
|
}
|
|
26
27
|
|
|
@@ -71,7 +72,7 @@ table {
|
|
|
71
72
|
|
|
72
73
|
caption {
|
|
73
74
|
caption-side: bottom;
|
|
74
|
-
color:
|
|
75
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
75
76
|
text-align: left;
|
|
76
77
|
}
|
|
77
78
|
|
|
@@ -157,7 +158,7 @@ input::-moz-placeholder {
|
|
|
157
158
|
.blockquote {
|
|
158
159
|
position: relative;
|
|
159
160
|
padding: 1.5em;
|
|
160
|
-
border: 1px solid rgba(0, 0, 0, 0.
|
|
161
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
161
162
|
color: inherit;
|
|
162
163
|
}
|
|
163
164
|
.blockquote > * + * {
|
|
@@ -170,13 +171,13 @@ input::-moz-placeholder {
|
|
|
170
171
|
bottom: -1px;
|
|
171
172
|
left: -1px;
|
|
172
173
|
width: 4px;
|
|
173
|
-
background-color:
|
|
174
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
174
175
|
}
|
|
175
176
|
|
|
176
177
|
.code {
|
|
177
|
-
color:
|
|
178
|
+
color: var(--vb-secondary-50, hsl(214, 50%, 50%));
|
|
178
179
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
179
|
-
font-size:
|
|
180
|
+
font-size: 16px;
|
|
180
181
|
word-break: break-word;
|
|
181
182
|
}
|
|
182
183
|
|
|
@@ -240,73 +241,20 @@ input::-moz-placeholder {
|
|
|
240
241
|
}
|
|
241
242
|
|
|
242
243
|
.link {
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
text-decoration:
|
|
244
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
245
|
+
text-decoration: underline;
|
|
246
|
+
text-decoration-thickness: 1px;
|
|
247
|
+
text-underline-offset: 2px;
|
|
246
248
|
}
|
|
247
249
|
.link:hover {
|
|
248
|
-
|
|
249
|
-
|
|
250
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
251
|
+
text-decoration: none;
|
|
250
252
|
}
|
|
251
253
|
.link:focus {
|
|
252
254
|
outline: currentcolor dotted 1px;
|
|
253
255
|
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;
|
|
256
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
257
|
+
text-decoration: none;
|
|
310
258
|
}
|
|
311
259
|
|
|
312
260
|
.list {
|
|
@@ -321,12 +269,16 @@ input::-moz-placeholder {
|
|
|
321
269
|
margin-top: 0.5em;
|
|
322
270
|
}
|
|
323
271
|
|
|
272
|
+
.list-style-none {
|
|
273
|
+
list-style: none !important;
|
|
274
|
+
}
|
|
275
|
+
|
|
324
276
|
.pre {
|
|
325
277
|
padding: 1em;
|
|
326
278
|
overflow: auto;
|
|
327
279
|
border-radius: 0.25rem;
|
|
328
|
-
background:
|
|
329
|
-
color:
|
|
280
|
+
background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
281
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
330
282
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
331
283
|
}
|
|
332
284
|
.pre code {
|
|
@@ -334,7 +286,7 @@ input::-moz-placeholder {
|
|
|
334
286
|
border: none;
|
|
335
287
|
background: none;
|
|
336
288
|
color: inherit;
|
|
337
|
-
font-size:
|
|
289
|
+
font-size: 16px;
|
|
338
290
|
}
|
|
339
291
|
|
|
340
292
|
.scroll-box {
|
|
@@ -348,23 +300,21 @@ input::-moz-placeholder {
|
|
|
348
300
|
display: block;
|
|
349
301
|
height: 0;
|
|
350
302
|
border: none;
|
|
351
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
303
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
352
304
|
}
|
|
353
305
|
|
|
354
|
-
.
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
|
306
|
+
.type {
|
|
307
|
+
color: var(--vb-foreground-light, var(--vb-neutral-40, hsl(214, 20%, 40%)));
|
|
308
|
+
font-size: 1.125rem;
|
|
309
|
+
line-height: 1.7778;
|
|
359
310
|
}
|
|
360
|
-
|
|
361
311
|
.type h1,
|
|
362
312
|
.type h2,
|
|
363
313
|
.type h3,
|
|
364
314
|
.type h4,
|
|
365
315
|
.type h5,
|
|
366
316
|
.type h6 {
|
|
367
|
-
color:
|
|
317
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
368
318
|
font-family: inherit;
|
|
369
319
|
font-weight: 600;
|
|
370
320
|
line-height: 1.375;
|
|
@@ -391,34 +341,35 @@ input::-moz-placeholder {
|
|
|
391
341
|
}
|
|
392
342
|
.type > a,
|
|
393
343
|
.type > :not(div) a {
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
text-decoration:
|
|
344
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
345
|
+
text-decoration: underline;
|
|
346
|
+
text-decoration-thickness: 1px;
|
|
347
|
+
text-underline-offset: 2px;
|
|
397
348
|
}
|
|
398
349
|
.type > a:hover,
|
|
399
350
|
.type > :not(div) a:hover {
|
|
400
|
-
|
|
401
|
-
|
|
351
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
352
|
+
text-decoration: none;
|
|
402
353
|
}
|
|
403
354
|
.type > a:focus,
|
|
404
355
|
.type > :not(div) a:focus {
|
|
405
356
|
outline: currentcolor dotted 1px;
|
|
406
357
|
outline-offset: 0.125rem;
|
|
407
|
-
|
|
408
|
-
|
|
358
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
359
|
+
text-decoration: none;
|
|
409
360
|
}
|
|
410
361
|
.type > code,
|
|
411
362
|
.type > :not(div) code {
|
|
412
|
-
color:
|
|
363
|
+
color: var(--vb-secondary-50, hsl(214, 50%, 50%));
|
|
413
364
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
414
|
-
font-size:
|
|
365
|
+
font-size: 16px;
|
|
415
366
|
word-break: break-word;
|
|
416
367
|
}
|
|
417
368
|
.type > hr {
|
|
418
369
|
display: block;
|
|
419
370
|
height: 0;
|
|
420
371
|
border: none;
|
|
421
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
372
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
422
373
|
}
|
|
423
374
|
.type > ul,
|
|
424
375
|
.type > ol {
|
|
@@ -439,7 +390,7 @@ input::-moz-placeholder {
|
|
|
439
390
|
.type > blockquote {
|
|
440
391
|
position: relative;
|
|
441
392
|
padding: 1.5em;
|
|
442
|
-
border: 1px solid rgba(0, 0, 0, 0.
|
|
393
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
443
394
|
color: inherit;
|
|
444
395
|
}
|
|
445
396
|
.type > blockquote > * + * {
|
|
@@ -452,14 +403,14 @@ input::-moz-placeholder {
|
|
|
452
403
|
bottom: -1px;
|
|
453
404
|
left: -1px;
|
|
454
405
|
width: 4px;
|
|
455
|
-
background-color:
|
|
406
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
456
407
|
}
|
|
457
408
|
.type > pre {
|
|
458
409
|
padding: 1em;
|
|
459
410
|
overflow: auto;
|
|
460
411
|
border-radius: 0.25rem;
|
|
461
|
-
background:
|
|
462
|
-
color:
|
|
412
|
+
background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
413
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
463
414
|
font-family: sfmono-regular, menlo, monaco, consolas, "Liberation Mono", "Courier New", monospace;
|
|
464
415
|
}
|
|
465
416
|
.type > pre code {
|
|
@@ -467,152 +418,103 @@ input::-moz-placeholder {
|
|
|
467
418
|
border: none;
|
|
468
419
|
background: none;
|
|
469
420
|
color: inherit;
|
|
470
|
-
font-size:
|
|
471
|
-
}
|
|
472
|
-
|
|
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;
|
|
421
|
+
font-size: 16px;
|
|
539
422
|
}
|
|
540
423
|
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
424
|
+
:root {
|
|
425
|
+
--vb-button-size: 2.5rem;
|
|
426
|
+
--vb-button-padding: calc(0.5em - 1px) 1em;
|
|
427
|
+
--vb-button-gap: 0.5rem;
|
|
428
|
+
--vb-button-border-width: 1px;
|
|
429
|
+
--vb-button-border-radius: 0.25rem;
|
|
430
|
+
--vb-button-font-size: 1em;
|
|
431
|
+
--vb-button-font-weight: inherit;
|
|
432
|
+
--vb-button-line-height: 1.625;
|
|
433
|
+
--vb-button-transition-property: background, color, border-color, box-shadow;
|
|
434
|
+
--vb-button-transition-duration: 0.15s;
|
|
435
|
+
--vb-button-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
436
|
+
--vb-button-background: transparent;
|
|
437
|
+
--vb-button-background-hover: transparent;
|
|
438
|
+
--vb-button-background-active: transparent;
|
|
439
|
+
--vb-button-foreground: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
440
|
+
--vb-button-foreground-hover: ;
|
|
441
|
+
--vb-button-foreground-active: ;
|
|
442
|
+
--vb-button-border-color: var(--vb-border-color-dark, rgba(0, 0, 0, 0.2));
|
|
443
|
+
--vb-button-border-color-hover: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3));
|
|
444
|
+
--vb-button-border-color-active: ;
|
|
445
|
+
--vb-button-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
446
|
+
--vb-button-box-shadow-focus: 0 0 0 0.2rem rgba(0, 0, 0, 0.15);
|
|
447
|
+
--vb-button-loading-size: 1em;
|
|
448
|
+
--vb-button-loading-border: 2px solid;
|
|
449
|
+
--vb-button-loading-animation-duration: 0.6s;
|
|
450
|
+
--vb-button-loading-animation-timing-function: linear;
|
|
451
|
+
--vb-button-disabled-opacity: 0.6;
|
|
554
452
|
}
|
|
555
453
|
|
|
556
454
|
.button {
|
|
557
455
|
position: relative;
|
|
558
456
|
display: inline-flex;
|
|
457
|
+
gap: var(--vb-button-gap);
|
|
559
458
|
align-items: center;
|
|
560
459
|
justify-content: center;
|
|
561
|
-
min-width:
|
|
562
|
-
height:
|
|
563
|
-
padding:
|
|
564
|
-
transition-property:
|
|
565
|
-
transition-duration:
|
|
566
|
-
transition-timing-function:
|
|
460
|
+
min-width: var(--vb-button-size);
|
|
461
|
+
height: var(--vb-button-size);
|
|
462
|
+
padding: var(--vb-button-padding);
|
|
463
|
+
transition-property: var(--vb-button-transition-property);
|
|
464
|
+
transition-duration: var(--vb-button-transition-duration);
|
|
465
|
+
transition-timing-function: var(--vb-button-transition-timing-function);
|
|
567
466
|
outline: none;
|
|
568
|
-
border:
|
|
569
|
-
border-radius:
|
|
570
|
-
background:
|
|
467
|
+
border: var(--vb-button-border-width) solid var(--vb-button-border-color);
|
|
468
|
+
border-radius: var(--vb-button-border-radius);
|
|
469
|
+
background: var(--vb-button-background);
|
|
571
470
|
background-clip: border-box;
|
|
572
|
-
box-shadow:
|
|
573
|
-
color:
|
|
471
|
+
box-shadow: var(--vb-button-box-shadow);
|
|
472
|
+
color: var(--vb-button-foreground);
|
|
574
473
|
font-family: inherit;
|
|
575
|
-
font-size:
|
|
576
|
-
font-weight:
|
|
577
|
-
line-height:
|
|
474
|
+
font-size: var(--vb-button-font-size);
|
|
475
|
+
font-weight: var(--vb-button-font-weight);
|
|
476
|
+
line-height: var(--vb-button-font-height);
|
|
578
477
|
text-decoration: none;
|
|
579
478
|
white-space: nowrap;
|
|
580
479
|
cursor: pointer;
|
|
581
480
|
}
|
|
582
|
-
.button > * + * {
|
|
583
|
-
margin-left: 0.5rem;
|
|
584
|
-
}
|
|
585
481
|
.button:disabled:not(.is-loading) {
|
|
586
|
-
opacity:
|
|
482
|
+
opacity: var(--vb-button-disabled-opacity);
|
|
587
483
|
pointer-events: none;
|
|
588
484
|
}
|
|
589
485
|
.button:hover {
|
|
590
|
-
border-color:
|
|
591
|
-
background-color:
|
|
486
|
+
border-color: var(--vb-button-border-color-hover);
|
|
487
|
+
background-color: var(--vb-button-background-hover);
|
|
488
|
+
box-shadow: var(--vb-button-box-shadow-hover);
|
|
489
|
+
color: var(--vb-button-foreground-hover);
|
|
592
490
|
}
|
|
593
|
-
.button:focus {
|
|
594
|
-
border-color:
|
|
595
|
-
background-color:
|
|
596
|
-
box-shadow:
|
|
491
|
+
.button:focus-visible {
|
|
492
|
+
border-color: var(--vb-button-border-color-hover);
|
|
493
|
+
background-color: var(--vb-button-background-hover);
|
|
494
|
+
box-shadow: var(--vb-button-box-shadow-focus);
|
|
495
|
+
color: var(--vb-button-foreground-hover);
|
|
597
496
|
}
|
|
598
497
|
.button:active {
|
|
599
|
-
|
|
498
|
+
border-color: var(--vb-button-border-color-active);
|
|
499
|
+
background-color: var(--vb-button-background-active);
|
|
500
|
+
box-shadow: var(--vb-button-box-shadow-active);
|
|
501
|
+
color: var(--vb-button-foreground-active);
|
|
600
502
|
}
|
|
601
503
|
.button.is-loading {
|
|
602
504
|
color: transparent !important;
|
|
603
505
|
pointer-events: none;
|
|
604
506
|
}
|
|
605
507
|
.button.is-loading::after {
|
|
606
|
-
width:
|
|
607
|
-
height:
|
|
508
|
+
width: var(--vb-button-loading-size);
|
|
509
|
+
height: var(--vb-button-loading-size);
|
|
608
510
|
content: "";
|
|
609
511
|
position: absolute;
|
|
610
|
-
top: calc(50% - (
|
|
611
|
-
left: calc(50% - (
|
|
612
|
-
animation: spin
|
|
613
|
-
border:
|
|
512
|
+
top: calc(50% - var(--vb-button-loading-size) * 0.5);
|
|
513
|
+
left: calc(50% - var(--vb-button-loading-size) * 0.5);
|
|
514
|
+
animation: spin var(--vb-button-loading-animation-duration) infinite var(--vb-button-loading-animation-timing-function);
|
|
515
|
+
border: var(--vb-button-loading-border);
|
|
614
516
|
border-radius: 9999px;
|
|
615
|
-
border-color:
|
|
517
|
+
border-color: var(--vb-button-foreground) var(--vb-button-foreground) transparent transparent;
|
|
616
518
|
}
|
|
617
519
|
|
|
618
520
|
@keyframes spin {
|
|
@@ -684,504 +586,85 @@ input::-moz-placeholder {
|
|
|
684
586
|
}
|
|
685
587
|
}
|
|
686
588
|
.button_color_primary {
|
|
687
|
-
|
|
688
|
-
background-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
border-color: transparent;
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
background-color: #00a9bf;
|
|
699
|
-
box-shadow: 0 0 0 0.2rem rgba(0, 188, 212, 0.5);
|
|
700
|
-
}
|
|
701
|
-
.button_color_primary:active {
|
|
702
|
-
border-color: transparent;
|
|
703
|
-
background-color: #0096aa;
|
|
704
|
-
}
|
|
705
|
-
.button_color_primary.is-loading::after {
|
|
706
|
-
border-color: #fff #fff transparent transparent;
|
|
589
|
+
--vb-button-background: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
590
|
+
--vb-button-background-hover: var(--vb-primary-40, hsl(152, 60%, 40%));
|
|
591
|
+
--vb-button-background-active: var(--vb-primary-30, hsl(152, 60%, 30%));
|
|
592
|
+
--vb-button-foreground: white;
|
|
593
|
+
--vb-button-foreground-hover: white;
|
|
594
|
+
--vb-button-foreground-active: white;
|
|
595
|
+
--vb-button-border-color: transparent;
|
|
596
|
+
--vb-button-border-color-hover: transparent;
|
|
597
|
+
--vb-button-border-color-active: transparent;
|
|
598
|
+
--vb-button-box-shadow: 0 0 0 0 hsl(152deg, 60%, 50%, 0%);
|
|
599
|
+
--vb-button-box-shadow-focus: 0 0 0 0.2rem hsl(152deg, 60%, 50%, 50%);
|
|
707
600
|
}
|
|
708
601
|
|
|
709
602
|
.button_color_secondary {
|
|
710
|
-
|
|
711
|
-
background-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
border-color: transparent;
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
background-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
603
|
+
--vb-button-background: var(--vb-secondary-50, hsl(214, 50%, 50%));
|
|
604
|
+
--vb-button-background-hover: var(--vb-secondary-40, hsl(214, 50%, 40%));
|
|
605
|
+
--vb-button-background-active: var(--vb-secondary-30, hsl(214, 50%, 30%));
|
|
606
|
+
--vb-button-foreground: white;
|
|
607
|
+
--vb-button-foreground-hover: white;
|
|
608
|
+
--vb-button-foreground-active: white;
|
|
609
|
+
--vb-button-border-color: transparent;
|
|
610
|
+
--vb-button-border-color-hover: transparent;
|
|
611
|
+
--vb-button-border-color-active: transparent;
|
|
612
|
+
--vb-button-box-shadow: 0 0 0 0 hsl(214deg, 50%, 50%, 0%);
|
|
613
|
+
--vb-button-box-shadow-focus: 0 0 0 0.2rem hsl(214deg, 50%, 50%, 50%);
|
|
614
|
+
}
|
|
615
|
+
|
|
616
|
+
.button_color_neutral {
|
|
617
|
+
--vb-button-background: var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
618
|
+
--vb-button-background-hover: var(--vb-neutral-40, hsl(214, 20%, 40%));
|
|
619
|
+
--vb-button-background-active: var(--vb-neutral-30, hsl(214, 20%, 30%));
|
|
620
|
+
--vb-button-foreground: white;
|
|
621
|
+
--vb-button-foreground-hover: white;
|
|
622
|
+
--vb-button-foreground-active: white;
|
|
623
|
+
--vb-button-border-color: transparent;
|
|
624
|
+
--vb-button-border-color-hover: transparent;
|
|
625
|
+
--vb-button-border-color-active: transparent;
|
|
626
|
+
--vb-button-box-shadow: 0 0 0 0 hsl(214deg, 20%, 50%, 0%);
|
|
627
|
+
--vb-button-box-shadow-focus: 0 0 0 0.2rem hsl(214deg, 20%, 50%, 50%);
|
|
628
|
+
}
|
|
629
|
+
|
|
630
|
+
.button_color_important {
|
|
631
|
+
--vb-button-background: var(--vb-important-50, hsl(0, 80%, 50%));
|
|
632
|
+
--vb-button-background-hover: var(--vb-important-40, hsl(0, 80%, 40%));
|
|
633
|
+
--vb-button-background-active: var(--vb-important-30, hsl(0, 80%, 30%));
|
|
634
|
+
--vb-button-foreground: white;
|
|
635
|
+
--vb-button-foreground-hover: white;
|
|
636
|
+
--vb-button-foreground-active: white;
|
|
637
|
+
--vb-button-border-color: transparent;
|
|
638
|
+
--vb-button-border-color-hover: transparent;
|
|
639
|
+
--vb-button-border-color-active: transparent;
|
|
640
|
+
--vb-button-box-shadow: 0 0 0 0 hsl(0deg, 80%, 50%, 0%);
|
|
641
|
+
--vb-button-box-shadow-focus: 0 0 0 0.2rem hsl(0deg, 80%, 50%, 50%);
|
|
730
642
|
}
|
|
731
643
|
|
|
732
644
|
.button_icon {
|
|
733
|
-
padding: calc(0.5em - 1px);
|
|
645
|
+
--vb-button-padding: calc(0.5em - 1px);
|
|
734
646
|
}
|
|
735
647
|
.button_icon.button_size_sm {
|
|
736
|
-
padding: calc(0.25rem - 1px);
|
|
648
|
+
--vb-button-padding: calc(0.25rem - 1px);
|
|
737
649
|
}
|
|
738
650
|
.button_icon.button_size_lg {
|
|
739
|
-
padding: calc(0.648rem - 1px);
|
|
740
|
-
}
|
|
741
|
-
|
|
742
|
-
.button_invert {
|
|
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;
|
|
651
|
+
--vb-button-padding: calc(0.648rem - 1px);
|
|
763
652
|
}
|
|
764
653
|
|
|
765
654
|
.button_size_sm {
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
line-height: 1.375;
|
|
655
|
+
--vb-button-size: 1.875rem;
|
|
656
|
+
--vb-button-padding: calc(0.25rem - 1px) 0.5rem;
|
|
657
|
+
--vb-button-font-size: 0.875rem;
|
|
658
|
+
--vb-button-line-height: 1.375;
|
|
771
659
|
}
|
|
772
660
|
|
|
773
661
|
.button_size_lg {
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
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 {
|
|
797
|
-
border-color: transparent;
|
|
798
|
-
background-color: #0287c3;
|
|
799
|
-
}
|
|
800
|
-
.button_state_info.is-loading::after {
|
|
801
|
-
border-color: #fff #fff transparent transparent;
|
|
802
|
-
}
|
|
803
|
-
|
|
804
|
-
.button_state_success {
|
|
805
|
-
border-color: transparent;
|
|
806
|
-
background-color: #4caf50;
|
|
807
|
-
box-shadow: 0 0 0 0 rgba(76, 175, 80, 0);
|
|
808
|
-
color: #fff;
|
|
809
|
-
}
|
|
810
|
-
.button_state_success:hover {
|
|
811
|
-
border-color: transparent;
|
|
812
|
-
background-color: #449e48;
|
|
813
|
-
}
|
|
814
|
-
.button_state_success:focus {
|
|
815
|
-
border-color: transparent;
|
|
816
|
-
background-color: #449e48;
|
|
817
|
-
box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5);
|
|
818
|
-
}
|
|
819
|
-
.button_state_success:active {
|
|
820
|
-
border-color: transparent;
|
|
821
|
-
background-color: #3d8c40;
|
|
822
|
-
}
|
|
823
|
-
.button_state_success.is-loading::after {
|
|
824
|
-
border-color: #fff #fff transparent transparent;
|
|
825
|
-
}
|
|
826
|
-
|
|
827
|
-
.button_state_caution {
|
|
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 {
|
|
834
|
-
border-color: transparent;
|
|
835
|
-
background-color: #e68900;
|
|
836
|
-
}
|
|
837
|
-
.button_state_caution:focus {
|
|
838
|
-
border-color: transparent;
|
|
839
|
-
background-color: #e68900;
|
|
840
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.5);
|
|
841
|
-
}
|
|
842
|
-
.button_state_caution:active {
|
|
843
|
-
border-color: transparent;
|
|
844
|
-
background-color: #cc7a00;
|
|
845
|
-
}
|
|
846
|
-
.button_state_caution.is-loading::after {
|
|
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 {
|
|
857
|
-
border-color: transparent;
|
|
858
|
-
background-color: #f2291a;
|
|
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;
|
|
1010
|
-
}
|
|
1011
|
-
.button-group_gap_none > * {
|
|
1012
|
-
margin-top: 0;
|
|
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;
|
|
662
|
+
--vb-button-size: 3.125rem;
|
|
663
|
+
--vb-button-padding: calc(0.648rem - 1px) 1.5rem;
|
|
664
|
+
--vb-button-font-size: 1.125rem;
|
|
665
|
+
--vb-button-line-height: 1.875;
|
|
1023
666
|
}
|
|
1024
667
|
|
|
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;
|
|
1059
|
-
}
|
|
1060
|
-
|
|
1061
|
-
.button-group_join {
|
|
1062
|
-
margin-top: 1px;
|
|
1063
|
-
margin-left: 1px;
|
|
1064
|
-
}
|
|
1065
|
-
.button-group_join > * {
|
|
1066
|
-
margin-top: -1px;
|
|
1067
|
-
margin-left: -1px;
|
|
1068
|
-
border-radius: 0;
|
|
1069
|
-
}
|
|
1070
|
-
.button-group_join > *:first-child {
|
|
1071
|
-
border-top-left-radius: 0.25rem;
|
|
1072
|
-
border-bottom-left-radius: 0.25rem;
|
|
1073
|
-
}
|
|
1074
|
-
.button-group_join > *:last-child {
|
|
1075
|
-
border-top-right-radius: 0.25rem;
|
|
1076
|
-
border-bottom-right-radius: 0.25rem;
|
|
1077
|
-
}
|
|
1078
|
-
|
|
1079
|
-
.button-group_join.button-group_stack > * {
|
|
1080
|
-
border-radius: 0;
|
|
1081
|
-
}
|
|
1082
|
-
.button-group_join.button-group_stack > *:first-child {
|
|
1083
|
-
border-top-left-radius: 0.25rem;
|
|
1084
|
-
border-top-right-radius: 0.25rem;
|
|
1085
|
-
}
|
|
1086
|
-
.button-group_join.button-group_stack > *:last-child {
|
|
1087
|
-
border-bottom-left-radius: 0.25rem;
|
|
1088
|
-
border-bottom-right-radius: 0.25rem;
|
|
1089
|
-
}
|
|
1090
|
-
|
|
1091
|
-
@media (max-width: 479px) {
|
|
1092
|
-
.button-group_join.button-group_stack_xs > * {
|
|
1093
|
-
border-radius: 0;
|
|
1094
|
-
}
|
|
1095
|
-
.button-group_join.button-group_stack_xs > *:first-child {
|
|
1096
|
-
border-top-left-radius: 0.25rem;
|
|
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;
|
|
1158
|
-
}
|
|
1159
|
-
|
|
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
668
|
.card {
|
|
1186
669
|
position: relative;
|
|
1187
670
|
display: flex;
|
|
@@ -1191,8 +674,8 @@ input::-moz-placeholder {
|
|
|
1191
674
|
transition-duration: 0.3s;
|
|
1192
675
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1193
676
|
border-radius: 0.25rem;
|
|
1194
|
-
background:
|
|
1195
|
-
box-shadow: 0
|
|
677
|
+
background: white;
|
|
678
|
+
box-shadow: 0 1px 3px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1196
679
|
}
|
|
1197
680
|
|
|
1198
681
|
.card__header,
|
|
@@ -1213,7 +696,7 @@ input::-moz-placeholder {
|
|
|
1213
696
|
flex: 1 1 auto;
|
|
1214
697
|
}
|
|
1215
698
|
.card__body + .card__body {
|
|
1216
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
699
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1217
700
|
}
|
|
1218
701
|
|
|
1219
702
|
.card__image {
|
|
@@ -1231,7 +714,7 @@ input::-moz-placeholder {
|
|
|
1231
714
|
}
|
|
1232
715
|
|
|
1233
716
|
.card__header {
|
|
1234
|
-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
717
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1235
718
|
}
|
|
1236
719
|
.card__header:first-child {
|
|
1237
720
|
border-top-left-radius: 0.25rem;
|
|
@@ -1239,7 +722,7 @@ input::-moz-placeholder {
|
|
|
1239
722
|
}
|
|
1240
723
|
|
|
1241
724
|
.card__footer {
|
|
1242
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
725
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1243
726
|
}
|
|
1244
727
|
.card__footer:last-child {
|
|
1245
728
|
border-bottom-left-radius: 0.25rem;
|
|
@@ -1250,7 +733,7 @@ input::-moz-placeholder {
|
|
|
1250
733
|
flex-grow: 1;
|
|
1251
734
|
font-size: 1.125rem;
|
|
1252
735
|
font-weight: 600;
|
|
1253
|
-
line-height: 1.
|
|
736
|
+
line-height: 1.875;
|
|
1254
737
|
}
|
|
1255
738
|
|
|
1256
739
|
.card__background,
|
|
@@ -1258,10 +741,7 @@ input::-moz-placeholder {
|
|
|
1258
741
|
width: 100%;
|
|
1259
742
|
height: 100%;
|
|
1260
743
|
position: absolute;
|
|
1261
|
-
|
|
1262
|
-
right: 0;
|
|
1263
|
-
bottom: 0;
|
|
1264
|
-
left: 0;
|
|
744
|
+
inset: 0;
|
|
1265
745
|
transition-property: background-color, border-color, box-shadow, transform;
|
|
1266
746
|
transition-duration: 0.3s;
|
|
1267
747
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
@@ -1275,7 +755,7 @@ input::-moz-placeholder {
|
|
|
1275
755
|
|
|
1276
756
|
.card__screen {
|
|
1277
757
|
z-index: 2;
|
|
1278
|
-
background:
|
|
758
|
+
background: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
1279
759
|
opacity: 0.7;
|
|
1280
760
|
}
|
|
1281
761
|
|
|
@@ -1300,26 +780,13 @@ input::-moz-placeholder {
|
|
|
1300
780
|
opacity: 0.7;
|
|
1301
781
|
}
|
|
1302
782
|
}
|
|
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
783
|
.card_link {
|
|
1317
784
|
transform: translate(0, 0);
|
|
1318
|
-
box-shadow: 0
|
|
785
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1319
786
|
}
|
|
1320
787
|
.card_link:hover, .card_link:focus, .card_link:focus-within {
|
|
1321
788
|
transform: translate(0, -0.25em);
|
|
1322
|
-
box-shadow: 0
|
|
789
|
+
box-shadow: 0 4px 12px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1323
790
|
}
|
|
1324
791
|
|
|
1325
792
|
.card_zoom .card__background {
|
|
@@ -1356,9 +823,9 @@ input::-moz-placeholder {
|
|
|
1356
823
|
display: flex;
|
|
1357
824
|
align-items: center;
|
|
1358
825
|
justify-content: center;
|
|
1359
|
-
border: 2px solid
|
|
826
|
+
border: 2px solid var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
1360
827
|
border-radius: 0.25rem;
|
|
1361
|
-
background-color:
|
|
828
|
+
background-color: white;
|
|
1362
829
|
color: transparent;
|
|
1363
830
|
}
|
|
1364
831
|
|
|
@@ -1383,26 +850,26 @@ input::-moz-placeholder {
|
|
|
1383
850
|
cursor: pointer;
|
|
1384
851
|
}
|
|
1385
852
|
.checkbox__native:hover + .checkbox__background {
|
|
1386
|
-
background-color: rgba(
|
|
853
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
1387
854
|
}
|
|
1388
855
|
.checkbox__native:hover + .checkbox__background .checkbox__box {
|
|
1389
|
-
border-color:
|
|
856
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1390
857
|
}
|
|
1391
858
|
.checkbox__native:focus + .checkbox__background {
|
|
1392
|
-
background-color: rgba(
|
|
859
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
1393
860
|
}
|
|
1394
861
|
.checkbox__native:focus + .checkbox__background .checkbox__box {
|
|
1395
|
-
border-color:
|
|
862
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1396
863
|
}
|
|
1397
864
|
.checkbox__native:focus-visible + .checkbox__background, .checkbox__native:active + .checkbox__background {
|
|
1398
|
-
background-color: rgba(
|
|
865
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.2);
|
|
1399
866
|
}
|
|
1400
867
|
.checkbox__native:focus-visible + .checkbox__background .checkbox__box, .checkbox__native:active + .checkbox__background .checkbox__box {
|
|
1401
|
-
border-color:
|
|
868
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1402
869
|
}
|
|
1403
870
|
.checkbox__native:checked + .checkbox__background .checkbox__box {
|
|
1404
|
-
border-color:
|
|
1405
|
-
background-color:
|
|
871
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
872
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1406
873
|
}
|
|
1407
874
|
.checkbox__native:checked + .checkbox__background .checkbox__icon {
|
|
1408
875
|
transition-property: opacity, background-position;
|
|
@@ -1412,8 +879,8 @@ input::-moz-placeholder {
|
|
|
1412
879
|
opacity: 1;
|
|
1413
880
|
}
|
|
1414
881
|
.checkbox__native:indeterminate + .checkbox__background .checkbox__box {
|
|
1415
|
-
border-color:
|
|
1416
|
-
background-color:
|
|
882
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
883
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1417
884
|
}
|
|
1418
885
|
.checkbox__native:indeterminate + .checkbox__background .checkbox__icon {
|
|
1419
886
|
transition-property: opacity, background-position;
|
|
@@ -1467,9 +934,10 @@ input::-moz-placeholder {
|
|
|
1467
934
|
flex-direction: column;
|
|
1468
935
|
overflow: auto;
|
|
1469
936
|
border-radius: 0.25rem;
|
|
1470
|
-
background:
|
|
937
|
+
background: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
1471
938
|
background-clip: padding-box;
|
|
1472
|
-
box-shadow: 0
|
|
939
|
+
box-shadow: 0 8px 18px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
940
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
1473
941
|
-webkit-overflow-scrolling: touch;
|
|
1474
942
|
}
|
|
1475
943
|
|
|
@@ -1486,7 +954,7 @@ input::-moz-placeholder {
|
|
|
1486
954
|
z-index: 1;
|
|
1487
955
|
display: flex;
|
|
1488
956
|
align-items: center;
|
|
1489
|
-
background:
|
|
957
|
+
background: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
1490
958
|
vertical-align: middle;
|
|
1491
959
|
}
|
|
1492
960
|
.dialog__header > * + *,
|
|
@@ -1496,26 +964,26 @@ input::-moz-placeholder {
|
|
|
1496
964
|
|
|
1497
965
|
.dialog__header {
|
|
1498
966
|
top: 0;
|
|
1499
|
-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
967
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1500
968
|
}
|
|
1501
969
|
|
|
1502
970
|
.dialog__body {
|
|
1503
971
|
flex-grow: 1;
|
|
1504
972
|
}
|
|
1505
973
|
.dialog__body + .dialog__body {
|
|
1506
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
974
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1507
975
|
}
|
|
1508
976
|
|
|
1509
977
|
.dialog__footer {
|
|
1510
978
|
bottom: 0;
|
|
1511
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
979
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
1512
980
|
}
|
|
1513
981
|
|
|
1514
982
|
.dialog__title {
|
|
1515
983
|
flex-grow: 1;
|
|
1516
984
|
font-size: 1.125rem;
|
|
1517
985
|
font-weight: 600;
|
|
1518
|
-
line-height: 1.
|
|
986
|
+
line-height: 1.875;
|
|
1519
987
|
}
|
|
1520
988
|
|
|
1521
989
|
.dialog > .dialog__close {
|
|
@@ -1527,6 +995,15 @@ input::-moz-placeholder {
|
|
|
1527
995
|
padding-right: 3.5em;
|
|
1528
996
|
}
|
|
1529
997
|
|
|
998
|
+
:root {
|
|
999
|
+
--vrembem-prefix: vb-;
|
|
1000
|
+
}
|
|
1001
|
+
|
|
1002
|
+
:root {
|
|
1003
|
+
--vb-drawer-transition-duration: var(--vb-transition-duration, 0.3s);
|
|
1004
|
+
--vb-drawer-transition-timing-function: var(--vb-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1));
|
|
1005
|
+
}
|
|
1006
|
+
|
|
1530
1007
|
/**
|
|
1531
1008
|
* Required structure styles
|
|
1532
1009
|
*/
|
|
@@ -1569,17 +1046,17 @@ input::-moz-placeholder {
|
|
|
1569
1046
|
height: 100%;
|
|
1570
1047
|
overflow: auto;
|
|
1571
1048
|
border-radius: 0;
|
|
1572
|
-
background:
|
|
1049
|
+
background: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
1573
1050
|
box-shadow: none;
|
|
1574
1051
|
opacity: 0;
|
|
1575
1052
|
-webkit-overflow-scrolling: touch;
|
|
1576
1053
|
}
|
|
1577
1054
|
.drawer__dialog .dialog__header,
|
|
1578
1055
|
.drawer__dialog .dialog__footer {
|
|
1579
|
-
background:
|
|
1056
|
+
background: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
1580
1057
|
}
|
|
1581
1058
|
.drawer__dialog .dialog__body {
|
|
1582
|
-
background:
|
|
1059
|
+
background: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
1583
1060
|
}
|
|
1584
1061
|
|
|
1585
1062
|
/**
|
|
@@ -1603,14 +1080,14 @@ input::-moz-placeholder {
|
|
|
1603
1080
|
.drawer.is-opening,
|
|
1604
1081
|
.drawer.is-closing {
|
|
1605
1082
|
transition-property: background-color, opacity, transform;
|
|
1606
|
-
transition-duration:
|
|
1607
|
-
transition-timing-function:
|
|
1083
|
+
transition-duration: var(--vb-drawer-transition-duration);
|
|
1084
|
+
transition-timing-function: var(--vb-drawer-transition-timing-function);
|
|
1608
1085
|
}
|
|
1609
1086
|
.drawer.is-opening .drawer__dialog,
|
|
1610
1087
|
.drawer.is-closing .drawer__dialog {
|
|
1611
1088
|
transition-property: opacity, transform;
|
|
1612
|
-
transition-duration:
|
|
1613
|
-
transition-timing-function:
|
|
1089
|
+
transition-duration: var(--vb-drawer-transition-duration);
|
|
1090
|
+
transition-timing-function: var(--vb-drawer-transition-timing-function);
|
|
1614
1091
|
}
|
|
1615
1092
|
|
|
1616
1093
|
.drawer.is-opening .drawer__dialog,
|
|
@@ -1676,7 +1153,15 @@ input::-moz-placeholder {
|
|
|
1676
1153
|
height: 0;
|
|
1677
1154
|
overflow: hidden;
|
|
1678
1155
|
transform: translateX(0);
|
|
1679
|
-
|
|
1156
|
+
}
|
|
1157
|
+
.drawer_modal::before {
|
|
1158
|
+
content: "";
|
|
1159
|
+
position: absolute;
|
|
1160
|
+
inset: 0;
|
|
1161
|
+
width: 100%;
|
|
1162
|
+
height: 100%;
|
|
1163
|
+
background-color: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
1164
|
+
opacity: 0;
|
|
1680
1165
|
}
|
|
1681
1166
|
.drawer_modal .drawer__dialog {
|
|
1682
1167
|
position: absolute;
|
|
@@ -1685,8 +1170,8 @@ input::-moz-placeholder {
|
|
|
1685
1170
|
width: 18em;
|
|
1686
1171
|
max-width: 80%;
|
|
1687
1172
|
transform: translateX(-100%);
|
|
1688
|
-
background-color:
|
|
1689
|
-
box-shadow: 0
|
|
1173
|
+
background-color: white;
|
|
1174
|
+
box-shadow: 0 12px 24px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
1690
1175
|
}
|
|
1691
1176
|
.drawer_modal.drawer_switch {
|
|
1692
1177
|
right: auto;
|
|
@@ -1700,10 +1185,10 @@ input::-moz-placeholder {
|
|
|
1700
1185
|
}
|
|
1701
1186
|
.drawer_modal .dialog__header,
|
|
1702
1187
|
.drawer_modal .dialog__footer {
|
|
1703
|
-
background:
|
|
1188
|
+
background: white;
|
|
1704
1189
|
}
|
|
1705
1190
|
.drawer_modal .dialog__body {
|
|
1706
|
-
background:
|
|
1191
|
+
background: white;
|
|
1707
1192
|
}
|
|
1708
1193
|
|
|
1709
1194
|
/**
|
|
@@ -1717,10 +1202,18 @@ input::-moz-placeholder {
|
|
|
1717
1202
|
height: 100%;
|
|
1718
1203
|
}
|
|
1719
1204
|
|
|
1205
|
+
.drawer_modal.is-opening::before,
|
|
1206
|
+
.drawer_modal.is-closing::before {
|
|
1207
|
+
transition: opacity var(--vb-drawer-transition-duration) var(--vb-drawer-transition-timing-function);
|
|
1208
|
+
}
|
|
1209
|
+
|
|
1720
1210
|
.drawer_modal.is-opening,
|
|
1721
1211
|
.drawer_modal.is-opened {
|
|
1722
1212
|
transform: translateX(0);
|
|
1723
|
-
|
|
1213
|
+
}
|
|
1214
|
+
.drawer_modal.is-opening::before,
|
|
1215
|
+
.drawer_modal.is-opened::before {
|
|
1216
|
+
opacity: 0.8;
|
|
1724
1217
|
}
|
|
1725
1218
|
.drawer_modal.is-opening .drawer__dialog,
|
|
1726
1219
|
.drawer_modal.is-opened .drawer__dialog {
|
|
@@ -1729,7 +1222,6 @@ input::-moz-placeholder {
|
|
|
1729
1222
|
|
|
1730
1223
|
.drawer_modal.is-closing {
|
|
1731
1224
|
transform: translateX(0);
|
|
1732
|
-
background-color: rgba(66, 66, 66, 0);
|
|
1733
1225
|
}
|
|
1734
1226
|
.drawer_modal.is-closing .drawer__dialog {
|
|
1735
1227
|
transform: translateX(-100%);
|
|
@@ -2334,39 +1826,42 @@ input::-moz-placeholder {
|
|
|
2334
1826
|
}
|
|
2335
1827
|
.icon {
|
|
2336
1828
|
stroke: currentcolor;
|
|
2337
|
-
stroke-width:
|
|
1829
|
+
stroke-width: 2;
|
|
2338
1830
|
fill: none;
|
|
2339
1831
|
display: inline-block;
|
|
2340
1832
|
box-sizing: content-box;
|
|
2341
1833
|
flex-shrink: 0;
|
|
2342
1834
|
width: 1em;
|
|
2343
1835
|
height: 1em;
|
|
2344
|
-
stroke-width: 2px;
|
|
2345
1836
|
stroke-linecap: round;
|
|
2346
1837
|
stroke-linejoin: round;
|
|
2347
|
-
font-size: 1.
|
|
1838
|
+
font-size: 1.5em;
|
|
2348
1839
|
vertical-align: top;
|
|
2349
1840
|
}
|
|
2350
1841
|
|
|
2351
1842
|
.icon_size_xs {
|
|
1843
|
+
stroke-width: 3.5;
|
|
2352
1844
|
font-size: 0.75em;
|
|
2353
1845
|
}
|
|
2354
1846
|
|
|
2355
1847
|
.icon_size_sm {
|
|
2356
|
-
|
|
1848
|
+
stroke-width: 2.5;
|
|
1849
|
+
font-size: 1.125em;
|
|
2357
1850
|
}
|
|
2358
1851
|
|
|
2359
1852
|
.icon_size_lg {
|
|
2360
|
-
|
|
1853
|
+
stroke-width: 1.75;
|
|
1854
|
+
font-size: 2em;
|
|
2361
1855
|
}
|
|
2362
1856
|
|
|
2363
1857
|
.icon_size_xl {
|
|
2364
|
-
|
|
1858
|
+
stroke-width: 1.3;
|
|
1859
|
+
font-size: 3em;
|
|
2365
1860
|
}
|
|
2366
1861
|
|
|
2367
1862
|
.icon_style_stroke {
|
|
2368
1863
|
stroke: currentcolor;
|
|
2369
|
-
stroke-width:
|
|
1864
|
+
stroke-width: 2;
|
|
2370
1865
|
fill: none;
|
|
2371
1866
|
}
|
|
2372
1867
|
|
|
@@ -2376,228 +1871,6 @@ input::-moz-placeholder {
|
|
|
2376
1871
|
fill: currentcolor;
|
|
2377
1872
|
}
|
|
2378
1873
|
|
|
2379
|
-
.icon-action {
|
|
2380
|
-
width: 24px;
|
|
2381
|
-
height: 24px;
|
|
2382
|
-
position: relative;
|
|
2383
|
-
display: inline-flex;
|
|
2384
|
-
flex-shrink: 0;
|
|
2385
|
-
align-items: center;
|
|
2386
|
-
justify-content: center;
|
|
2387
|
-
transition-property: box-shadow, outline, outline-offset;
|
|
2388
|
-
transition-duration: 0.15s;
|
|
2389
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2390
|
-
outline: none;
|
|
2391
|
-
border-radius: 9999px;
|
|
2392
|
-
background: rgba(0, 0, 0, 0.4);
|
|
2393
|
-
background-clip: border-box;
|
|
2394
|
-
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
|
|
2395
|
-
color: #fff;
|
|
2396
|
-
cursor: pointer;
|
|
2397
|
-
}
|
|
2398
|
-
.icon-action:disabled:not(.is-loading) {
|
|
2399
|
-
opacity: 0.6;
|
|
2400
|
-
pointer-events: none;
|
|
2401
|
-
}
|
|
2402
|
-
.icon-action:hover {
|
|
2403
|
-
background-color: rgba(0, 0, 0, 0.5);
|
|
2404
|
-
}
|
|
2405
|
-
.icon-action:focus {
|
|
2406
|
-
background-color: rgba(0, 0, 0, 0.5);
|
|
2407
|
-
box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.2);
|
|
2408
|
-
}
|
|
2409
|
-
.icon-action:active {
|
|
2410
|
-
background-color: rgba(0, 0, 0, 0.6);
|
|
2411
|
-
}
|
|
2412
|
-
.icon-action .icon {
|
|
2413
|
-
stroke-width: 2.5px;
|
|
2414
|
-
font-size: 0.875rem;
|
|
2415
|
-
}
|
|
2416
|
-
.icon-action.is-loading {
|
|
2417
|
-
color: transparent !important;
|
|
2418
|
-
pointer-events: none;
|
|
2419
|
-
}
|
|
2420
|
-
.icon-action.is-loading::after {
|
|
2421
|
-
width: 0.7em;
|
|
2422
|
-
height: 0.7em;
|
|
2423
|
-
content: "";
|
|
2424
|
-
position: absolute;
|
|
2425
|
-
top: calc(50% - (0.7em * 0.5));
|
|
2426
|
-
left: calc(50% - (0.7em * 0.5));
|
|
2427
|
-
animation: spin 0.6s infinite linear;
|
|
2428
|
-
border: 2px solid;
|
|
2429
|
-
border-radius: 9999px;
|
|
2430
|
-
border-color: #fff #fff transparent transparent;
|
|
2431
|
-
}
|
|
2432
|
-
|
|
2433
|
-
@keyframes spin {
|
|
2434
|
-
from {
|
|
2435
|
-
transform: rotate(0deg);
|
|
2436
|
-
}
|
|
2437
|
-
to {
|
|
2438
|
-
transform: rotate(360deg);
|
|
2439
|
-
}
|
|
2440
|
-
}
|
|
2441
|
-
.icon-action_invert {
|
|
2442
|
-
border-color: transparent;
|
|
2443
|
-
background-color: rgba(255, 255, 255, 0.5);
|
|
2444
|
-
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
|
|
2445
|
-
color: #212121;
|
|
2446
|
-
}
|
|
2447
|
-
.icon-action_invert:hover {
|
|
2448
|
-
border-color: transparent;
|
|
2449
|
-
background-color: rgba(255, 255, 255, 0.6);
|
|
2450
|
-
}
|
|
2451
|
-
.icon-action_invert:focus {
|
|
2452
|
-
border-color: transparent;
|
|
2453
|
-
background-color: rgba(255, 255, 255, 0.6);
|
|
2454
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
|
|
2455
|
-
}
|
|
2456
|
-
.icon-action_invert:active {
|
|
2457
|
-
border-color: transparent;
|
|
2458
|
-
background-color: rgba(255, 255, 255, 0.7);
|
|
2459
|
-
}
|
|
2460
|
-
.icon-action_invert.is-loading::after {
|
|
2461
|
-
border-color: #212121 #212121 transparent transparent;
|
|
2462
|
-
}
|
|
2463
|
-
|
|
2464
|
-
.icon-action_state_info {
|
|
2465
|
-
border-color: transparent;
|
|
2466
|
-
background-color: #03a9f4;
|
|
2467
|
-
box-shadow: 0 0 0 0 rgba(3, 169, 244, 0);
|
|
2468
|
-
color: #fff;
|
|
2469
|
-
}
|
|
2470
|
-
.icon-action_state_info:hover {
|
|
2471
|
-
border-color: transparent;
|
|
2472
|
-
background-color: #0398dc;
|
|
2473
|
-
}
|
|
2474
|
-
.icon-action_state_info:focus {
|
|
2475
|
-
border-color: transparent;
|
|
2476
|
-
background-color: #0398dc;
|
|
2477
|
-
box-shadow: 0 0 0 0.2rem rgba(3, 169, 244, 0.5);
|
|
2478
|
-
}
|
|
2479
|
-
.icon-action_state_info:active {
|
|
2480
|
-
border-color: transparent;
|
|
2481
|
-
background-color: #0287c3;
|
|
2482
|
-
}
|
|
2483
|
-
.icon-action_state_info.is-loading::after {
|
|
2484
|
-
border-color: #fff #fff transparent transparent;
|
|
2485
|
-
}
|
|
2486
|
-
|
|
2487
|
-
.icon-action_state_success {
|
|
2488
|
-
border-color: transparent;
|
|
2489
|
-
background-color: #4caf50;
|
|
2490
|
-
box-shadow: 0 0 0 0 rgba(76, 175, 80, 0);
|
|
2491
|
-
color: #fff;
|
|
2492
|
-
}
|
|
2493
|
-
.icon-action_state_success:hover {
|
|
2494
|
-
border-color: transparent;
|
|
2495
|
-
background-color: #449e48;
|
|
2496
|
-
}
|
|
2497
|
-
.icon-action_state_success:focus {
|
|
2498
|
-
border-color: transparent;
|
|
2499
|
-
background-color: #449e48;
|
|
2500
|
-
box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5);
|
|
2501
|
-
}
|
|
2502
|
-
.icon-action_state_success:active {
|
|
2503
|
-
border-color: transparent;
|
|
2504
|
-
background-color: #3d8c40;
|
|
2505
|
-
}
|
|
2506
|
-
.icon-action_state_success.is-loading::after {
|
|
2507
|
-
border-color: #fff #fff transparent transparent;
|
|
2508
|
-
}
|
|
2509
|
-
|
|
2510
|
-
.icon-action_state_caution {
|
|
2511
|
-
border-color: transparent;
|
|
2512
|
-
background-color: #ff9800;
|
|
2513
|
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0);
|
|
2514
|
-
color: #fff;
|
|
2515
|
-
}
|
|
2516
|
-
.icon-action_state_caution:hover {
|
|
2517
|
-
border-color: transparent;
|
|
2518
|
-
background-color: #e68900;
|
|
2519
|
-
}
|
|
2520
|
-
.icon-action_state_caution:focus {
|
|
2521
|
-
border-color: transparent;
|
|
2522
|
-
background-color: #e68900;
|
|
2523
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.5);
|
|
2524
|
-
}
|
|
2525
|
-
.icon-action_state_caution:active {
|
|
2526
|
-
border-color: transparent;
|
|
2527
|
-
background-color: #cc7a00;
|
|
2528
|
-
}
|
|
2529
|
-
.icon-action_state_caution.is-loading::after {
|
|
2530
|
-
border-color: #fff #fff transparent transparent;
|
|
2531
|
-
}
|
|
2532
|
-
|
|
2533
|
-
.icon-action_state_danger {
|
|
2534
|
-
border-color: transparent;
|
|
2535
|
-
background-color: #f44336;
|
|
2536
|
-
box-shadow: 0 0 0 0 rgba(244, 67, 54, 0);
|
|
2537
|
-
color: #fff;
|
|
2538
|
-
}
|
|
2539
|
-
.icon-action_state_danger:hover {
|
|
2540
|
-
border-color: transparent;
|
|
2541
|
-
background-color: #f2291a;
|
|
2542
|
-
}
|
|
2543
|
-
.icon-action_state_danger:focus {
|
|
2544
|
-
border-color: transparent;
|
|
2545
|
-
background-color: #f2291a;
|
|
2546
|
-
box-shadow: 0 0 0 0.2rem rgba(244, 67, 54, 0.5);
|
|
2547
|
-
}
|
|
2548
|
-
.icon-action_state_danger:active {
|
|
2549
|
-
border-color: transparent;
|
|
2550
|
-
background-color: #e21b0c;
|
|
2551
|
-
}
|
|
2552
|
-
.icon-action_state_danger.is-loading::after {
|
|
2553
|
-
border-color: #fff #fff transparent transparent;
|
|
2554
|
-
}
|
|
2555
|
-
|
|
2556
|
-
.icon-action_subtle {
|
|
2557
|
-
border-color: transparent;
|
|
2558
|
-
background-color: transparent;
|
|
2559
|
-
box-shadow: none;
|
|
2560
|
-
color: #212121;
|
|
2561
|
-
}
|
|
2562
|
-
.icon-action_subtle:hover {
|
|
2563
|
-
border-color: transparent;
|
|
2564
|
-
background-color: rgba(33, 33, 33, 0.1);
|
|
2565
|
-
}
|
|
2566
|
-
.icon-action_subtle:focus {
|
|
2567
|
-
border-color: transparent;
|
|
2568
|
-
background-color: rgba(33, 33, 33, 0.1);
|
|
2569
|
-
box-shadow: none;
|
|
2570
|
-
}
|
|
2571
|
-
.icon-action_subtle:active {
|
|
2572
|
-
border-color: transparent;
|
|
2573
|
-
background-color: rgba(33, 33, 33, 0.15);
|
|
2574
|
-
}
|
|
2575
|
-
.icon-action_subtle.is-loading::after {
|
|
2576
|
-
border-color: #212121 #212121 transparent transparent;
|
|
2577
|
-
}
|
|
2578
|
-
.icon-action_subtle.icon-action_invert {
|
|
2579
|
-
border-color: transparent;
|
|
2580
|
-
background-color: transparent;
|
|
2581
|
-
box-shadow: none;
|
|
2582
|
-
color: #fff;
|
|
2583
|
-
}
|
|
2584
|
-
.icon-action_subtle.icon-action_invert:hover {
|
|
2585
|
-
border-color: transparent;
|
|
2586
|
-
background-color: rgba(255, 255, 255, 0.1);
|
|
2587
|
-
}
|
|
2588
|
-
.icon-action_subtle.icon-action_invert:focus {
|
|
2589
|
-
border-color: transparent;
|
|
2590
|
-
background-color: rgba(255, 255, 255, 0.1);
|
|
2591
|
-
box-shadow: none;
|
|
2592
|
-
}
|
|
2593
|
-
.icon-action_subtle.icon-action_invert:active {
|
|
2594
|
-
border-color: transparent;
|
|
2595
|
-
background-color: rgba(255, 255, 255, 0.15);
|
|
2596
|
-
}
|
|
2597
|
-
.icon-action_subtle.icon-action_invert.is-loading::after {
|
|
2598
|
-
border-color: #fff #fff transparent transparent;
|
|
2599
|
-
}
|
|
2600
|
-
|
|
2601
1874
|
.input {
|
|
2602
1875
|
position: relative;
|
|
2603
1876
|
display: block;
|
|
@@ -2609,34 +1882,34 @@ input::-moz-placeholder {
|
|
|
2609
1882
|
transition-duration: 0.15s;
|
|
2610
1883
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2611
1884
|
outline: none;
|
|
2612
|
-
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
1885
|
+
border: 1px solid var(--vb-border-color-dark, rgba(0, 0, 0, 0.2));
|
|
2613
1886
|
border-radius: 0.25rem;
|
|
2614
|
-
background:
|
|
2615
|
-
box-shadow: 0 0 0 0 rgba(
|
|
2616
|
-
color:
|
|
1887
|
+
background: white;
|
|
1888
|
+
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);
|
|
1889
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
2617
1890
|
font-family: blinkmacsystemfont, -apple-system, system-ui, "Segoe UI", "Roboto", "Helvetica Neue", arial, sans-serif;
|
|
2618
1891
|
font-size: 16px;
|
|
2619
|
-
line-height: 1.
|
|
1892
|
+
line-height: 1.625;
|
|
2620
1893
|
-moz-appearance: none;
|
|
2621
1894
|
-webkit-appearance: none;
|
|
2622
1895
|
appearance: none;
|
|
2623
1896
|
}
|
|
2624
1897
|
.input:hover {
|
|
2625
|
-
border-color: rgba(0, 0, 0, 0.
|
|
1898
|
+
border-color: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3));
|
|
2626
1899
|
}
|
|
2627
1900
|
.input:focus {
|
|
2628
|
-
border-color:
|
|
2629
|
-
box-shadow: 0 0 0 0.2rem rgba(
|
|
1901
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
1902
|
+
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);
|
|
2630
1903
|
}
|
|
2631
1904
|
.input:disabled {
|
|
2632
|
-
background-color:
|
|
1905
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
2633
1906
|
pointer-events: none;
|
|
2634
1907
|
}
|
|
2635
1908
|
.input:read-only {
|
|
2636
|
-
background-color:
|
|
1909
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
2637
1910
|
}
|
|
2638
1911
|
.input::placeholder {
|
|
2639
|
-
color:
|
|
1912
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
2640
1913
|
}
|
|
2641
1914
|
|
|
2642
1915
|
.input_auto {
|
|
@@ -2651,76 +1924,37 @@ input::-moz-placeholder {
|
|
|
2651
1924
|
}
|
|
2652
1925
|
|
|
2653
1926
|
.input_size_lg {
|
|
2654
|
-
height: 3.125rem;
|
|
2655
|
-
padding: calc(0.648rem - 1px);
|
|
2656
|
-
font-size: 1.125rem;
|
|
2657
|
-
line-height: 1.
|
|
2658
|
-
}
|
|
2659
|
-
|
|
2660
|
-
.input_state_info {
|
|
2661
|
-
border-color: #03a9f4;
|
|
2662
|
-
box-shadow: 0 0 0 0 rgba(3, 169, 244, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2663
|
-
color: #212121;
|
|
2664
|
-
}
|
|
2665
|
-
.input_state_info:hover {
|
|
2666
|
-
border-color: #03a9f4;
|
|
2667
|
-
}
|
|
2668
|
-
.input_state_info:focus {
|
|
2669
|
-
border-color: #03a9f4;
|
|
2670
|
-
box-shadow: 0 0 0 0.2rem rgba(3, 169, 244, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2671
|
-
}
|
|
2672
|
-
|
|
2673
|
-
.input_state_success {
|
|
2674
|
-
border-color: #4caf50;
|
|
2675
|
-
box-shadow: 0 0 0 0 rgba(76, 175, 80, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2676
|
-
color: #212121;
|
|
2677
|
-
}
|
|
2678
|
-
.input_state_success:hover {
|
|
2679
|
-
border-color: #4caf50;
|
|
2680
|
-
}
|
|
2681
|
-
.input_state_success:focus {
|
|
2682
|
-
border-color: #4caf50;
|
|
2683
|
-
box-shadow: 0 0 0 0.2rem rgba(76, 175, 80, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2684
|
-
}
|
|
2685
|
-
|
|
2686
|
-
.input_state_caution {
|
|
2687
|
-
border-color: #ff9800;
|
|
2688
|
-
box-shadow: 0 0 0 0 rgba(255, 152, 0, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
2689
|
-
color: #212121;
|
|
2690
|
-
}
|
|
2691
|
-
.input_state_caution:hover {
|
|
2692
|
-
border-color: #ff9800;
|
|
2693
|
-
}
|
|
2694
|
-
.input_state_caution:focus {
|
|
2695
|
-
border-color: #ff9800;
|
|
2696
|
-
box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
1927
|
+
height: 3.125rem;
|
|
1928
|
+
padding: calc(0.648rem - 1px);
|
|
1929
|
+
font-size: 1.125rem;
|
|
1930
|
+
line-height: 1.875;
|
|
2697
1931
|
}
|
|
2698
1932
|
|
|
2699
|
-
.
|
|
2700
|
-
border-color:
|
|
2701
|
-
box-shadow: 0 0 0 0 rgba(
|
|
2702
|
-
color:
|
|
1933
|
+
.input_error {
|
|
1934
|
+
border-color: hsl(0, 80%, 50%);
|
|
1935
|
+
box-shadow: 0 0 0 0 rgba(230, 26, 26, 0), inset 0 0.1rem 0.2rem rgba(0, 0, 0, 0.1);
|
|
1936
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
2703
1937
|
}
|
|
2704
|
-
.
|
|
2705
|
-
border-color:
|
|
1938
|
+
.input_error:hover {
|
|
1939
|
+
border-color: hsl(0, 80%, 50%);
|
|
2706
1940
|
}
|
|
2707
|
-
.
|
|
2708
|
-
border-color:
|
|
2709
|
-
box-shadow: 0 0 0 0.2rem rgba(
|
|
1941
|
+
.input_error:focus {
|
|
1942
|
+
border-color: hsl(0, 80%, 50%);
|
|
1943
|
+
box-shadow: 0 0 0 0.2rem rgba(230, 26, 26, 0.5), inset 0 0 0 rgba(0, 0, 0, 0);
|
|
2710
1944
|
}
|
|
2711
1945
|
|
|
2712
1946
|
.input_type_select {
|
|
2713
1947
|
padding-right: 2em;
|
|
2714
|
-
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="12" fill="%
|
|
1948
|
+
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>');
|
|
2715
1949
|
background-repeat: no-repeat;
|
|
2716
1950
|
background-position: 100% center;
|
|
2717
1951
|
cursor: pointer;
|
|
2718
1952
|
}
|
|
2719
1953
|
.input_type_select:read-only {
|
|
2720
|
-
background-color:
|
|
1954
|
+
background-color: white;
|
|
2721
1955
|
}
|
|
2722
1956
|
.input_type_select:disabled {
|
|
2723
|
-
background-color:
|
|
1957
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%)));
|
|
2724
1958
|
}
|
|
2725
1959
|
|
|
2726
1960
|
.input_type_textarea {
|
|
@@ -2738,203 +1972,86 @@ input::-moz-placeholder {
|
|
|
2738
1972
|
}
|
|
2739
1973
|
|
|
2740
1974
|
.level {
|
|
2741
|
-
|
|
2742
|
-
margin-left: -0.5em;
|
|
1975
|
+
gap: 0.5em;
|
|
2743
1976
|
display: flex;
|
|
2744
1977
|
flex-wrap: wrap;
|
|
2745
1978
|
align-items: center;
|
|
2746
1979
|
}
|
|
2747
|
-
.level > * {
|
|
2748
|
-
margin-top: 0.5em;
|
|
2749
|
-
margin-left: 0.5em;
|
|
2750
|
-
}
|
|
2751
|
-
.level + .level {
|
|
2752
|
-
margin-top: 0;
|
|
2753
|
-
}
|
|
2754
1980
|
.level > * {
|
|
2755
1981
|
flex: 0 0 auto;
|
|
2756
|
-
max-width:
|
|
1982
|
+
max-width: 100%;
|
|
2757
1983
|
}
|
|
2758
1984
|
|
|
2759
1985
|
.level_gap_none {
|
|
2760
|
-
|
|
2761
|
-
margin-left: 0;
|
|
2762
|
-
}
|
|
2763
|
-
.level_gap_none > * {
|
|
2764
|
-
margin-top: 0;
|
|
2765
|
-
margin-left: 0;
|
|
2766
|
-
}
|
|
2767
|
-
.level_gap_none > * {
|
|
2768
|
-
max-width: 100%;
|
|
1986
|
+
gap: 0;
|
|
2769
1987
|
}
|
|
2770
1988
|
|
|
2771
1989
|
.level_gap-x_none {
|
|
2772
|
-
|
|
2773
|
-
}
|
|
2774
|
-
.level_gap-x_none > * {
|
|
2775
|
-
margin-left: 0;
|
|
2776
|
-
}
|
|
2777
|
-
.level_gap-x_none > * {
|
|
2778
|
-
max-width: 100%;
|
|
1990
|
+
column-gap: 0;
|
|
2779
1991
|
}
|
|
2780
1992
|
|
|
2781
1993
|
.level_gap-y_none {
|
|
2782
|
-
|
|
2783
|
-
}
|
|
2784
|
-
.level_gap-y_none > * {
|
|
2785
|
-
margin-top: 0;
|
|
1994
|
+
row-gap: 0;
|
|
2786
1995
|
}
|
|
2787
1996
|
|
|
2788
1997
|
.level_gap_xs {
|
|
2789
|
-
|
|
2790
|
-
margin-left: -1px;
|
|
2791
|
-
}
|
|
2792
|
-
.level_gap_xs > * {
|
|
2793
|
-
margin-top: 1px;
|
|
2794
|
-
margin-left: 1px;
|
|
2795
|
-
}
|
|
2796
|
-
.level_gap_xs > * {
|
|
2797
|
-
max-width: calc(100% - 1px);
|
|
1998
|
+
gap: 1px;
|
|
2798
1999
|
}
|
|
2799
2000
|
|
|
2800
2001
|
.level_gap-x_xs {
|
|
2801
|
-
|
|
2802
|
-
}
|
|
2803
|
-
.level_gap-x_xs > * {
|
|
2804
|
-
margin-left: 1px;
|
|
2805
|
-
}
|
|
2806
|
-
.level_gap-x_xs > * {
|
|
2807
|
-
max-width: calc(100% - 1px);
|
|
2002
|
+
column-gap: 1px;
|
|
2808
2003
|
}
|
|
2809
2004
|
|
|
2810
2005
|
.level_gap-y_xs {
|
|
2811
|
-
|
|
2812
|
-
}
|
|
2813
|
-
.level_gap-y_xs > * {
|
|
2814
|
-
margin-top: 1px;
|
|
2006
|
+
row-gap: 1px;
|
|
2815
2007
|
}
|
|
2816
2008
|
|
|
2817
2009
|
.level_gap_sm {
|
|
2818
|
-
|
|
2819
|
-
margin-left: -0.25em;
|
|
2820
|
-
}
|
|
2821
|
-
.level_gap_sm > * {
|
|
2822
|
-
margin-top: 0.25em;
|
|
2823
|
-
margin-left: 0.25em;
|
|
2824
|
-
}
|
|
2825
|
-
.level_gap_sm > * {
|
|
2826
|
-
max-width: calc(100% - 0.25em);
|
|
2010
|
+
gap: 0.25em;
|
|
2827
2011
|
}
|
|
2828
2012
|
|
|
2829
2013
|
.level_gap-x_sm {
|
|
2830
|
-
|
|
2831
|
-
}
|
|
2832
|
-
.level_gap-x_sm > * {
|
|
2833
|
-
margin-left: 0.25em;
|
|
2834
|
-
}
|
|
2835
|
-
.level_gap-x_sm > * {
|
|
2836
|
-
max-width: calc(100% - 0.25em);
|
|
2014
|
+
column-gap: 0.25em;
|
|
2837
2015
|
}
|
|
2838
2016
|
|
|
2839
2017
|
.level_gap-y_sm {
|
|
2840
|
-
|
|
2841
|
-
}
|
|
2842
|
-
.level_gap-y_sm > * {
|
|
2843
|
-
margin-top: 0.25em;
|
|
2018
|
+
row-gap: 0.25em;
|
|
2844
2019
|
}
|
|
2845
2020
|
|
|
2846
2021
|
.level_gap_md {
|
|
2847
|
-
|
|
2848
|
-
margin-left: -0.5em;
|
|
2849
|
-
}
|
|
2850
|
-
.level_gap_md > * {
|
|
2851
|
-
margin-top: 0.5em;
|
|
2852
|
-
margin-left: 0.5em;
|
|
2853
|
-
}
|
|
2854
|
-
.level_gap_md > * {
|
|
2855
|
-
max-width: calc(100% - 0.5em);
|
|
2022
|
+
gap: 0.5em;
|
|
2856
2023
|
}
|
|
2857
2024
|
|
|
2858
2025
|
.level_gap-x_md {
|
|
2859
|
-
|
|
2860
|
-
}
|
|
2861
|
-
.level_gap-x_md > * {
|
|
2862
|
-
margin-left: 0.5em;
|
|
2863
|
-
}
|
|
2864
|
-
.level_gap-x_md > * {
|
|
2865
|
-
max-width: calc(100% - 0.5em);
|
|
2026
|
+
column-gap: 0.5em;
|
|
2866
2027
|
}
|
|
2867
2028
|
|
|
2868
2029
|
.level_gap-y_md {
|
|
2869
|
-
|
|
2870
|
-
}
|
|
2871
|
-
.level_gap-y_md > * {
|
|
2872
|
-
margin-top: 0.5em;
|
|
2030
|
+
row-gap: 0.5em;
|
|
2873
2031
|
}
|
|
2874
2032
|
|
|
2875
2033
|
.level_gap_lg {
|
|
2876
|
-
|
|
2877
|
-
margin-left: -1em;
|
|
2878
|
-
}
|
|
2879
|
-
.level_gap_lg > * {
|
|
2880
|
-
margin-top: 1em;
|
|
2881
|
-
margin-left: 1em;
|
|
2882
|
-
}
|
|
2883
|
-
.level_gap_lg > * {
|
|
2884
|
-
max-width: calc(100% - 1em);
|
|
2034
|
+
gap: 1em;
|
|
2885
2035
|
}
|
|
2886
2036
|
|
|
2887
2037
|
.level_gap-x_lg {
|
|
2888
|
-
|
|
2889
|
-
}
|
|
2890
|
-
.level_gap-x_lg > * {
|
|
2891
|
-
margin-left: 1em;
|
|
2892
|
-
}
|
|
2893
|
-
.level_gap-x_lg > * {
|
|
2894
|
-
max-width: calc(100% - 1em);
|
|
2038
|
+
column-gap: 1em;
|
|
2895
2039
|
}
|
|
2896
2040
|
|
|
2897
2041
|
.level_gap-y_lg {
|
|
2898
|
-
|
|
2899
|
-
}
|
|
2900
|
-
.level_gap-y_lg > * {
|
|
2901
|
-
margin-top: 1em;
|
|
2042
|
+
row-gap: 1em;
|
|
2902
2043
|
}
|
|
2903
2044
|
|
|
2904
2045
|
.level_gap_xl {
|
|
2905
|
-
|
|
2906
|
-
margin-left: -1.5em;
|
|
2907
|
-
}
|
|
2908
|
-
.level_gap_xl > * {
|
|
2909
|
-
margin-top: 1.5em;
|
|
2910
|
-
margin-left: 1.5em;
|
|
2911
|
-
}
|
|
2912
|
-
.level_gap_xl > * {
|
|
2913
|
-
max-width: calc(100% - 1.5em);
|
|
2046
|
+
gap: 1.5em;
|
|
2914
2047
|
}
|
|
2915
2048
|
|
|
2916
2049
|
.level_gap-x_xl {
|
|
2917
|
-
|
|
2918
|
-
}
|
|
2919
|
-
.level_gap-x_xl > * {
|
|
2920
|
-
margin-left: 1.5em;
|
|
2921
|
-
}
|
|
2922
|
-
.level_gap-x_xl > * {
|
|
2923
|
-
max-width: calc(100% - 1.5em);
|
|
2050
|
+
column-gap: 1.5em;
|
|
2924
2051
|
}
|
|
2925
2052
|
|
|
2926
2053
|
.level_gap-y_xl {
|
|
2927
|
-
|
|
2928
|
-
}
|
|
2929
|
-
.level_gap-y_xl > * {
|
|
2930
|
-
margin-top: 1.5em;
|
|
2931
|
-
}
|
|
2932
|
-
|
|
2933
|
-
.level_nowrap {
|
|
2934
|
-
flex-wrap: nowrap;
|
|
2935
|
-
}
|
|
2936
|
-
.level_nowrap > * {
|
|
2937
|
-
flex-shrink: 1;
|
|
2054
|
+
row-gap: 1.5em;
|
|
2938
2055
|
}
|
|
2939
2056
|
|
|
2940
2057
|
.media {
|
|
@@ -2954,7 +2071,7 @@ input::-moz-placeholder {
|
|
|
2954
2071
|
flex: 0 0 auto;
|
|
2955
2072
|
align-items: center;
|
|
2956
2073
|
max-width: 30%;
|
|
2957
|
-
min-height: 1.
|
|
2074
|
+
min-height: 1.625em;
|
|
2958
2075
|
}
|
|
2959
2076
|
|
|
2960
2077
|
.media_gap_none > * + * {
|
|
@@ -3292,7 +2409,7 @@ input::-moz-placeholder {
|
|
|
3292
2409
|
width: auto;
|
|
3293
2410
|
height: 1px;
|
|
3294
2411
|
margin: 0.5em 0;
|
|
3295
|
-
background: rgba(0, 0, 0, 0.1);
|
|
2412
|
+
background: var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
3296
2413
|
}
|
|
3297
2414
|
.menu__sep:first-child {
|
|
3298
2415
|
margin-top: 0;
|
|
@@ -3312,7 +2429,7 @@ input::-moz-placeholder {
|
|
|
3312
2429
|
padding: 0.5em 1em;
|
|
3313
2430
|
border-radius: 0.25rem;
|
|
3314
2431
|
background: none;
|
|
3315
|
-
color:
|
|
2432
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
3316
2433
|
white-space: normal;
|
|
3317
2434
|
}
|
|
3318
2435
|
.menu__action > * {
|
|
@@ -3325,32 +2442,36 @@ input::-moz-placeholder {
|
|
|
3325
2442
|
padding: 0.5em;
|
|
3326
2443
|
}
|
|
3327
2444
|
.menu__action:hover {
|
|
3328
|
-
background: rgba(0, 0, 0, 0.05);
|
|
2445
|
+
background: var(--vb-background-hover, rgba(0, 0, 0, 0.05));
|
|
3329
2446
|
}
|
|
3330
2447
|
.menu__action:focus {
|
|
3331
2448
|
outline: none;
|
|
3332
|
-
background: rgba(0, 0, 0, 0.05);
|
|
2449
|
+
background: var(--vb-background-focus, rgba(0, 0, 0, 0.05));
|
|
2450
|
+
}
|
|
2451
|
+
.menu__action:focus-visible {
|
|
2452
|
+
z-index: 1;
|
|
2453
|
+
outline: 2px solid var(--vb-focus-visible, var(--vb-primary-50, hsl(152, 60%, 50%)));
|
|
3333
2454
|
}
|
|
3334
2455
|
.menu__action:active {
|
|
3335
|
-
background: rgba(0, 0, 0, 0.1);
|
|
2456
|
+
background: var(--vb-background-active, rgba(0, 0, 0, 0.1));
|
|
3336
2457
|
}
|
|
3337
2458
|
.menu__action.is-active, .menu__action.is-active[disabled] {
|
|
3338
2459
|
background: none;
|
|
3339
|
-
color:
|
|
2460
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3340
2461
|
cursor: pointer;
|
|
3341
2462
|
}
|
|
3342
2463
|
.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 {
|
|
3343
2464
|
background: none;
|
|
3344
|
-
color:
|
|
2465
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3345
2466
|
}
|
|
3346
2467
|
.menu__action.is-disabled, .menu__action[disabled] {
|
|
3347
2468
|
background: none;
|
|
3348
|
-
color:
|
|
2469
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
3349
2470
|
cursor: default;
|
|
3350
2471
|
}
|
|
3351
2472
|
.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 {
|
|
3352
2473
|
background: none;
|
|
3353
|
-
color:
|
|
2474
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%)));
|
|
3354
2475
|
}
|
|
3355
2476
|
|
|
3356
2477
|
.menu__text {
|
|
@@ -3553,38 +2674,6 @@ input::-moz-placeholder {
|
|
|
3553
2674
|
white-space: nowrap;
|
|
3554
2675
|
}
|
|
3555
2676
|
}
|
|
3556
|
-
.menu_invert .menu__sep {
|
|
3557
|
-
background: rgba(255, 255, 255, 0.1);
|
|
3558
|
-
}
|
|
3559
|
-
.menu_invert .menu__action {
|
|
3560
|
-
color: #fff;
|
|
3561
|
-
}
|
|
3562
|
-
.menu_invert .menu__action:hover {
|
|
3563
|
-
background: rgba(255, 255, 255, 0.05);
|
|
3564
|
-
}
|
|
3565
|
-
.menu_invert .menu__action:focus {
|
|
3566
|
-
background: rgba(255, 255, 255, 0.05);
|
|
3567
|
-
}
|
|
3568
|
-
.menu_invert .menu__action:active {
|
|
3569
|
-
background: rgba(255, 255, 255, 0.1);
|
|
3570
|
-
}
|
|
3571
|
-
.menu_invert .menu__action.is-active, .menu_invert .menu__action.is-active[disabled] {
|
|
3572
|
-
background: none;
|
|
3573
|
-
color: #00bcd4;
|
|
3574
|
-
}
|
|
3575
|
-
.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 {
|
|
3576
|
-
background: none;
|
|
3577
|
-
color: #00bcd4;
|
|
3578
|
-
}
|
|
3579
|
-
.menu_invert .menu__action.is-disabled, .menu_invert .menu__action[disabled] {
|
|
3580
|
-
background: none;
|
|
3581
|
-
color: rgba(255, 255, 255, 0.5);
|
|
3582
|
-
}
|
|
3583
|
-
.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 {
|
|
3584
|
-
background: none;
|
|
3585
|
-
color: rgba(255, 255, 255, 0.5);
|
|
3586
|
-
}
|
|
3587
|
-
|
|
3588
2677
|
.menu_size_sm {
|
|
3589
2678
|
font-size: 0.875rem;
|
|
3590
2679
|
line-height: 1.375;
|
|
@@ -3600,7 +2689,7 @@ input::-moz-placeholder {
|
|
|
3600
2689
|
|
|
3601
2690
|
.menu_size_lg {
|
|
3602
2691
|
font-size: 1.125rem;
|
|
3603
|
-
line-height: 1.
|
|
2692
|
+
line-height: 1.875;
|
|
3604
2693
|
}
|
|
3605
2694
|
.menu_size_lg .menu__action {
|
|
3606
2695
|
min-width: 3.125rem;
|
|
@@ -3611,6 +2700,11 @@ input::-moz-placeholder {
|
|
|
3611
2700
|
padding: 0.648rem;
|
|
3612
2701
|
}
|
|
3613
2702
|
|
|
2703
|
+
:root {
|
|
2704
|
+
--vb-modal-transition-duration: var(--vb-transition-duration, 0.3s);
|
|
2705
|
+
--vb-modal-transition-timing-function: var(--vb-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1));
|
|
2706
|
+
}
|
|
2707
|
+
|
|
3614
2708
|
.modal {
|
|
3615
2709
|
position: fixed;
|
|
3616
2710
|
z-index: 1000;
|
|
@@ -3624,7 +2718,15 @@ input::-moz-placeholder {
|
|
|
3624
2718
|
width: 0;
|
|
3625
2719
|
height: 0;
|
|
3626
2720
|
overflow: hidden;
|
|
3627
|
-
|
|
2721
|
+
}
|
|
2722
|
+
.modal::before {
|
|
2723
|
+
content: "";
|
|
2724
|
+
position: absolute;
|
|
2725
|
+
inset: 0;
|
|
2726
|
+
width: 100%;
|
|
2727
|
+
height: 100%;
|
|
2728
|
+
background-color: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
2729
|
+
opacity: 0;
|
|
3628
2730
|
}
|
|
3629
2731
|
|
|
3630
2732
|
.modal__dialog {
|
|
@@ -3633,17 +2735,17 @@ input::-moz-placeholder {
|
|
|
3633
2735
|
overflow: auto;
|
|
3634
2736
|
transform: translateY(-5em);
|
|
3635
2737
|
transition-property: outline;
|
|
3636
|
-
transition-duration:
|
|
3637
|
-
transition-timing-function:
|
|
3638
|
-
outline: 0 solid
|
|
3639
|
-
box-shadow: 0
|
|
2738
|
+
transition-duration: var(--vb-modal-transition-duration);
|
|
2739
|
+
transition-timing-function: var(--vb-modal-transition-timing-function);
|
|
2740
|
+
outline: 0 solid transparent;
|
|
2741
|
+
box-shadow: 0 12px 24px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
3640
2742
|
opacity: 0;
|
|
3641
2743
|
}
|
|
3642
2744
|
.modal__dialog:focus {
|
|
3643
|
-
outline: 4px solid
|
|
2745
|
+
outline: 4px solid var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3644
2746
|
}
|
|
3645
2747
|
.modal__dialog[role=alertdialog]:focus {
|
|
3646
|
-
outline: 4px solid
|
|
2748
|
+
outline: 4px solid var(--vb-important-50, hsl(0, 80%, 50%));
|
|
3647
2749
|
}
|
|
3648
2750
|
|
|
3649
2751
|
.modal.is-closed {
|
|
@@ -3659,20 +2761,20 @@ input::-moz-placeholder {
|
|
|
3659
2761
|
padding: 1em;
|
|
3660
2762
|
}
|
|
3661
2763
|
|
|
3662
|
-
.modal.is-opening,
|
|
3663
|
-
.modal.is-closing {
|
|
3664
|
-
transition:
|
|
2764
|
+
.modal.is-opening::before,
|
|
2765
|
+
.modal.is-closing::before {
|
|
2766
|
+
transition: opacity var(--vb-modal-transition-duration) var(--vb-modal-transition-timing-function);
|
|
3665
2767
|
}
|
|
3666
2768
|
.modal.is-opening .modal__dialog,
|
|
3667
2769
|
.modal.is-closing .modal__dialog {
|
|
3668
2770
|
transition-property: opacity, transform;
|
|
3669
|
-
transition-duration:
|
|
3670
|
-
transition-timing-function:
|
|
2771
|
+
transition-duration: var(--vb-modal-transition-duration);
|
|
2772
|
+
transition-timing-function: var(--vb-modal-transition-timing-function);
|
|
3671
2773
|
}
|
|
3672
2774
|
|
|
3673
|
-
.modal.is-opening,
|
|
3674
|
-
.modal.is-opened {
|
|
3675
|
-
|
|
2775
|
+
.modal.is-opening::before,
|
|
2776
|
+
.modal.is-opened::before {
|
|
2777
|
+
opacity: 0.8;
|
|
3676
2778
|
}
|
|
3677
2779
|
.modal.is-opening .modal__dialog,
|
|
3678
2780
|
.modal.is-opened .modal__dialog {
|
|
@@ -3693,7 +2795,7 @@ input::-moz-placeholder {
|
|
|
3693
2795
|
transform: scale(1);
|
|
3694
2796
|
}
|
|
3695
2797
|
.modal_full.is-closing .modal__dialog {
|
|
3696
|
-
transform: scale(
|
|
2798
|
+
transform: scale(0.75);
|
|
3697
2799
|
}
|
|
3698
2800
|
|
|
3699
2801
|
.modal_pos_top {
|
|
@@ -3761,8 +2863,11 @@ input::-moz-placeholder {
|
|
|
3761
2863
|
|
|
3762
2864
|
.notice {
|
|
3763
2865
|
padding: 1em;
|
|
2866
|
+
border: var(--vb-notice-border);
|
|
3764
2867
|
border-radius: 0.25rem;
|
|
3765
|
-
background:
|
|
2868
|
+
background: var(--vb-notice-background, var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%))));
|
|
2869
|
+
box-shadow: var(--vb-notice-shadow);
|
|
2870
|
+
color: var(--vb-notice-foreground, var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))));
|
|
3766
2871
|
}
|
|
3767
2872
|
.notice > * + * {
|
|
3768
2873
|
margin-top: 0.5em;
|
|
@@ -3771,31 +2876,36 @@ input::-moz-placeholder {
|
|
|
3771
2876
|
.notice__title {
|
|
3772
2877
|
font-size: 1.125rem;
|
|
3773
2878
|
font-weight: 600;
|
|
3774
|
-
line-height: 1.
|
|
2879
|
+
line-height: 1.875;
|
|
3775
2880
|
}
|
|
3776
2881
|
|
|
3777
|
-
.
|
|
3778
|
-
background-color:
|
|
3779
|
-
color:
|
|
2882
|
+
.notice_theme_primary {
|
|
2883
|
+
background-color: var(--vb-primary-90, hsl(152, 60%, 90%));
|
|
2884
|
+
color: var(--vb-primary-30, hsl(152, 60%, 30%));
|
|
3780
2885
|
}
|
|
3781
2886
|
|
|
3782
|
-
.
|
|
3783
|
-
background-color:
|
|
3784
|
-
color:
|
|
2887
|
+
.notice_theme_secondary {
|
|
2888
|
+
background-color: var(--vb-secondary-90, hsl(214, 50%, 90%));
|
|
2889
|
+
color: var(--vb-secondary-30, hsl(214, 50%, 30%));
|
|
3785
2890
|
}
|
|
3786
2891
|
|
|
3787
|
-
.
|
|
3788
|
-
background-color:
|
|
3789
|
-
color:
|
|
2892
|
+
.notice_theme_neutral {
|
|
2893
|
+
background-color: var(--vb-neutral-90, hsl(214, 20%, 90%));
|
|
2894
|
+
color: var(--vb-neutral-30, hsl(214, 20%, 30%));
|
|
3790
2895
|
}
|
|
3791
2896
|
|
|
3792
|
-
.
|
|
3793
|
-
background-color:
|
|
3794
|
-
color:
|
|
2897
|
+
.notice_theme_important {
|
|
2898
|
+
background-color: var(--vb-important-90, hsl(0, 80%, 90%));
|
|
2899
|
+
color: var(--vb-important-30, hsl(0, 80%, 30%));
|
|
3795
2900
|
}
|
|
3796
2901
|
|
|
3797
|
-
:root {
|
|
3798
|
-
--
|
|
2902
|
+
:root, .vb-theme-root {
|
|
2903
|
+
--vb-notice-background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
2904
|
+
--vb-notice-foreground: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
2905
|
+
}
|
|
2906
|
+
.vb-theme-light {
|
|
2907
|
+
--vb-notice-background: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%)));
|
|
2908
|
+
--vb-notice-foreground: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
3799
2909
|
}
|
|
3800
2910
|
|
|
3801
2911
|
:root {
|
|
@@ -3816,18 +2926,16 @@ input::-moz-placeholder {
|
|
|
3816
2926
|
margin: calc(var(--vb-popover-offset) * 1px) 0 0;
|
|
3817
2927
|
padding: 0.5em;
|
|
3818
2928
|
border-radius: 0.25rem;
|
|
3819
|
-
background:
|
|
2929
|
+
background: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
3820
2930
|
background-clip: padding-box;
|
|
3821
|
-
box-shadow: 0
|
|
2931
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%));
|
|
2932
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
3822
2933
|
font-size: 0.875rem;
|
|
3823
2934
|
}
|
|
3824
2935
|
.popover::before {
|
|
3825
2936
|
content: "";
|
|
3826
2937
|
position: absolute;
|
|
3827
|
-
|
|
3828
|
-
right: 0;
|
|
3829
|
-
bottom: 100%;
|
|
3830
|
-
left: 0;
|
|
2938
|
+
inset: auto 0 100%;
|
|
3831
2939
|
width: 100%;
|
|
3832
2940
|
height: calc((var(--vb-popover-offset) + 1) * 1px);
|
|
3833
2941
|
}
|
|
@@ -3843,10 +2951,7 @@ input::-moz-placeholder {
|
|
|
3843
2951
|
margin: 0 0 calc(var(--vb-popover-offset) * 1px) 0;
|
|
3844
2952
|
}
|
|
3845
2953
|
.popover[data-popper-placement^=top]::before {
|
|
3846
|
-
|
|
3847
|
-
right: 0;
|
|
3848
|
-
bottom: auto;
|
|
3849
|
-
left: 0;
|
|
2954
|
+
inset: 100% 0 auto;
|
|
3850
2955
|
width: 100%;
|
|
3851
2956
|
height: calc((var(--vb-popover-offset) + 1) * 1px);
|
|
3852
2957
|
}
|
|
@@ -3855,10 +2960,7 @@ input::-moz-placeholder {
|
|
|
3855
2960
|
margin: calc(var(--vb-popover-offset) * 1px) 0 0 0;
|
|
3856
2961
|
}
|
|
3857
2962
|
.popover[data-popper-placement^=bottom]::before {
|
|
3858
|
-
|
|
3859
|
-
right: 0;
|
|
3860
|
-
bottom: 100%;
|
|
3861
|
-
left: 0;
|
|
2963
|
+
inset: auto 0 100%;
|
|
3862
2964
|
width: 100%;
|
|
3863
2965
|
height: calc((var(--vb-popover-offset) + 1) * 1px);
|
|
3864
2966
|
}
|
|
@@ -3867,10 +2969,7 @@ input::-moz-placeholder {
|
|
|
3867
2969
|
margin: 0 calc(var(--vb-popover-offset) * 1px) 0 0;
|
|
3868
2970
|
}
|
|
3869
2971
|
.popover[data-popper-placement^=left]::before {
|
|
3870
|
-
|
|
3871
|
-
right: auto;
|
|
3872
|
-
bottom: 0;
|
|
3873
|
-
left: 100%;
|
|
2972
|
+
inset: 0 auto 0 100%;
|
|
3874
2973
|
width: calc((var(--vb-popover-offset) + 1) * 1px);
|
|
3875
2974
|
height: 100%;
|
|
3876
2975
|
}
|
|
@@ -3879,10 +2978,7 @@ input::-moz-placeholder {
|
|
|
3879
2978
|
margin: 0 0 0 calc(var(--vb-popover-offset) * 1px);
|
|
3880
2979
|
}
|
|
3881
2980
|
.popover[data-popper-placement^=right]::before {
|
|
3882
|
-
|
|
3883
|
-
right: 100%;
|
|
3884
|
-
bottom: 0;
|
|
3885
|
-
left: auto;
|
|
2981
|
+
inset: 0 100% 0 auto;
|
|
3886
2982
|
width: calc((var(--vb-popover-offset) + 1) * 1px);
|
|
3887
2983
|
height: 100%;
|
|
3888
2984
|
}
|
|
@@ -3901,7 +2997,7 @@ input::-moz-placeholder {
|
|
|
3901
2997
|
content: "";
|
|
3902
2998
|
visibility: visible;
|
|
3903
2999
|
transform: rotate(45deg);
|
|
3904
|
-
border: var(--vb-popover-arrow-border, 1px solid rgba(0, 0, 0, 0.
|
|
3000
|
+
border: var(--vb-popover-arrow-border, 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)));
|
|
3905
3001
|
border-right-color: transparent;
|
|
3906
3002
|
border-bottom-color: transparent;
|
|
3907
3003
|
background-clip: padding-box;
|
|
@@ -3955,9 +3051,8 @@ input::-moz-placeholder {
|
|
|
3955
3051
|
width: auto;
|
|
3956
3052
|
max-width: 16rem;
|
|
3957
3053
|
padding: 0.5rem 0.75rem;
|
|
3958
|
-
background:
|
|
3959
|
-
color:
|
|
3960
|
-
font-size: 0.75em;
|
|
3054
|
+
background: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%)));
|
|
3055
|
+
color: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%)));
|
|
3961
3056
|
}
|
|
3962
3057
|
|
|
3963
3058
|
.radio {
|
|
@@ -3987,9 +3082,9 @@ input::-moz-placeholder {
|
|
|
3987
3082
|
display: flex;
|
|
3988
3083
|
align-items: center;
|
|
3989
3084
|
justify-content: center;
|
|
3990
|
-
border: 2px solid
|
|
3085
|
+
border: 2px solid var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
3991
3086
|
border-radius: 20px;
|
|
3992
|
-
background-color:
|
|
3087
|
+
background-color: white;
|
|
3993
3088
|
color: transparent;
|
|
3994
3089
|
}
|
|
3995
3090
|
|
|
@@ -3997,7 +3092,7 @@ input::-moz-placeholder {
|
|
|
3997
3092
|
width: 0;
|
|
3998
3093
|
height: 0;
|
|
3999
3094
|
border-radius: 8px;
|
|
4000
|
-
background-color:
|
|
3095
|
+
background-color: white;
|
|
4001
3096
|
opacity: 0;
|
|
4002
3097
|
}
|
|
4003
3098
|
|
|
@@ -4012,26 +3107,26 @@ input::-moz-placeholder {
|
|
|
4012
3107
|
cursor: pointer;
|
|
4013
3108
|
}
|
|
4014
3109
|
.radio__native:hover + .radio__background {
|
|
4015
|
-
background-color: rgba(
|
|
3110
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
4016
3111
|
}
|
|
4017
3112
|
.radio__native:hover + .radio__background .radio__circle {
|
|
4018
|
-
border-color:
|
|
3113
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4019
3114
|
}
|
|
4020
3115
|
.radio__native:focus + .radio__background {
|
|
4021
|
-
background-color: rgba(
|
|
3116
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
4022
3117
|
}
|
|
4023
3118
|
.radio__native:focus + .radio__background .radio__circle {
|
|
4024
|
-
border-color:
|
|
3119
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4025
3120
|
}
|
|
4026
3121
|
.radio__native:focus-visible + .radio__background, .radio__native:active + .radio__background {
|
|
4027
|
-
background-color: rgba(
|
|
3122
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.2);
|
|
4028
3123
|
}
|
|
4029
3124
|
.radio__native:focus-visible + .radio__background .radio__circle, .radio__native:active + .radio__background .radio__circle {
|
|
4030
|
-
border-color:
|
|
3125
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4031
3126
|
}
|
|
4032
3127
|
.radio__native:checked + .radio__background .radio__circle {
|
|
4033
|
-
border-color:
|
|
4034
|
-
background-color:
|
|
3128
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3129
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4035
3130
|
}
|
|
4036
3131
|
.radio__native:checked + .radio__background .radio__dot {
|
|
4037
3132
|
width: 8px;
|
|
@@ -4101,10 +3196,7 @@ input::-moz-placeholder {
|
|
|
4101
3196
|
width: 100%;
|
|
4102
3197
|
height: 100%;
|
|
4103
3198
|
position: absolute;
|
|
4104
|
-
|
|
4105
|
-
right: 0;
|
|
4106
|
-
bottom: 0;
|
|
4107
|
-
left: 0;
|
|
3199
|
+
inset: 0;
|
|
4108
3200
|
}
|
|
4109
3201
|
|
|
4110
3202
|
.section__background {
|
|
@@ -4114,7 +3206,7 @@ input::-moz-placeholder {
|
|
|
4114
3206
|
|
|
4115
3207
|
.section__screen {
|
|
4116
3208
|
z-index: 2;
|
|
4117
|
-
background:
|
|
3209
|
+
background: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
4118
3210
|
opacity: 0.7;
|
|
4119
3211
|
}
|
|
4120
3212
|
|
|
@@ -4225,9 +3317,9 @@ input::-moz-placeholder {
|
|
|
4225
3317
|
height: 20px;
|
|
4226
3318
|
position: relative;
|
|
4227
3319
|
display: block;
|
|
4228
|
-
border: 2px solid
|
|
3320
|
+
border: 2px solid var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4229
3321
|
border-radius: 9999px;
|
|
4230
|
-
background-color:
|
|
3322
|
+
background-color: var(--vb-neutral-80, hsl(214, 20%, 80%));
|
|
4231
3323
|
}
|
|
4232
3324
|
|
|
4233
3325
|
.switch__thumb {
|
|
@@ -4240,8 +3332,8 @@ input::-moz-placeholder {
|
|
|
4240
3332
|
display: block;
|
|
4241
3333
|
transition: left 0.15s cubic-bezier(0.4, 0, 0.2, 1);
|
|
4242
3334
|
border-radius: 9999px;
|
|
4243
|
-
background-color:
|
|
4244
|
-
box-shadow: 0 0 0 2px
|
|
3335
|
+
background-color: white;
|
|
3336
|
+
box-shadow: 0 0 0 2px var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4245
3337
|
}
|
|
4246
3338
|
|
|
4247
3339
|
.switch__native {
|
|
@@ -4255,33 +3347,33 @@ input::-moz-placeholder {
|
|
|
4255
3347
|
cursor: pointer;
|
|
4256
3348
|
}
|
|
4257
3349
|
.switch__native:hover + .switch__background::after {
|
|
4258
|
-
background-color: rgba(
|
|
3350
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
4259
3351
|
}
|
|
4260
3352
|
.switch__native:hover + .switch__background .switch__thumb {
|
|
4261
|
-
box-shadow: 0 0 0 2px
|
|
3353
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4262
3354
|
}
|
|
4263
3355
|
.switch__native:focus + .switch__background::after {
|
|
4264
|
-
background-color: rgba(
|
|
3356
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.1);
|
|
4265
3357
|
}
|
|
4266
3358
|
.switch__native:focus + .switch__background .switch__thumb {
|
|
4267
|
-
box-shadow: 0 0 0 2px
|
|
3359
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4268
3360
|
}
|
|
4269
3361
|
.switch__native:focus-visible + .switch__background::after, .switch__native:active + .switch__background::after {
|
|
4270
|
-
background-color: rgba(
|
|
3362
|
+
background-color: rgba(var(--vb-primary-50, hsl(152, 60%, 50%)), 0.2);
|
|
4271
3363
|
}
|
|
4272
3364
|
.switch__native:focus-visible + .switch__background .switch__thumb, .switch__native:active + .switch__background .switch__thumb {
|
|
4273
|
-
box-shadow: 0 0 0 2px
|
|
3365
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4274
3366
|
}
|
|
4275
3367
|
.switch__native:checked + .switch__background::after {
|
|
4276
3368
|
left: calc(100% - 1.875rem);
|
|
4277
3369
|
}
|
|
4278
3370
|
.switch__native:checked + .switch__background .switch__track {
|
|
4279
|
-
border-color:
|
|
4280
|
-
background-color:
|
|
3371
|
+
border-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
3372
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4281
3373
|
}
|
|
4282
3374
|
.switch__native:checked + .switch__background .switch__thumb {
|
|
4283
3375
|
left: calc(100% - 16px);
|
|
4284
|
-
box-shadow: 0 0 0 2px
|
|
3376
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4285
3377
|
}
|
|
4286
3378
|
|
|
4287
3379
|
.switch_size_sm {
|
|
@@ -4305,23 +3397,23 @@ input::-moz-placeholder {
|
|
|
4305
3397
|
.switch_size_sm .switch__thumb {
|
|
4306
3398
|
width: 12px;
|
|
4307
3399
|
height: 12px;
|
|
4308
|
-
box-shadow: 0 0 0 2px
|
|
3400
|
+
box-shadow: 0 0 0 2px var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4309
3401
|
}
|
|
4310
3402
|
.switch_size_sm .switch__native:hover + .switch__background .switch__thumb {
|
|
4311
|
-
box-shadow: 0 0 0 2px
|
|
3403
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4312
3404
|
}
|
|
4313
3405
|
.switch_size_sm .switch__native:focus + .switch__background .switch__thumb {
|
|
4314
|
-
box-shadow: 0 0 0 2px
|
|
3406
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4315
3407
|
}
|
|
4316
3408
|
.switch_size_sm .switch__native:active + .switch__background .switch__thumb {
|
|
4317
|
-
box-shadow: 0 0 0 2px
|
|
3409
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4318
3410
|
}
|
|
4319
3411
|
.switch_size_sm .switch__native:checked + .switch__background::after {
|
|
4320
3412
|
left: calc(100% - 1.40625rem);
|
|
4321
3413
|
}
|
|
4322
3414
|
.switch_size_sm .switch__native:checked + .switch__background .switch__thumb {
|
|
4323
3415
|
left: calc(100% - 12px);
|
|
4324
|
-
box-shadow: 0 0 0 2px
|
|
3416
|
+
box-shadow: 0 0 0 2px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4325
3417
|
}
|
|
4326
3418
|
|
|
4327
3419
|
.switch_size_lg {
|
|
@@ -4345,23 +3437,23 @@ input::-moz-placeholder {
|
|
|
4345
3437
|
.switch_size_lg .switch__thumb {
|
|
4346
3438
|
width: 21px;
|
|
4347
3439
|
height: 21px;
|
|
4348
|
-
box-shadow: 0 0 0 2.5px
|
|
3440
|
+
box-shadow: 0 0 0 2.5px var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
4349
3441
|
}
|
|
4350
3442
|
.switch_size_lg .switch__native:hover + .switch__background .switch__thumb {
|
|
4351
|
-
box-shadow: 0 0 0 2.5px
|
|
3443
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4352
3444
|
}
|
|
4353
3445
|
.switch_size_lg .switch__native:focus + .switch__background .switch__thumb {
|
|
4354
|
-
box-shadow: 0 0 0 2.5px
|
|
3446
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4355
3447
|
}
|
|
4356
3448
|
.switch_size_lg .switch__native:active + .switch__background .switch__thumb {
|
|
4357
|
-
box-shadow: 0 0 0 2.5px
|
|
3449
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4358
3450
|
}
|
|
4359
3451
|
.switch_size_lg .switch__native:checked + .switch__background::after {
|
|
4360
3452
|
left: calc(100% - 2.34375rem);
|
|
4361
3453
|
}
|
|
4362
3454
|
.switch_size_lg .switch__native:checked + .switch__background .switch__thumb {
|
|
4363
3455
|
left: calc(100% - 21px);
|
|
4364
|
-
box-shadow: 0 0 0 2.5px
|
|
3456
|
+
box-shadow: 0 0 0 2.5px var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
4365
3457
|
}
|
|
4366
3458
|
|
|
4367
3459
|
.table {
|
|
@@ -4399,7 +3491,7 @@ input::-moz-placeholder {
|
|
|
4399
3491
|
.table_hover tbody tr:hover,
|
|
4400
3492
|
.table_hover tbody tr:focus {
|
|
4401
3493
|
z-index: 2;
|
|
4402
|
-
background-color:
|
|
3494
|
+
background-color: hsla(53, 100%, 50%, 0.15);
|
|
4403
3495
|
}
|
|
4404
3496
|
|
|
4405
3497
|
.table_responsive thead,
|
|
@@ -4446,20 +3538,20 @@ input::-moz-placeholder {
|
|
|
4446
3538
|
padding: 0.648rem 1.5rem;
|
|
4447
3539
|
}
|
|
4448
3540
|
.table_responsive.table_style_bordered {
|
|
4449
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3541
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4450
3542
|
}
|
|
4451
3543
|
.table_responsive.table_style_bordered td {
|
|
4452
3544
|
border: none;
|
|
4453
3545
|
}
|
|
4454
3546
|
.table_responsive.table_style_bordered td + td,
|
|
4455
3547
|
.table_responsive.table_style_bordered th + td {
|
|
4456
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3548
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4457
3549
|
}
|
|
4458
3550
|
.table_responsive.table_style_bordered [data-mobile-label]::before {
|
|
4459
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3551
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4460
3552
|
}
|
|
4461
3553
|
.table_responsive.table_style_bordered tr + tr {
|
|
4462
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3554
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4463
3555
|
}
|
|
4464
3556
|
|
|
4465
3557
|
@media (max-width: 479px) {
|
|
@@ -4507,20 +3599,20 @@ input::-moz-placeholder {
|
|
|
4507
3599
|
padding: 0.648rem 1.5rem;
|
|
4508
3600
|
}
|
|
4509
3601
|
.table_responsive_xs.table_style_bordered {
|
|
4510
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3602
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4511
3603
|
}
|
|
4512
3604
|
.table_responsive_xs.table_style_bordered td {
|
|
4513
3605
|
border: none;
|
|
4514
3606
|
}
|
|
4515
3607
|
.table_responsive_xs.table_style_bordered td + td,
|
|
4516
3608
|
.table_responsive_xs.table_style_bordered th + td {
|
|
4517
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3609
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4518
3610
|
}
|
|
4519
3611
|
.table_responsive_xs.table_style_bordered [data-mobile-label]::before {
|
|
4520
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3612
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4521
3613
|
}
|
|
4522
3614
|
.table_responsive_xs.table_style_bordered tr + tr {
|
|
4523
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3615
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4524
3616
|
}
|
|
4525
3617
|
}
|
|
4526
3618
|
|
|
@@ -4569,20 +3661,20 @@ input::-moz-placeholder {
|
|
|
4569
3661
|
padding: 0.648rem 1.5rem;
|
|
4570
3662
|
}
|
|
4571
3663
|
.table_responsive_sm.table_style_bordered {
|
|
4572
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3664
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4573
3665
|
}
|
|
4574
3666
|
.table_responsive_sm.table_style_bordered td {
|
|
4575
3667
|
border: none;
|
|
4576
3668
|
}
|
|
4577
3669
|
.table_responsive_sm.table_style_bordered td + td,
|
|
4578
3670
|
.table_responsive_sm.table_style_bordered th + td {
|
|
4579
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3671
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4580
3672
|
}
|
|
4581
3673
|
.table_responsive_sm.table_style_bordered [data-mobile-label]::before {
|
|
4582
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3674
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4583
3675
|
}
|
|
4584
3676
|
.table_responsive_sm.table_style_bordered tr + tr {
|
|
4585
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3677
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4586
3678
|
}
|
|
4587
3679
|
}
|
|
4588
3680
|
|
|
@@ -4631,20 +3723,20 @@ input::-moz-placeholder {
|
|
|
4631
3723
|
padding: 0.648rem 1.5rem;
|
|
4632
3724
|
}
|
|
4633
3725
|
.table_responsive_md.table_style_bordered {
|
|
4634
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3726
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4635
3727
|
}
|
|
4636
3728
|
.table_responsive_md.table_style_bordered td {
|
|
4637
3729
|
border: none;
|
|
4638
3730
|
}
|
|
4639
3731
|
.table_responsive_md.table_style_bordered td + td,
|
|
4640
3732
|
.table_responsive_md.table_style_bordered th + td {
|
|
4641
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3733
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4642
3734
|
}
|
|
4643
3735
|
.table_responsive_md.table_style_bordered [data-mobile-label]::before {
|
|
4644
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3736
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4645
3737
|
}
|
|
4646
3738
|
.table_responsive_md.table_style_bordered tr + tr {
|
|
4647
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3739
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4648
3740
|
}
|
|
4649
3741
|
}
|
|
4650
3742
|
|
|
@@ -4693,20 +3785,20 @@ input::-moz-placeholder {
|
|
|
4693
3785
|
padding: 0.648rem 1.5rem;
|
|
4694
3786
|
}
|
|
4695
3787
|
.table_responsive_lg.table_style_bordered {
|
|
4696
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3788
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4697
3789
|
}
|
|
4698
3790
|
.table_responsive_lg.table_style_bordered td {
|
|
4699
3791
|
border: none;
|
|
4700
3792
|
}
|
|
4701
3793
|
.table_responsive_lg.table_style_bordered td + td,
|
|
4702
3794
|
.table_responsive_lg.table_style_bordered th + td {
|
|
4703
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3795
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4704
3796
|
}
|
|
4705
3797
|
.table_responsive_lg.table_style_bordered [data-mobile-label]::before {
|
|
4706
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3798
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4707
3799
|
}
|
|
4708
3800
|
.table_responsive_lg.table_style_bordered tr + tr {
|
|
4709
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3801
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4710
3802
|
}
|
|
4711
3803
|
}
|
|
4712
3804
|
|
|
@@ -4755,576 +3847,848 @@ input::-moz-placeholder {
|
|
|
4755
3847
|
padding: 0.648rem 1.5rem;
|
|
4756
3848
|
}
|
|
4757
3849
|
.table_responsive_xl.table_style_bordered {
|
|
4758
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3850
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4759
3851
|
}
|
|
4760
3852
|
.table_responsive_xl.table_style_bordered td {
|
|
4761
3853
|
border: none;
|
|
4762
3854
|
}
|
|
4763
3855
|
.table_responsive_xl.table_style_bordered td + td,
|
|
4764
3856
|
.table_responsive_xl.table_style_bordered th + td {
|
|
4765
|
-
border-top: 1px dotted rgba(0, 0, 0, 0.1);
|
|
3857
|
+
border-top: 1px dotted var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4766
3858
|
}
|
|
4767
3859
|
.table_responsive_xl.table_style_bordered [data-mobile-label]::before {
|
|
4768
|
-
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
3860
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4769
3861
|
}
|
|
4770
3862
|
.table_responsive_xl.table_style_bordered tr + tr {
|
|
4771
|
-
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
3863
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
4772
3864
|
}
|
|
4773
3865
|
}
|
|
4774
3866
|
|
|
4775
|
-
.table_size_sm th,
|
|
4776
|
-
.table_size_sm td,
|
|
4777
|
-
.table_size_sm caption {
|
|
4778
|
-
padding: 0.25rem 0.5rem;
|
|
3867
|
+
.table_size_sm th,
|
|
3868
|
+
.table_size_sm td,
|
|
3869
|
+
.table_size_sm caption {
|
|
3870
|
+
padding: 0.25rem 0.5rem;
|
|
3871
|
+
}
|
|
3872
|
+
|
|
3873
|
+
.table_size_lg th,
|
|
3874
|
+
.table_size_lg td,
|
|
3875
|
+
.table_size_lg caption {
|
|
3876
|
+
padding: 0.648rem 1.5rem;
|
|
3877
|
+
}
|
|
3878
|
+
|
|
3879
|
+
.table_style_rowed {
|
|
3880
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
3881
|
+
}
|
|
3882
|
+
.table_style_rowed tr {
|
|
3883
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
3884
|
+
}
|
|
3885
|
+
|
|
3886
|
+
.table_style_bordered th,
|
|
3887
|
+
.table_style_bordered td {
|
|
3888
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1));
|
|
3889
|
+
}
|
|
3890
|
+
|
|
3891
|
+
.table_zebra thead tr {
|
|
3892
|
+
background-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 50%, 3%);
|
|
3893
|
+
}
|
|
3894
|
+
.table_zebra tr:nth-child(even) {
|
|
3895
|
+
background-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 50%, 3%);
|
|
3896
|
+
}
|
|
3897
|
+
|
|
3898
|
+
.background-clip-border {
|
|
3899
|
+
background-clip: border-box !important;
|
|
3900
|
+
}
|
|
3901
|
+
|
|
3902
|
+
.background-clip-content {
|
|
3903
|
+
background-clip: content-box !important;
|
|
3904
|
+
}
|
|
3905
|
+
|
|
3906
|
+
.background-clip-padding {
|
|
3907
|
+
background-clip: padding-box !important;
|
|
3908
|
+
}
|
|
3909
|
+
|
|
3910
|
+
.background {
|
|
3911
|
+
background-color: var(--vb-background, var(--vb-neutral-100, hsl(214, 20%, 100%))) !important;
|
|
3912
|
+
}
|
|
3913
|
+
|
|
3914
|
+
.background-dark {
|
|
3915
|
+
background-color: var(--vb-background-dark, var(--vb-neutral-98, hsl(214, 20%, 98%))) !important;
|
|
3916
|
+
}
|
|
3917
|
+
|
|
3918
|
+
.background-darker {
|
|
3919
|
+
background-color: var(--vb-background-darker, var(--vb-neutral-95, hsl(214, 20%, 95%))) !important;
|
|
3920
|
+
}
|
|
3921
|
+
|
|
3922
|
+
.background-black {
|
|
3923
|
+
background-color: black !important;
|
|
3924
|
+
}
|
|
3925
|
+
|
|
3926
|
+
.background-white {
|
|
3927
|
+
background-color: white !important;
|
|
3928
|
+
}
|
|
3929
|
+
|
|
3930
|
+
.background-transparent {
|
|
3931
|
+
background-color: transparent !important;
|
|
3932
|
+
}
|
|
3933
|
+
|
|
3934
|
+
.background-primary {
|
|
3935
|
+
background-color: var(--vb-primary) !important;
|
|
3936
|
+
}
|
|
3937
|
+
|
|
3938
|
+
.background-primary-0 {
|
|
3939
|
+
background-color: var(--vb-primary-0, hsl(152, 60%, 0%)) !important;
|
|
3940
|
+
}
|
|
3941
|
+
|
|
3942
|
+
.background-primary-5 {
|
|
3943
|
+
background-color: var(--vb-primary-5, hsl(152, 60%, 5%)) !important;
|
|
3944
|
+
}
|
|
3945
|
+
|
|
3946
|
+
.background-primary-10 {
|
|
3947
|
+
background-color: var(--vb-primary-10, hsl(152, 60%, 10%)) !important;
|
|
3948
|
+
}
|
|
3949
|
+
|
|
3950
|
+
.background-primary-12 {
|
|
3951
|
+
background-color: var(--vb-primary-12, hsl(152, 60%, 12%)) !important;
|
|
3952
|
+
}
|
|
3953
|
+
|
|
3954
|
+
.background-primary-15 {
|
|
3955
|
+
background-color: var(--vb-primary-15, hsl(152, 60%, 15%)) !important;
|
|
3956
|
+
}
|
|
3957
|
+
|
|
3958
|
+
.background-primary-20 {
|
|
3959
|
+
background-color: var(--vb-primary-20, hsl(152, 60%, 20%)) !important;
|
|
3960
|
+
}
|
|
3961
|
+
|
|
3962
|
+
.background-primary-30 {
|
|
3963
|
+
background-color: var(--vb-primary-30, hsl(152, 60%, 30%)) !important;
|
|
3964
|
+
}
|
|
3965
|
+
|
|
3966
|
+
.background-primary-40 {
|
|
3967
|
+
background-color: var(--vb-primary-40, hsl(152, 60%, 40%)) !important;
|
|
3968
|
+
}
|
|
3969
|
+
|
|
3970
|
+
.background-primary-50 {
|
|
3971
|
+
background-color: var(--vb-primary-50, hsl(152, 60%, 50%)) !important;
|
|
3972
|
+
}
|
|
3973
|
+
|
|
3974
|
+
.background-primary-60 {
|
|
3975
|
+
background-color: var(--vb-primary-60, hsl(152, 60%, 60%)) !important;
|
|
3976
|
+
}
|
|
3977
|
+
|
|
3978
|
+
.background-primary-70 {
|
|
3979
|
+
background-color: var(--vb-primary-70, hsl(152, 60%, 70%)) !important;
|
|
3980
|
+
}
|
|
3981
|
+
|
|
3982
|
+
.background-primary-80 {
|
|
3983
|
+
background-color: var(--vb-primary-80, hsl(152, 60%, 80%)) !important;
|
|
3984
|
+
}
|
|
3985
|
+
|
|
3986
|
+
.background-primary-90 {
|
|
3987
|
+
background-color: var(--vb-primary-90, hsl(152, 60%, 90%)) !important;
|
|
3988
|
+
}
|
|
3989
|
+
|
|
3990
|
+
.background-primary-95 {
|
|
3991
|
+
background-color: var(--vb-primary-95, hsl(152, 60%, 95%)) !important;
|
|
3992
|
+
}
|
|
3993
|
+
|
|
3994
|
+
.background-primary-98 {
|
|
3995
|
+
background-color: var(--vb-primary-98, hsl(152, 60%, 98%)) !important;
|
|
3996
|
+
}
|
|
3997
|
+
|
|
3998
|
+
.background-primary-100 {
|
|
3999
|
+
background-color: var(--vb-primary-100, hsl(152, 60%, 100%)) !important;
|
|
4000
|
+
}
|
|
4001
|
+
|
|
4002
|
+
.background-secondary {
|
|
4003
|
+
background-color: var(--vb-secondary) !important;
|
|
4004
|
+
}
|
|
4005
|
+
|
|
4006
|
+
.background-secondary-0 {
|
|
4007
|
+
background-color: var(--vb-secondary-0, hsl(214, 50%, 0%)) !important;
|
|
4008
|
+
}
|
|
4009
|
+
|
|
4010
|
+
.background-secondary-5 {
|
|
4011
|
+
background-color: var(--vb-secondary-5, hsl(214, 50%, 5%)) !important;
|
|
4012
|
+
}
|
|
4013
|
+
|
|
4014
|
+
.background-secondary-10 {
|
|
4015
|
+
background-color: var(--vb-secondary-10, hsl(214, 50%, 10%)) !important;
|
|
4016
|
+
}
|
|
4017
|
+
|
|
4018
|
+
.background-secondary-12 {
|
|
4019
|
+
background-color: var(--vb-secondary-12, hsl(214, 50%, 12%)) !important;
|
|
4020
|
+
}
|
|
4021
|
+
|
|
4022
|
+
.background-secondary-15 {
|
|
4023
|
+
background-color: var(--vb-secondary-15, hsl(214, 50%, 15%)) !important;
|
|
4024
|
+
}
|
|
4025
|
+
|
|
4026
|
+
.background-secondary-20 {
|
|
4027
|
+
background-color: var(--vb-secondary-20, hsl(214, 50%, 20%)) !important;
|
|
4028
|
+
}
|
|
4029
|
+
|
|
4030
|
+
.background-secondary-30 {
|
|
4031
|
+
background-color: var(--vb-secondary-30, hsl(214, 50%, 30%)) !important;
|
|
4032
|
+
}
|
|
4033
|
+
|
|
4034
|
+
.background-secondary-40 {
|
|
4035
|
+
background-color: var(--vb-secondary-40, hsl(214, 50%, 40%)) !important;
|
|
4036
|
+
}
|
|
4037
|
+
|
|
4038
|
+
.background-secondary-50 {
|
|
4039
|
+
background-color: var(--vb-secondary-50, hsl(214, 50%, 50%)) !important;
|
|
4040
|
+
}
|
|
4041
|
+
|
|
4042
|
+
.background-secondary-60 {
|
|
4043
|
+
background-color: var(--vb-secondary-60, hsl(214, 50%, 60%)) !important;
|
|
4044
|
+
}
|
|
4045
|
+
|
|
4046
|
+
.background-secondary-70 {
|
|
4047
|
+
background-color: var(--vb-secondary-70, hsl(214, 50%, 70%)) !important;
|
|
4048
|
+
}
|
|
4049
|
+
|
|
4050
|
+
.background-secondary-80 {
|
|
4051
|
+
background-color: var(--vb-secondary-80, hsl(214, 50%, 80%)) !important;
|
|
4052
|
+
}
|
|
4053
|
+
|
|
4054
|
+
.background-secondary-90 {
|
|
4055
|
+
background-color: var(--vb-secondary-90, hsl(214, 50%, 90%)) !important;
|
|
4056
|
+
}
|
|
4057
|
+
|
|
4058
|
+
.background-secondary-95 {
|
|
4059
|
+
background-color: var(--vb-secondary-95, hsl(214, 50%, 95%)) !important;
|
|
4060
|
+
}
|
|
4061
|
+
|
|
4062
|
+
.background-secondary-98 {
|
|
4063
|
+
background-color: var(--vb-secondary-98, hsl(214, 50%, 98%)) !important;
|
|
4064
|
+
}
|
|
4065
|
+
|
|
4066
|
+
.background-secondary-100 {
|
|
4067
|
+
background-color: var(--vb-secondary-100, hsl(214, 50%, 100%)) !important;
|
|
4779
4068
|
}
|
|
4780
4069
|
|
|
4781
|
-
.
|
|
4782
|
-
|
|
4783
|
-
.table_size_lg caption {
|
|
4784
|
-
padding: 0.648rem 1.5rem;
|
|
4070
|
+
.background-neutral {
|
|
4071
|
+
background-color: var(--vb-neutral) !important;
|
|
4785
4072
|
}
|
|
4786
4073
|
|
|
4787
|
-
.
|
|
4788
|
-
|
|
4074
|
+
.background-neutral-0 {
|
|
4075
|
+
background-color: var(--vb-neutral-0, hsl(214, 20%, 0%)) !important;
|
|
4789
4076
|
}
|
|
4790
|
-
|
|
4791
|
-
|
|
4077
|
+
|
|
4078
|
+
.background-neutral-5 {
|
|
4079
|
+
background-color: var(--vb-neutral-5, hsl(214, 20%, 5%)) !important;
|
|
4792
4080
|
}
|
|
4793
4081
|
|
|
4794
|
-
.
|
|
4795
|
-
|
|
4796
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
4082
|
+
.background-neutral-10 {
|
|
4083
|
+
background-color: var(--vb-neutral-10, hsl(214, 20%, 10%)) !important;
|
|
4797
4084
|
}
|
|
4798
4085
|
|
|
4799
|
-
.
|
|
4800
|
-
background-color:
|
|
4086
|
+
.background-neutral-12 {
|
|
4087
|
+
background-color: var(--vb-neutral-12, hsl(214, 20%, 12%)) !important;
|
|
4801
4088
|
}
|
|
4802
|
-
|
|
4803
|
-
|
|
4089
|
+
|
|
4090
|
+
.background-neutral-15 {
|
|
4091
|
+
background-color: var(--vb-neutral-15, hsl(214, 20%, 15%)) !important;
|
|
4804
4092
|
}
|
|
4805
4093
|
|
|
4806
|
-
.background-
|
|
4807
|
-
background-
|
|
4094
|
+
.background-neutral-20 {
|
|
4095
|
+
background-color: var(--vb-neutral-20, hsl(214, 20%, 20%)) !important;
|
|
4808
4096
|
}
|
|
4809
4097
|
|
|
4810
|
-
.background-
|
|
4811
|
-
background-
|
|
4098
|
+
.background-neutral-30 {
|
|
4099
|
+
background-color: var(--vb-neutral-30, hsl(214, 20%, 30%)) !important;
|
|
4812
4100
|
}
|
|
4813
4101
|
|
|
4814
|
-
.background-
|
|
4815
|
-
background-
|
|
4102
|
+
.background-neutral-40 {
|
|
4103
|
+
background-color: var(--vb-neutral-40, hsl(214, 20%, 40%)) !important;
|
|
4816
4104
|
}
|
|
4817
4105
|
|
|
4818
|
-
.background-
|
|
4819
|
-
background-color:
|
|
4106
|
+
.background-neutral-50 {
|
|
4107
|
+
background-color: var(--vb-neutral-50, hsl(214, 20%, 50%)) !important;
|
|
4820
4108
|
}
|
|
4821
4109
|
|
|
4822
|
-
.background-
|
|
4823
|
-
background-color:
|
|
4110
|
+
.background-neutral-60 {
|
|
4111
|
+
background-color: var(--vb-neutral-60, hsl(214, 20%, 60%)) !important;
|
|
4824
4112
|
}
|
|
4825
4113
|
|
|
4826
|
-
.background-
|
|
4827
|
-
background-color:
|
|
4114
|
+
.background-neutral-70 {
|
|
4115
|
+
background-color: var(--vb-neutral-70, hsl(214, 20%, 70%)) !important;
|
|
4828
4116
|
}
|
|
4829
4117
|
|
|
4830
|
-
.background-
|
|
4831
|
-
background-color:
|
|
4118
|
+
.background-neutral-80 {
|
|
4119
|
+
background-color: var(--vb-neutral-80, hsl(214, 20%, 80%)) !important;
|
|
4832
4120
|
}
|
|
4833
4121
|
|
|
4834
|
-
.background-
|
|
4835
|
-
background-color:
|
|
4122
|
+
.background-neutral-90 {
|
|
4123
|
+
background-color: var(--vb-neutral-90, hsl(214, 20%, 90%)) !important;
|
|
4836
4124
|
}
|
|
4837
4125
|
|
|
4838
|
-
.background-
|
|
4839
|
-
background-color:
|
|
4126
|
+
.background-neutral-95 {
|
|
4127
|
+
background-color: var(--vb-neutral-95, hsl(214, 20%, 95%)) !important;
|
|
4840
4128
|
}
|
|
4841
4129
|
|
|
4842
|
-
.background-
|
|
4843
|
-
background-color:
|
|
4130
|
+
.background-neutral-98 {
|
|
4131
|
+
background-color: var(--vb-neutral-98, hsl(214, 20%, 98%)) !important;
|
|
4844
4132
|
}
|
|
4845
4133
|
|
|
4846
|
-
.background-
|
|
4847
|
-
background-color:
|
|
4134
|
+
.background-neutral-100 {
|
|
4135
|
+
background-color: var(--vb-neutral-100, hsl(214, 20%, 100%)) !important;
|
|
4848
4136
|
}
|
|
4849
4137
|
|
|
4850
|
-
.background-
|
|
4851
|
-
background-color:
|
|
4138
|
+
.background-important {
|
|
4139
|
+
background-color: var(--vb-important) !important;
|
|
4852
4140
|
}
|
|
4853
4141
|
|
|
4854
|
-
.background-
|
|
4855
|
-
background-color:
|
|
4142
|
+
.background-important-0 {
|
|
4143
|
+
background-color: var(--vb-important-0, hsl(0, 80%, 0%)) !important;
|
|
4856
4144
|
}
|
|
4857
4145
|
|
|
4858
|
-
.background-
|
|
4859
|
-
background-color:
|
|
4146
|
+
.background-important-5 {
|
|
4147
|
+
background-color: var(--vb-important-5, hsl(0, 80%, 5%)) !important;
|
|
4860
4148
|
}
|
|
4861
4149
|
|
|
4862
|
-
.background-
|
|
4863
|
-
background-color:
|
|
4150
|
+
.background-important-10 {
|
|
4151
|
+
background-color: var(--vb-important-10, hsl(0, 80%, 10%)) !important;
|
|
4864
4152
|
}
|
|
4865
4153
|
|
|
4866
|
-
.background-
|
|
4867
|
-
background-color:
|
|
4154
|
+
.background-important-12 {
|
|
4155
|
+
background-color: var(--vb-important-12, hsl(0, 80%, 12%)) !important;
|
|
4868
4156
|
}
|
|
4869
4157
|
|
|
4870
|
-
.background-
|
|
4871
|
-
background-color:
|
|
4158
|
+
.background-important-15 {
|
|
4159
|
+
background-color: var(--vb-important-15, hsl(0, 80%, 15%)) !important;
|
|
4872
4160
|
}
|
|
4873
4161
|
|
|
4874
|
-
.background-
|
|
4875
|
-
background-color:
|
|
4162
|
+
.background-important-20 {
|
|
4163
|
+
background-color: var(--vb-important-20, hsl(0, 80%, 20%)) !important;
|
|
4876
4164
|
}
|
|
4877
4165
|
|
|
4878
|
-
.background-
|
|
4879
|
-
background-color:
|
|
4166
|
+
.background-important-30 {
|
|
4167
|
+
background-color: var(--vb-important-30, hsl(0, 80%, 30%)) !important;
|
|
4880
4168
|
}
|
|
4881
4169
|
|
|
4882
|
-
.background-
|
|
4883
|
-
background-color:
|
|
4170
|
+
.background-important-40 {
|
|
4171
|
+
background-color: var(--vb-important-40, hsl(0, 80%, 40%)) !important;
|
|
4884
4172
|
}
|
|
4885
4173
|
|
|
4886
|
-
.background-
|
|
4887
|
-
background-color:
|
|
4174
|
+
.background-important-50 {
|
|
4175
|
+
background-color: var(--vb-important-50, hsl(0, 80%, 50%)) !important;
|
|
4888
4176
|
}
|
|
4889
4177
|
|
|
4890
|
-
.background-
|
|
4891
|
-
background-color:
|
|
4178
|
+
.background-important-60 {
|
|
4179
|
+
background-color: var(--vb-important-60, hsl(0, 80%, 60%)) !important;
|
|
4892
4180
|
}
|
|
4893
4181
|
|
|
4894
|
-
.background-
|
|
4895
|
-
background-color:
|
|
4182
|
+
.background-important-70 {
|
|
4183
|
+
background-color: var(--vb-important-70, hsl(0, 80%, 70%)) !important;
|
|
4896
4184
|
}
|
|
4897
4185
|
|
|
4898
|
-
.background-
|
|
4899
|
-
background-color:
|
|
4186
|
+
.background-important-80 {
|
|
4187
|
+
background-color: var(--vb-important-80, hsl(0, 80%, 80%)) !important;
|
|
4900
4188
|
}
|
|
4901
4189
|
|
|
4902
|
-
.background-
|
|
4903
|
-
background-color:
|
|
4190
|
+
.background-important-90 {
|
|
4191
|
+
background-color: var(--vb-important-90, hsl(0, 80%, 90%)) !important;
|
|
4904
4192
|
}
|
|
4905
4193
|
|
|
4906
|
-
.background-
|
|
4907
|
-
background-color:
|
|
4194
|
+
.background-important-95 {
|
|
4195
|
+
background-color: var(--vb-important-95, hsl(0, 80%, 95%)) !important;
|
|
4908
4196
|
}
|
|
4909
4197
|
|
|
4910
|
-
.background-
|
|
4911
|
-
background-color:
|
|
4198
|
+
.background-important-98 {
|
|
4199
|
+
background-color: var(--vb-important-98, hsl(0, 80%, 98%)) !important;
|
|
4912
4200
|
}
|
|
4913
4201
|
|
|
4914
|
-
.background-
|
|
4915
|
-
background-color:
|
|
4202
|
+
.background-important-100 {
|
|
4203
|
+
background-color: var(--vb-important-100, hsl(0, 80%, 100%)) !important;
|
|
4916
4204
|
}
|
|
4917
4205
|
|
|
4918
|
-
.
|
|
4919
|
-
|
|
4206
|
+
.foreground {
|
|
4207
|
+
color: var(--vb-foreground, var(--vb-neutral-20, hsl(214, 20%, 20%))) !important;
|
|
4920
4208
|
}
|
|
4921
4209
|
|
|
4922
|
-
.
|
|
4923
|
-
|
|
4210
|
+
.foreground-light {
|
|
4211
|
+
color: var(--vb-foreground-light, var(--vb-neutral-40, hsl(214, 20%, 40%))) !important;
|
|
4924
4212
|
}
|
|
4925
4213
|
|
|
4926
|
-
.
|
|
4927
|
-
|
|
4214
|
+
.foreground-lighter {
|
|
4215
|
+
color: var(--vb-foreground-lighter, var(--vb-neutral-60, hsl(214, 20%, 60%))) !important;
|
|
4928
4216
|
}
|
|
4929
4217
|
|
|
4930
|
-
.
|
|
4931
|
-
|
|
4218
|
+
.foreground-black {
|
|
4219
|
+
color: black !important;
|
|
4932
4220
|
}
|
|
4933
4221
|
|
|
4934
|
-
.
|
|
4935
|
-
|
|
4222
|
+
.foreground-white {
|
|
4223
|
+
color: white !important;
|
|
4936
4224
|
}
|
|
4937
4225
|
|
|
4938
|
-
.
|
|
4939
|
-
|
|
4226
|
+
.foreground-transparent {
|
|
4227
|
+
color: transparent !important;
|
|
4940
4228
|
}
|
|
4941
4229
|
|
|
4942
|
-
.
|
|
4943
|
-
|
|
4230
|
+
.foreground-primary {
|
|
4231
|
+
color: var(--vb-primary) !important;
|
|
4944
4232
|
}
|
|
4945
4233
|
|
|
4946
|
-
.
|
|
4947
|
-
|
|
4234
|
+
.foreground-primary-0 {
|
|
4235
|
+
color: var(--vb-primary-0, hsl(152, 60%, 0%)) !important;
|
|
4948
4236
|
}
|
|
4949
4237
|
|
|
4950
|
-
.
|
|
4951
|
-
|
|
4238
|
+
.foreground-primary-5 {
|
|
4239
|
+
color: var(--vb-primary-5, hsl(152, 60%, 5%)) !important;
|
|
4952
4240
|
}
|
|
4953
4241
|
|
|
4954
|
-
.
|
|
4955
|
-
|
|
4242
|
+
.foreground-primary-10 {
|
|
4243
|
+
color: var(--vb-primary-10, hsl(152, 60%, 10%)) !important;
|
|
4956
4244
|
}
|
|
4957
4245
|
|
|
4958
|
-
.
|
|
4959
|
-
|
|
4246
|
+
.foreground-primary-12 {
|
|
4247
|
+
color: var(--vb-primary-12, hsl(152, 60%, 12%)) !important;
|
|
4960
4248
|
}
|
|
4961
4249
|
|
|
4962
|
-
.
|
|
4963
|
-
|
|
4250
|
+
.foreground-primary-15 {
|
|
4251
|
+
color: var(--vb-primary-15, hsl(152, 60%, 15%)) !important;
|
|
4964
4252
|
}
|
|
4965
4253
|
|
|
4966
|
-
.
|
|
4967
|
-
|
|
4254
|
+
.foreground-primary-20 {
|
|
4255
|
+
color: var(--vb-primary-20, hsl(152, 60%, 20%)) !important;
|
|
4968
4256
|
}
|
|
4969
4257
|
|
|
4970
|
-
.
|
|
4971
|
-
|
|
4258
|
+
.foreground-primary-30 {
|
|
4259
|
+
color: var(--vb-primary-30, hsl(152, 60%, 30%)) !important;
|
|
4972
4260
|
}
|
|
4973
4261
|
|
|
4974
|
-
.
|
|
4975
|
-
|
|
4262
|
+
.foreground-primary-40 {
|
|
4263
|
+
color: var(--vb-primary-40, hsl(152, 60%, 40%)) !important;
|
|
4976
4264
|
}
|
|
4977
4265
|
|
|
4978
|
-
.
|
|
4979
|
-
|
|
4266
|
+
.foreground-primary-50 {
|
|
4267
|
+
color: var(--vb-primary-50, hsl(152, 60%, 50%)) !important;
|
|
4980
4268
|
}
|
|
4981
4269
|
|
|
4982
|
-
.
|
|
4983
|
-
|
|
4270
|
+
.foreground-primary-60 {
|
|
4271
|
+
color: var(--vb-primary-60, hsl(152, 60%, 60%)) !important;
|
|
4984
4272
|
}
|
|
4985
4273
|
|
|
4986
|
-
.
|
|
4987
|
-
|
|
4274
|
+
.foreground-primary-70 {
|
|
4275
|
+
color: var(--vb-primary-70, hsl(152, 60%, 70%)) !important;
|
|
4988
4276
|
}
|
|
4989
4277
|
|
|
4990
|
-
.
|
|
4991
|
-
|
|
4278
|
+
.foreground-primary-80 {
|
|
4279
|
+
color: var(--vb-primary-80, hsl(152, 60%, 80%)) !important;
|
|
4992
4280
|
}
|
|
4993
4281
|
|
|
4994
|
-
.
|
|
4995
|
-
|
|
4282
|
+
.foreground-primary-90 {
|
|
4283
|
+
color: var(--vb-primary-90, hsl(152, 60%, 90%)) !important;
|
|
4996
4284
|
}
|
|
4997
4285
|
|
|
4998
|
-
.
|
|
4999
|
-
|
|
4286
|
+
.foreground-primary-95 {
|
|
4287
|
+
color: var(--vb-primary-95, hsl(152, 60%, 95%)) !important;
|
|
5000
4288
|
}
|
|
5001
4289
|
|
|
5002
|
-
.
|
|
5003
|
-
|
|
4290
|
+
.foreground-primary-98 {
|
|
4291
|
+
color: var(--vb-primary-98, hsl(152, 60%, 98%)) !important;
|
|
5004
4292
|
}
|
|
5005
4293
|
|
|
5006
|
-
.
|
|
5007
|
-
|
|
4294
|
+
.foreground-primary-100 {
|
|
4295
|
+
color: var(--vb-primary-100, hsl(152, 60%, 100%)) !important;
|
|
5008
4296
|
}
|
|
5009
4297
|
|
|
5010
|
-
.
|
|
5011
|
-
|
|
4298
|
+
.foreground-secondary {
|
|
4299
|
+
color: var(--vb-secondary) !important;
|
|
5012
4300
|
}
|
|
5013
4301
|
|
|
5014
|
-
.
|
|
5015
|
-
|
|
4302
|
+
.foreground-secondary-0 {
|
|
4303
|
+
color: var(--vb-secondary-0, hsl(214, 50%, 0%)) !important;
|
|
5016
4304
|
}
|
|
5017
4305
|
|
|
5018
|
-
.
|
|
5019
|
-
|
|
4306
|
+
.foreground-secondary-5 {
|
|
4307
|
+
color: var(--vb-secondary-5, hsl(214, 50%, 5%)) !important;
|
|
5020
4308
|
}
|
|
5021
4309
|
|
|
5022
|
-
.
|
|
5023
|
-
|
|
4310
|
+
.foreground-secondary-10 {
|
|
4311
|
+
color: var(--vb-secondary-10, hsl(214, 50%, 10%)) !important;
|
|
5024
4312
|
}
|
|
5025
4313
|
|
|
5026
|
-
.
|
|
5027
|
-
|
|
4314
|
+
.foreground-secondary-12 {
|
|
4315
|
+
color: var(--vb-secondary-12, hsl(214, 50%, 12%)) !important;
|
|
5028
4316
|
}
|
|
5029
4317
|
|
|
5030
|
-
.
|
|
5031
|
-
|
|
4318
|
+
.foreground-secondary-15 {
|
|
4319
|
+
color: var(--vb-secondary-15, hsl(214, 50%, 15%)) !important;
|
|
5032
4320
|
}
|
|
5033
4321
|
|
|
5034
|
-
.
|
|
5035
|
-
|
|
4322
|
+
.foreground-secondary-20 {
|
|
4323
|
+
color: var(--vb-secondary-20, hsl(214, 50%, 20%)) !important;
|
|
5036
4324
|
}
|
|
5037
4325
|
|
|
5038
|
-
.
|
|
5039
|
-
|
|
4326
|
+
.foreground-secondary-30 {
|
|
4327
|
+
color: var(--vb-secondary-30, hsl(214, 50%, 30%)) !important;
|
|
5040
4328
|
}
|
|
5041
4329
|
|
|
5042
|
-
.
|
|
5043
|
-
|
|
4330
|
+
.foreground-secondary-40 {
|
|
4331
|
+
color: var(--vb-secondary-40, hsl(214, 50%, 40%)) !important;
|
|
5044
4332
|
}
|
|
5045
4333
|
|
|
5046
|
-
.
|
|
5047
|
-
|
|
4334
|
+
.foreground-secondary-50 {
|
|
4335
|
+
color: var(--vb-secondary-50, hsl(214, 50%, 50%)) !important;
|
|
5048
4336
|
}
|
|
5049
4337
|
|
|
5050
|
-
.
|
|
5051
|
-
|
|
5052
|
-
.radius-top-left {
|
|
5053
|
-
border-top-left-radius: 0.25rem !important;
|
|
4338
|
+
.foreground-secondary-60 {
|
|
4339
|
+
color: var(--vb-secondary-60, hsl(214, 50%, 60%)) !important;
|
|
5054
4340
|
}
|
|
5055
4341
|
|
|
5056
|
-
.
|
|
5057
|
-
|
|
5058
|
-
.radius-top-right {
|
|
5059
|
-
border-top-right-radius: 0.25rem !important;
|
|
4342
|
+
.foreground-secondary-70 {
|
|
4343
|
+
color: var(--vb-secondary-70, hsl(214, 50%, 70%)) !important;
|
|
5060
4344
|
}
|
|
5061
4345
|
|
|
5062
|
-
.
|
|
5063
|
-
|
|
5064
|
-
.radius-bottom-right {
|
|
5065
|
-
border-bottom-right-radius: 0.25rem !important;
|
|
4346
|
+
.foreground-secondary-80 {
|
|
4347
|
+
color: var(--vb-secondary-80, hsl(214, 50%, 80%)) !important;
|
|
5066
4348
|
}
|
|
5067
4349
|
|
|
5068
|
-
.
|
|
5069
|
-
|
|
5070
|
-
.radius-bottom-left {
|
|
5071
|
-
border-bottom-left-radius: 0.25rem !important;
|
|
4350
|
+
.foreground-secondary-90 {
|
|
4351
|
+
color: var(--vb-secondary-90, hsl(214, 50%, 90%)) !important;
|
|
5072
4352
|
}
|
|
5073
4353
|
|
|
5074
|
-
.
|
|
5075
|
-
|
|
4354
|
+
.foreground-secondary-95 {
|
|
4355
|
+
color: var(--vb-secondary-95, hsl(214, 50%, 95%)) !important;
|
|
5076
4356
|
}
|
|
5077
4357
|
|
|
5078
|
-
.
|
|
5079
|
-
|
|
5080
|
-
.radius-circle-top-left {
|
|
5081
|
-
border-top-left-radius: 9999px !important;
|
|
4358
|
+
.foreground-secondary-98 {
|
|
4359
|
+
color: var(--vb-secondary-98, hsl(214, 50%, 98%)) !important;
|
|
5082
4360
|
}
|
|
5083
4361
|
|
|
5084
|
-
.
|
|
5085
|
-
|
|
5086
|
-
.radius-circle-top-right {
|
|
5087
|
-
border-top-right-radius: 9999px !important;
|
|
4362
|
+
.foreground-secondary-100 {
|
|
4363
|
+
color: var(--vb-secondary-100, hsl(214, 50%, 100%)) !important;
|
|
5088
4364
|
}
|
|
5089
4365
|
|
|
5090
|
-
.
|
|
5091
|
-
|
|
5092
|
-
.radius-circle-bottom-right {
|
|
5093
|
-
border-bottom-right-radius: 9999px !important;
|
|
4366
|
+
.foreground-neutral {
|
|
4367
|
+
color: var(--vb-neutral) !important;
|
|
5094
4368
|
}
|
|
5095
4369
|
|
|
5096
|
-
.
|
|
5097
|
-
|
|
5098
|
-
.radius-circle-bottom-left {
|
|
5099
|
-
border-bottom-left-radius: 9999px !important;
|
|
4370
|
+
.foreground-neutral-0 {
|
|
4371
|
+
color: var(--vb-neutral-0, hsl(214, 20%, 0%)) !important;
|
|
5100
4372
|
}
|
|
5101
4373
|
|
|
5102
|
-
.
|
|
5103
|
-
|
|
4374
|
+
.foreground-neutral-5 {
|
|
4375
|
+
color: var(--vb-neutral-5, hsl(214, 20%, 5%)) !important;
|
|
5104
4376
|
}
|
|
5105
4377
|
|
|
5106
|
-
.
|
|
5107
|
-
|
|
5108
|
-
.radius-square-top-left {
|
|
5109
|
-
border-top-left-radius: 0 !important;
|
|
4378
|
+
.foreground-neutral-10 {
|
|
4379
|
+
color: var(--vb-neutral-10, hsl(214, 20%, 10%)) !important;
|
|
5110
4380
|
}
|
|
5111
4381
|
|
|
5112
|
-
.
|
|
5113
|
-
|
|
5114
|
-
.radius-square-top-right {
|
|
5115
|
-
border-top-right-radius: 0 !important;
|
|
4382
|
+
.foreground-neutral-12 {
|
|
4383
|
+
color: var(--vb-neutral-12, hsl(214, 20%, 12%)) !important;
|
|
5116
4384
|
}
|
|
5117
4385
|
|
|
5118
|
-
.
|
|
5119
|
-
|
|
5120
|
-
.radius-square-bottom-right {
|
|
5121
|
-
border-bottom-right-radius: 0 !important;
|
|
4386
|
+
.foreground-neutral-15 {
|
|
4387
|
+
color: var(--vb-neutral-15, hsl(214, 20%, 15%)) !important;
|
|
5122
4388
|
}
|
|
5123
4389
|
|
|
5124
|
-
.
|
|
5125
|
-
|
|
5126
|
-
.radius-square-bottom-left {
|
|
5127
|
-
border-bottom-left-radius: 0 !important;
|
|
4390
|
+
.foreground-neutral-20 {
|
|
4391
|
+
color: var(--vb-neutral-20, hsl(214, 20%, 20%)) !important;
|
|
5128
4392
|
}
|
|
5129
4393
|
|
|
5130
|
-
.
|
|
5131
|
-
|
|
4394
|
+
.foreground-neutral-30 {
|
|
4395
|
+
color: var(--vb-neutral-30, hsl(214, 20%, 30%)) !important;
|
|
5132
4396
|
}
|
|
5133
4397
|
|
|
5134
|
-
.
|
|
5135
|
-
|
|
4398
|
+
.foreground-neutral-40 {
|
|
4399
|
+
color: var(--vb-neutral-40, hsl(214, 20%, 40%)) !important;
|
|
5136
4400
|
}
|
|
5137
4401
|
|
|
5138
|
-
.
|
|
5139
|
-
|
|
4402
|
+
.foreground-neutral-50 {
|
|
4403
|
+
color: var(--vb-neutral-50, hsl(214, 20%, 50%)) !important;
|
|
5140
4404
|
}
|
|
5141
4405
|
|
|
5142
|
-
.
|
|
5143
|
-
|
|
4406
|
+
.foreground-neutral-60 {
|
|
4407
|
+
color: var(--vb-neutral-60, hsl(214, 20%, 60%)) !important;
|
|
5144
4408
|
}
|
|
5145
4409
|
|
|
5146
|
-
.
|
|
5147
|
-
|
|
4410
|
+
.foreground-neutral-70 {
|
|
4411
|
+
color: var(--vb-neutral-70, hsl(214, 20%, 70%)) !important;
|
|
5148
4412
|
}
|
|
5149
4413
|
|
|
5150
|
-
.
|
|
5151
|
-
|
|
4414
|
+
.foreground-neutral-80 {
|
|
4415
|
+
color: var(--vb-neutral-80, hsl(214, 20%, 80%)) !important;
|
|
5152
4416
|
}
|
|
5153
4417
|
|
|
5154
|
-
.
|
|
5155
|
-
|
|
4418
|
+
.foreground-neutral-90 {
|
|
4419
|
+
color: var(--vb-neutral-90, hsl(214, 20%, 90%)) !important;
|
|
5156
4420
|
}
|
|
5157
4421
|
|
|
5158
|
-
.
|
|
5159
|
-
color:
|
|
4422
|
+
.foreground-neutral-95 {
|
|
4423
|
+
color: var(--vb-neutral-95, hsl(214, 20%, 95%)) !important;
|
|
5160
4424
|
}
|
|
5161
4425
|
|
|
5162
|
-
.
|
|
5163
|
-
color:
|
|
4426
|
+
.foreground-neutral-98 {
|
|
4427
|
+
color: var(--vb-neutral-98, hsl(214, 20%, 98%)) !important;
|
|
5164
4428
|
}
|
|
5165
4429
|
|
|
5166
|
-
.
|
|
5167
|
-
color:
|
|
4430
|
+
.foreground-neutral-100 {
|
|
4431
|
+
color: var(--vb-neutral-100, hsl(214, 20%, 100%)) !important;
|
|
5168
4432
|
}
|
|
5169
4433
|
|
|
5170
|
-
.
|
|
5171
|
-
color:
|
|
4434
|
+
.foreground-important {
|
|
4435
|
+
color: var(--vb-important) !important;
|
|
5172
4436
|
}
|
|
5173
4437
|
|
|
5174
|
-
.
|
|
5175
|
-
color:
|
|
4438
|
+
.foreground-important-0 {
|
|
4439
|
+
color: var(--vb-important-0, hsl(0, 80%, 0%)) !important;
|
|
5176
4440
|
}
|
|
5177
4441
|
|
|
5178
|
-
.
|
|
5179
|
-
color:
|
|
4442
|
+
.foreground-important-5 {
|
|
4443
|
+
color: var(--vb-important-5, hsl(0, 80%, 5%)) !important;
|
|
5180
4444
|
}
|
|
5181
4445
|
|
|
5182
|
-
.
|
|
5183
|
-
color:
|
|
4446
|
+
.foreground-important-10 {
|
|
4447
|
+
color: var(--vb-important-10, hsl(0, 80%, 10%)) !important;
|
|
4448
|
+
}
|
|
4449
|
+
|
|
4450
|
+
.foreground-important-12 {
|
|
4451
|
+
color: var(--vb-important-12, hsl(0, 80%, 12%)) !important;
|
|
4452
|
+
}
|
|
4453
|
+
|
|
4454
|
+
.foreground-important-15 {
|
|
4455
|
+
color: var(--vb-important-15, hsl(0, 80%, 15%)) !important;
|
|
4456
|
+
}
|
|
4457
|
+
|
|
4458
|
+
.foreground-important-20 {
|
|
4459
|
+
color: var(--vb-important-20, hsl(0, 80%, 20%)) !important;
|
|
4460
|
+
}
|
|
4461
|
+
|
|
4462
|
+
.foreground-important-30 {
|
|
4463
|
+
color: var(--vb-important-30, hsl(0, 80%, 30%)) !important;
|
|
4464
|
+
}
|
|
4465
|
+
|
|
4466
|
+
.foreground-important-40 {
|
|
4467
|
+
color: var(--vb-important-40, hsl(0, 80%, 40%)) !important;
|
|
4468
|
+
}
|
|
4469
|
+
|
|
4470
|
+
.foreground-important-50 {
|
|
4471
|
+
color: var(--vb-important-50, hsl(0, 80%, 50%)) !important;
|
|
4472
|
+
}
|
|
4473
|
+
|
|
4474
|
+
.foreground-important-60 {
|
|
4475
|
+
color: var(--vb-important-60, hsl(0, 80%, 60%)) !important;
|
|
4476
|
+
}
|
|
4477
|
+
|
|
4478
|
+
.foreground-important-70 {
|
|
4479
|
+
color: var(--vb-important-70, hsl(0, 80%, 70%)) !important;
|
|
4480
|
+
}
|
|
4481
|
+
|
|
4482
|
+
.foreground-important-80 {
|
|
4483
|
+
color: var(--vb-important-80, hsl(0, 80%, 80%)) !important;
|
|
4484
|
+
}
|
|
4485
|
+
|
|
4486
|
+
.foreground-important-90 {
|
|
4487
|
+
color: var(--vb-important-90, hsl(0, 80%, 90%)) !important;
|
|
4488
|
+
}
|
|
4489
|
+
|
|
4490
|
+
.foreground-important-95 {
|
|
4491
|
+
color: var(--vb-important-95, hsl(0, 80%, 95%)) !important;
|
|
4492
|
+
}
|
|
4493
|
+
|
|
4494
|
+
.foreground-important-98 {
|
|
4495
|
+
color: var(--vb-important-98, hsl(0, 80%, 98%)) !important;
|
|
4496
|
+
}
|
|
4497
|
+
|
|
4498
|
+
.foreground-important-100 {
|
|
4499
|
+
color: var(--vb-important-100, hsl(0, 80%, 100%)) !important;
|
|
4500
|
+
}
|
|
4501
|
+
|
|
4502
|
+
.border {
|
|
4503
|
+
border: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4504
|
+
}
|
|
4505
|
+
|
|
4506
|
+
.border-top {
|
|
4507
|
+
border-top: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4508
|
+
}
|
|
4509
|
+
|
|
4510
|
+
.border-bottom {
|
|
4511
|
+
border-bottom: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
4512
|
+
}
|
|
4513
|
+
|
|
4514
|
+
.border-left {
|
|
4515
|
+
border-left: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
5184
4516
|
}
|
|
5185
4517
|
|
|
5186
|
-
.
|
|
5187
|
-
|
|
4518
|
+
.border-right {
|
|
4519
|
+
border-right: 1px solid var(--vb-border-color, rgba(0, 0, 0, 0.1)) !important;
|
|
5188
4520
|
}
|
|
5189
4521
|
|
|
5190
|
-
.
|
|
5191
|
-
|
|
4522
|
+
.border-none {
|
|
4523
|
+
border: 0 !important;
|
|
5192
4524
|
}
|
|
5193
4525
|
|
|
5194
|
-
.
|
|
5195
|
-
|
|
4526
|
+
.border-top-none {
|
|
4527
|
+
border-top: 0 !important;
|
|
5196
4528
|
}
|
|
5197
4529
|
|
|
5198
|
-
.
|
|
5199
|
-
|
|
4530
|
+
.border-bottom-none {
|
|
4531
|
+
border-bottom: 0 !important;
|
|
5200
4532
|
}
|
|
5201
4533
|
|
|
5202
|
-
.
|
|
5203
|
-
|
|
4534
|
+
.border-left-none {
|
|
4535
|
+
border-left: 0 !important;
|
|
5204
4536
|
}
|
|
5205
4537
|
|
|
5206
|
-
.
|
|
5207
|
-
|
|
4538
|
+
.border-right-none {
|
|
4539
|
+
border-right: 0 !important;
|
|
5208
4540
|
}
|
|
5209
4541
|
|
|
5210
|
-
.color-
|
|
5211
|
-
color:
|
|
4542
|
+
.border-color-dark {
|
|
4543
|
+
border-color: var(--vb-border-color-dark, rgba(0, 0, 0, 0.2)) !important;
|
|
5212
4544
|
}
|
|
5213
4545
|
|
|
5214
|
-
.color-
|
|
5215
|
-
color:
|
|
4546
|
+
.border-color-darker {
|
|
4547
|
+
border-color: var(--vb-border-color-darker, rgba(0, 0, 0, 0.3)) !important;
|
|
5216
4548
|
}
|
|
5217
4549
|
|
|
5218
|
-
.color-
|
|
5219
|
-
color:
|
|
4550
|
+
.border-color-transparent {
|
|
4551
|
+
border-color: transparent !important;
|
|
5220
4552
|
}
|
|
5221
4553
|
|
|
5222
|
-
.
|
|
5223
|
-
|
|
4554
|
+
.radius {
|
|
4555
|
+
border-radius: 0.25rem !important;
|
|
5224
4556
|
}
|
|
5225
4557
|
|
|
5226
|
-
.
|
|
5227
|
-
|
|
4558
|
+
.radius-top,
|
|
4559
|
+
.radius-left,
|
|
4560
|
+
.radius-top-left {
|
|
4561
|
+
border-top-left-radius: 0.25rem !important;
|
|
5228
4562
|
}
|
|
5229
4563
|
|
|
5230
|
-
.
|
|
5231
|
-
|
|
4564
|
+
.radius-top,
|
|
4565
|
+
.radius-right,
|
|
4566
|
+
.radius-top-right {
|
|
4567
|
+
border-top-right-radius: 0.25rem !important;
|
|
5232
4568
|
}
|
|
5233
4569
|
|
|
5234
|
-
.
|
|
5235
|
-
|
|
4570
|
+
.radius-bottom,
|
|
4571
|
+
.radius-right,
|
|
4572
|
+
.radius-bottom-right {
|
|
4573
|
+
border-bottom-right-radius: 0.25rem !important;
|
|
5236
4574
|
}
|
|
5237
4575
|
|
|
5238
|
-
.
|
|
5239
|
-
|
|
4576
|
+
.radius-bottom,
|
|
4577
|
+
.radius-left,
|
|
4578
|
+
.radius-bottom-left {
|
|
4579
|
+
border-bottom-left-radius: 0.25rem !important;
|
|
5240
4580
|
}
|
|
5241
4581
|
|
|
5242
|
-
.
|
|
5243
|
-
|
|
4582
|
+
.radius-lg {
|
|
4583
|
+
border-radius: 0.5rem !important;
|
|
5244
4584
|
}
|
|
5245
4585
|
|
|
5246
|
-
.
|
|
5247
|
-
|
|
4586
|
+
.radius-lg-top,
|
|
4587
|
+
.radius-lg-left,
|
|
4588
|
+
.radius-lg-top-left {
|
|
4589
|
+
border-top-left-radius: 0.5rem !important;
|
|
5248
4590
|
}
|
|
5249
4591
|
|
|
5250
|
-
.
|
|
5251
|
-
|
|
4592
|
+
.radius-lg-top,
|
|
4593
|
+
.radius-lg-right,
|
|
4594
|
+
.radius-lg-top-right {
|
|
4595
|
+
border-top-right-radius: 0.5rem !important;
|
|
5252
4596
|
}
|
|
5253
4597
|
|
|
5254
|
-
.
|
|
5255
|
-
|
|
4598
|
+
.radius-lg-bottom,
|
|
4599
|
+
.radius-lg-right,
|
|
4600
|
+
.radius-lg-bottom-right {
|
|
4601
|
+
border-bottom-right-radius: 0.5rem !important;
|
|
5256
4602
|
}
|
|
5257
4603
|
|
|
5258
|
-
.
|
|
5259
|
-
|
|
4604
|
+
.radius-lg-bottom,
|
|
4605
|
+
.radius-lg-left,
|
|
4606
|
+
.radius-lg-bottom-left {
|
|
4607
|
+
border-bottom-left-radius: 0.5rem !important;
|
|
5260
4608
|
}
|
|
5261
4609
|
|
|
5262
|
-
.
|
|
5263
|
-
|
|
4610
|
+
.radius-lg-circle {
|
|
4611
|
+
border-radius: 9999px !important;
|
|
5264
4612
|
}
|
|
5265
4613
|
|
|
5266
|
-
.
|
|
5267
|
-
|
|
4614
|
+
.radius-lg-circle-top,
|
|
4615
|
+
.radius-lg-circle-left,
|
|
4616
|
+
.radius-lg-circle-top-left {
|
|
4617
|
+
border-top-left-radius: 9999px !important;
|
|
5268
4618
|
}
|
|
5269
4619
|
|
|
5270
|
-
.
|
|
5271
|
-
|
|
4620
|
+
.radius-lg-circle-top,
|
|
4621
|
+
.radius-lg-circle-right,
|
|
4622
|
+
.radius-lg-circle-top-right {
|
|
4623
|
+
border-top-right-radius: 9999px !important;
|
|
5272
4624
|
}
|
|
5273
4625
|
|
|
5274
|
-
.
|
|
5275
|
-
|
|
4626
|
+
.radius-lg-circle-bottom,
|
|
4627
|
+
.radius-lg-circle-right,
|
|
4628
|
+
.radius-lg-circle-bottom-right {
|
|
4629
|
+
border-bottom-right-radius: 9999px !important;
|
|
5276
4630
|
}
|
|
5277
4631
|
|
|
5278
|
-
.
|
|
5279
|
-
|
|
4632
|
+
.radius-lg-circle-bottom,
|
|
4633
|
+
.radius-lg-circle-left,
|
|
4634
|
+
.radius-lg-circle-bottom-left {
|
|
4635
|
+
border-bottom-left-radius: 9999px !important;
|
|
5280
4636
|
}
|
|
5281
4637
|
|
|
5282
|
-
.
|
|
5283
|
-
|
|
4638
|
+
.radius-lg-circle-square {
|
|
4639
|
+
border-radius: 0 !important;
|
|
5284
4640
|
}
|
|
5285
4641
|
|
|
5286
|
-
.
|
|
5287
|
-
|
|
4642
|
+
.radius-lg-circle-square-top,
|
|
4643
|
+
.radius-lg-circle-square-left,
|
|
4644
|
+
.radius-lg-circle-square-top-left {
|
|
4645
|
+
border-top-left-radius: 0 !important;
|
|
5288
4646
|
}
|
|
5289
4647
|
|
|
5290
|
-
.
|
|
5291
|
-
|
|
4648
|
+
.radius-lg-circle-square-top,
|
|
4649
|
+
.radius-lg-circle-square-right,
|
|
4650
|
+
.radius-lg-circle-square-top-right {
|
|
4651
|
+
border-top-right-radius: 0 !important;
|
|
5292
4652
|
}
|
|
5293
4653
|
|
|
5294
|
-
.
|
|
5295
|
-
|
|
4654
|
+
.radius-lg-circle-square-bottom,
|
|
4655
|
+
.radius-lg-circle-square-right,
|
|
4656
|
+
.radius-lg-circle-square-bottom-right {
|
|
4657
|
+
border-bottom-right-radius: 0 !important;
|
|
5296
4658
|
}
|
|
5297
4659
|
|
|
5298
|
-
.
|
|
5299
|
-
|
|
4660
|
+
.radius-lg-circle-square-bottom,
|
|
4661
|
+
.radius-lg-circle-square-left,
|
|
4662
|
+
.radius-lg-circle-square-bottom-left {
|
|
4663
|
+
border-bottom-left-radius: 0 !important;
|
|
5300
4664
|
}
|
|
5301
4665
|
|
|
5302
|
-
.
|
|
5303
|
-
|
|
4666
|
+
.shadow {
|
|
4667
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5304
4668
|
}
|
|
5305
4669
|
|
|
5306
|
-
.
|
|
5307
|
-
|
|
4670
|
+
.shadow-flat {
|
|
4671
|
+
box-shadow: 0 0 0 0 transparent !important;
|
|
5308
4672
|
}
|
|
5309
4673
|
|
|
5310
|
-
.
|
|
5311
|
-
|
|
4674
|
+
.shadow-1 {
|
|
4675
|
+
box-shadow: 0 1px 3px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5312
4676
|
}
|
|
5313
4677
|
|
|
5314
|
-
.
|
|
5315
|
-
|
|
4678
|
+
.shadow-2 {
|
|
4679
|
+
box-shadow: 0 2px 6px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5316
4680
|
}
|
|
5317
4681
|
|
|
5318
|
-
.
|
|
5319
|
-
|
|
4682
|
+
.shadow-3 {
|
|
4683
|
+
box-shadow: 0 4px 12px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5320
4684
|
}
|
|
5321
4685
|
|
|
5322
|
-
.
|
|
5323
|
-
|
|
4686
|
+
.shadow-4 {
|
|
4687
|
+
box-shadow: 0 8px 18px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5324
4688
|
}
|
|
5325
4689
|
|
|
5326
|
-
.
|
|
5327
|
-
|
|
4690
|
+
.shadow-5 {
|
|
4691
|
+
box-shadow: 0 12px 24px var(--vb-shadow-color, hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%)) !important;
|
|
5328
4692
|
}
|
|
5329
4693
|
|
|
5330
4694
|
.display-inline {
|
|
@@ -5676,164 +5040,87 @@ input::-moz-placeholder {
|
|
|
5676
5040
|
}
|
|
5677
5041
|
|
|
5678
5042
|
.flex-gap {
|
|
5679
|
-
|
|
5680
|
-
margin-left: -1em !important;
|
|
5681
|
-
}
|
|
5682
|
-
.flex-gap > * {
|
|
5683
|
-
margin-top: 1em !important;
|
|
5684
|
-
margin-left: 1em !important;
|
|
5043
|
+
gap: 1em !important;
|
|
5685
5044
|
}
|
|
5686
5045
|
|
|
5687
5046
|
.flex-gap-none {
|
|
5688
|
-
|
|
5689
|
-
margin-left: 0 !important;
|
|
5690
|
-
}
|
|
5691
|
-
.flex-gap-none > * {
|
|
5692
|
-
margin-top: 0 !important;
|
|
5693
|
-
margin-left: 0 !important;
|
|
5047
|
+
gap: 0 !important;
|
|
5694
5048
|
}
|
|
5695
5049
|
|
|
5696
5050
|
.flex-gap-xs {
|
|
5697
|
-
|
|
5698
|
-
margin-left: -0.25em !important;
|
|
5699
|
-
}
|
|
5700
|
-
.flex-gap-xs > * {
|
|
5701
|
-
margin-top: 0.25em !important;
|
|
5702
|
-
margin-left: 0.25em !important;
|
|
5051
|
+
gap: 0.25em !important;
|
|
5703
5052
|
}
|
|
5704
5053
|
|
|
5705
5054
|
.flex-gap-sm {
|
|
5706
|
-
|
|
5707
|
-
margin-left: -0.5em !important;
|
|
5708
|
-
}
|
|
5709
|
-
.flex-gap-sm > * {
|
|
5710
|
-
margin-top: 0.5em !important;
|
|
5711
|
-
margin-left: 0.5em !important;
|
|
5055
|
+
gap: 0.5em !important;
|
|
5712
5056
|
}
|
|
5713
5057
|
|
|
5714
5058
|
.flex-gap-md {
|
|
5715
|
-
|
|
5716
|
-
margin-left: -1em !important;
|
|
5717
|
-
}
|
|
5718
|
-
.flex-gap-md > * {
|
|
5719
|
-
margin-top: 1em !important;
|
|
5720
|
-
margin-left: 1em !important;
|
|
5059
|
+
gap: 1em !important;
|
|
5721
5060
|
}
|
|
5722
5061
|
|
|
5723
5062
|
.flex-gap-lg {
|
|
5724
|
-
|
|
5725
|
-
margin-left: -1.5em !important;
|
|
5726
|
-
}
|
|
5727
|
-
.flex-gap-lg > * {
|
|
5728
|
-
margin-top: 1.5em !important;
|
|
5729
|
-
margin-left: 1.5em !important;
|
|
5063
|
+
gap: 1.5em !important;
|
|
5730
5064
|
}
|
|
5731
5065
|
|
|
5732
5066
|
.flex-gap-xl {
|
|
5733
|
-
|
|
5734
|
-
margin-left: -2em !important;
|
|
5735
|
-
}
|
|
5736
|
-
.flex-gap-xl > * {
|
|
5737
|
-
margin-top: 2em !important;
|
|
5738
|
-
margin-left: 2em !important;
|
|
5067
|
+
gap: 2em !important;
|
|
5739
5068
|
}
|
|
5740
5069
|
|
|
5741
5070
|
.flex-gap-x {
|
|
5742
|
-
|
|
5743
|
-
}
|
|
5744
|
-
.flex-gap-x > * {
|
|
5745
|
-
margin-left: 1em !important;
|
|
5071
|
+
column-gap: 1em !important;
|
|
5746
5072
|
}
|
|
5747
5073
|
|
|
5748
5074
|
.flex-gap-x-none {
|
|
5749
|
-
|
|
5750
|
-
}
|
|
5751
|
-
.flex-gap-x-none > * {
|
|
5752
|
-
margin-left: 0 !important;
|
|
5075
|
+
column-gap: 0 !important;
|
|
5753
5076
|
}
|
|
5754
5077
|
|
|
5755
5078
|
.flex-gap-x-xs {
|
|
5756
|
-
|
|
5757
|
-
}
|
|
5758
|
-
.flex-gap-x-xs > * {
|
|
5759
|
-
margin-left: 0.25em !important;
|
|
5079
|
+
column-gap: 0.25em !important;
|
|
5760
5080
|
}
|
|
5761
5081
|
|
|
5762
5082
|
.flex-gap-x-sm {
|
|
5763
|
-
|
|
5764
|
-
}
|
|
5765
|
-
.flex-gap-x-sm > * {
|
|
5766
|
-
margin-left: 0.5em !important;
|
|
5083
|
+
column-gap: 0.5em !important;
|
|
5767
5084
|
}
|
|
5768
5085
|
|
|
5769
5086
|
.flex-gap-x-md {
|
|
5770
|
-
|
|
5771
|
-
}
|
|
5772
|
-
.flex-gap-x-md > * {
|
|
5773
|
-
margin-left: 1em !important;
|
|
5087
|
+
column-gap: 1em !important;
|
|
5774
5088
|
}
|
|
5775
5089
|
|
|
5776
5090
|
.flex-gap-x-lg {
|
|
5777
|
-
|
|
5778
|
-
}
|
|
5779
|
-
.flex-gap-x-lg > * {
|
|
5780
|
-
margin-left: 1.5em !important;
|
|
5091
|
+
column-gap: 1.5em !important;
|
|
5781
5092
|
}
|
|
5782
5093
|
|
|
5783
5094
|
.flex-gap-x-xl {
|
|
5784
|
-
|
|
5785
|
-
}
|
|
5786
|
-
.flex-gap-x-xl > * {
|
|
5787
|
-
margin-left: 2em !important;
|
|
5095
|
+
column-gap: 2em !important;
|
|
5788
5096
|
}
|
|
5789
5097
|
|
|
5790
5098
|
.flex-gap-y {
|
|
5791
|
-
|
|
5792
|
-
}
|
|
5793
|
-
.flex-gap-y > * {
|
|
5794
|
-
margin-top: 1em !important;
|
|
5099
|
+
row-gap: 1em !important;
|
|
5795
5100
|
}
|
|
5796
5101
|
|
|
5797
5102
|
.flex-gap-y-none {
|
|
5798
|
-
|
|
5799
|
-
}
|
|
5800
|
-
.flex-gap-y-none > * {
|
|
5801
|
-
margin-top: 0 !important;
|
|
5103
|
+
row-gap: 0 !important;
|
|
5802
5104
|
}
|
|
5803
5105
|
|
|
5804
5106
|
.flex-gap-y-xs {
|
|
5805
|
-
|
|
5806
|
-
}
|
|
5807
|
-
.flex-gap-y-xs > * {
|
|
5808
|
-
margin-top: 0.25em !important;
|
|
5107
|
+
row-gap: 0.25em !important;
|
|
5809
5108
|
}
|
|
5810
5109
|
|
|
5811
5110
|
.flex-gap-y-sm {
|
|
5812
|
-
|
|
5813
|
-
}
|
|
5814
|
-
.flex-gap-y-sm > * {
|
|
5815
|
-
margin-top: 0.5em !important;
|
|
5111
|
+
row-gap: 0.5em !important;
|
|
5816
5112
|
}
|
|
5817
5113
|
|
|
5818
5114
|
.flex-gap-y-md {
|
|
5819
|
-
|
|
5820
|
-
}
|
|
5821
|
-
.flex-gap-y-md > * {
|
|
5822
|
-
margin-top: 1em !important;
|
|
5115
|
+
row-gap: 1em !important;
|
|
5823
5116
|
}
|
|
5824
5117
|
|
|
5825
5118
|
.flex-gap-y-lg {
|
|
5826
|
-
|
|
5827
|
-
}
|
|
5828
|
-
.flex-gap-y-lg > * {
|
|
5829
|
-
margin-top: 1.5em !important;
|
|
5119
|
+
row-gap: 1.5em !important;
|
|
5830
5120
|
}
|
|
5831
5121
|
|
|
5832
5122
|
.flex-gap-y-xl {
|
|
5833
|
-
|
|
5834
|
-
}
|
|
5835
|
-
.flex-gap-y-xl > * {
|
|
5836
|
-
margin-top: 2em !important;
|
|
5123
|
+
row-gap: 2em !important;
|
|
5837
5124
|
}
|
|
5838
5125
|
|
|
5839
5126
|
.font-family-sans {
|
|
@@ -5849,7 +5136,7 @@ input::-moz-placeholder {
|
|
|
5849
5136
|
}
|
|
5850
5137
|
|
|
5851
5138
|
.font-size-base {
|
|
5852
|
-
font-size:
|
|
5139
|
+
font-size: 1rem !important;
|
|
5853
5140
|
}
|
|
5854
5141
|
|
|
5855
5142
|
.font-size-sm {
|
|
@@ -5861,7 +5148,7 @@ input::-moz-placeholder {
|
|
|
5861
5148
|
}
|
|
5862
5149
|
|
|
5863
5150
|
.font-leading-base {
|
|
5864
|
-
line-height: 1.
|
|
5151
|
+
line-height: 1.625 !important;
|
|
5865
5152
|
}
|
|
5866
5153
|
|
|
5867
5154
|
.font-leading-sm {
|
|
@@ -5869,7 +5156,7 @@ input::-moz-placeholder {
|
|
|
5869
5156
|
}
|
|
5870
5157
|
|
|
5871
5158
|
.font-leading-lg {
|
|
5872
|
-
line-height: 1.
|
|
5159
|
+
line-height: 1.875 !important;
|
|
5873
5160
|
}
|
|
5874
5161
|
|
|
5875
5162
|
.font-kerning-0 {
|
|
@@ -6254,6 +5541,66 @@ input::-moz-placeholder {
|
|
|
6254
5541
|
max-width: 100% !important;
|
|
6255
5542
|
}
|
|
6256
5543
|
|
|
5544
|
+
.overflow-visible {
|
|
5545
|
+
overflow: visible !important;
|
|
5546
|
+
}
|
|
5547
|
+
|
|
5548
|
+
.overflow-x-visible {
|
|
5549
|
+
overflow-x: visible !important;
|
|
5550
|
+
}
|
|
5551
|
+
|
|
5552
|
+
.overflow-y-visible {
|
|
5553
|
+
overflow-y: visible !important;
|
|
5554
|
+
}
|
|
5555
|
+
|
|
5556
|
+
.overflow-hidden {
|
|
5557
|
+
overflow: hidden !important;
|
|
5558
|
+
}
|
|
5559
|
+
|
|
5560
|
+
.overflow-x-hidden {
|
|
5561
|
+
overflow-x: hidden !important;
|
|
5562
|
+
}
|
|
5563
|
+
|
|
5564
|
+
.overflow-y-hidden {
|
|
5565
|
+
overflow-y: hidden !important;
|
|
5566
|
+
}
|
|
5567
|
+
|
|
5568
|
+
.overflow-clip {
|
|
5569
|
+
overflow: clip !important;
|
|
5570
|
+
}
|
|
5571
|
+
|
|
5572
|
+
.overflow-x-clip {
|
|
5573
|
+
overflow-x: clip !important;
|
|
5574
|
+
}
|
|
5575
|
+
|
|
5576
|
+
.overflow-y-clip {
|
|
5577
|
+
overflow-y: clip !important;
|
|
5578
|
+
}
|
|
5579
|
+
|
|
5580
|
+
.overflow-scroll {
|
|
5581
|
+
overflow: scroll !important;
|
|
5582
|
+
}
|
|
5583
|
+
|
|
5584
|
+
.overflow-x-scroll {
|
|
5585
|
+
overflow-x: scroll !important;
|
|
5586
|
+
}
|
|
5587
|
+
|
|
5588
|
+
.overflow-y-scroll {
|
|
5589
|
+
overflow-y: scroll !important;
|
|
5590
|
+
}
|
|
5591
|
+
|
|
5592
|
+
.overflow-auto {
|
|
5593
|
+
overflow: auto !important;
|
|
5594
|
+
}
|
|
5595
|
+
|
|
5596
|
+
.overflow-x-auto {
|
|
5597
|
+
overflow-x: auto !important;
|
|
5598
|
+
}
|
|
5599
|
+
|
|
5600
|
+
.overflow-y-auto {
|
|
5601
|
+
overflow-y: auto !important;
|
|
5602
|
+
}
|
|
5603
|
+
|
|
6257
5604
|
.padding {
|
|
6258
5605
|
padding: 1em !important;
|
|
6259
5606
|
}
|
|
@@ -6530,6 +5877,154 @@ input::-moz-placeholder {
|
|
|
6530
5877
|
white-space: nowrap !important;
|
|
6531
5878
|
}
|
|
6532
5879
|
|
|
5880
|
+
:root {
|
|
5881
|
+
--vb-primary-hs: 152deg, 60%;
|
|
5882
|
+
--vb-primary: var(--vb-primary-50);
|
|
5883
|
+
--vb-primary-0: hsl(var(--vb-primary-hs), 0%);
|
|
5884
|
+
--vb-primary-5: hsl(var(--vb-primary-hs), 5%);
|
|
5885
|
+
--vb-primary-10: hsl(var(--vb-primary-hs), 10%);
|
|
5886
|
+
--vb-primary-12: hsl(var(--vb-primary-hs), 12%);
|
|
5887
|
+
--vb-primary-15: hsl(var(--vb-primary-hs), 15%);
|
|
5888
|
+
--vb-primary-20: hsl(var(--vb-primary-hs), 20%);
|
|
5889
|
+
--vb-primary-30: hsl(var(--vb-primary-hs), 30%);
|
|
5890
|
+
--vb-primary-40: hsl(var(--vb-primary-hs), 40%);
|
|
5891
|
+
--vb-primary-50: hsl(var(--vb-primary-hs), 50%);
|
|
5892
|
+
--vb-primary-60: hsl(var(--vb-primary-hs), 60%);
|
|
5893
|
+
--vb-primary-70: hsl(var(--vb-primary-hs), 70%);
|
|
5894
|
+
--vb-primary-80: hsl(var(--vb-primary-hs), 80%);
|
|
5895
|
+
--vb-primary-90: hsl(var(--vb-primary-hs), 90%);
|
|
5896
|
+
--vb-primary-95: hsl(var(--vb-primary-hs), 95%);
|
|
5897
|
+
--vb-primary-98: hsl(var(--vb-primary-hs), 98%);
|
|
5898
|
+
--vb-primary-100: hsl(var(--vb-primary-hs), 100%);
|
|
5899
|
+
--vb-secondary-hs: 214deg, 50%;
|
|
5900
|
+
--vb-secondary: var(--vb-secondary-50);
|
|
5901
|
+
--vb-secondary-0: hsl(var(--vb-secondary-hs), 0%);
|
|
5902
|
+
--vb-secondary-5: hsl(var(--vb-secondary-hs), 5%);
|
|
5903
|
+
--vb-secondary-10: hsl(var(--vb-secondary-hs), 10%);
|
|
5904
|
+
--vb-secondary-12: hsl(var(--vb-secondary-hs), 12%);
|
|
5905
|
+
--vb-secondary-15: hsl(var(--vb-secondary-hs), 15%);
|
|
5906
|
+
--vb-secondary-20: hsl(var(--vb-secondary-hs), 20%);
|
|
5907
|
+
--vb-secondary-30: hsl(var(--vb-secondary-hs), 30%);
|
|
5908
|
+
--vb-secondary-40: hsl(var(--vb-secondary-hs), 40%);
|
|
5909
|
+
--vb-secondary-50: hsl(var(--vb-secondary-hs), 50%);
|
|
5910
|
+
--vb-secondary-60: hsl(var(--vb-secondary-hs), 60%);
|
|
5911
|
+
--vb-secondary-70: hsl(var(--vb-secondary-hs), 70%);
|
|
5912
|
+
--vb-secondary-80: hsl(var(--vb-secondary-hs), 80%);
|
|
5913
|
+
--vb-secondary-90: hsl(var(--vb-secondary-hs), 90%);
|
|
5914
|
+
--vb-secondary-95: hsl(var(--vb-secondary-hs), 95%);
|
|
5915
|
+
--vb-secondary-98: hsl(var(--vb-secondary-hs), 98%);
|
|
5916
|
+
--vb-secondary-100: hsl(var(--vb-secondary-hs), 100%);
|
|
5917
|
+
--vb-neutral-hs: 214deg, 20%;
|
|
5918
|
+
--vb-neutral: var(--vb-neutral-50);
|
|
5919
|
+
--vb-neutral-0: hsl(var(--vb-neutral-hs), 0%);
|
|
5920
|
+
--vb-neutral-5: hsl(var(--vb-neutral-hs), 5%);
|
|
5921
|
+
--vb-neutral-10: hsl(var(--vb-neutral-hs), 10%);
|
|
5922
|
+
--vb-neutral-12: hsl(var(--vb-neutral-hs), 12%);
|
|
5923
|
+
--vb-neutral-15: hsl(var(--vb-neutral-hs), 15%);
|
|
5924
|
+
--vb-neutral-20: hsl(var(--vb-neutral-hs), 20%);
|
|
5925
|
+
--vb-neutral-30: hsl(var(--vb-neutral-hs), 30%);
|
|
5926
|
+
--vb-neutral-40: hsl(var(--vb-neutral-hs), 40%);
|
|
5927
|
+
--vb-neutral-50: hsl(var(--vb-neutral-hs), 50%);
|
|
5928
|
+
--vb-neutral-60: hsl(var(--vb-neutral-hs), 60%);
|
|
5929
|
+
--vb-neutral-70: hsl(var(--vb-neutral-hs), 70%);
|
|
5930
|
+
--vb-neutral-80: hsl(var(--vb-neutral-hs), 80%);
|
|
5931
|
+
--vb-neutral-90: hsl(var(--vb-neutral-hs), 90%);
|
|
5932
|
+
--vb-neutral-95: hsl(var(--vb-neutral-hs), 95%);
|
|
5933
|
+
--vb-neutral-98: hsl(var(--vb-neutral-hs), 98%);
|
|
5934
|
+
--vb-neutral-100: hsl(var(--vb-neutral-hs), 100%);
|
|
5935
|
+
--vb-important-hs: 0deg, 80%;
|
|
5936
|
+
--vb-important: var(--vb-important-50);
|
|
5937
|
+
--vb-important-0: hsl(var(--vb-important-hs), 0%);
|
|
5938
|
+
--vb-important-5: hsl(var(--vb-important-hs), 5%);
|
|
5939
|
+
--vb-important-10: hsl(var(--vb-important-hs), 10%);
|
|
5940
|
+
--vb-important-12: hsl(var(--vb-important-hs), 12%);
|
|
5941
|
+
--vb-important-15: hsl(var(--vb-important-hs), 15%);
|
|
5942
|
+
--vb-important-20: hsl(var(--vb-important-hs), 20%);
|
|
5943
|
+
--vb-important-30: hsl(var(--vb-important-hs), 30%);
|
|
5944
|
+
--vb-important-40: hsl(var(--vb-important-hs), 40%);
|
|
5945
|
+
--vb-important-50: hsl(var(--vb-important-hs), 50%);
|
|
5946
|
+
--vb-important-60: hsl(var(--vb-important-hs), 60%);
|
|
5947
|
+
--vb-important-70: hsl(var(--vb-important-hs), 70%);
|
|
5948
|
+
--vb-important-80: hsl(var(--vb-important-hs), 80%);
|
|
5949
|
+
--vb-important-90: hsl(var(--vb-important-hs), 90%);
|
|
5950
|
+
--vb-important-95: hsl(var(--vb-important-hs), 95%);
|
|
5951
|
+
--vb-important-98: hsl(var(--vb-important-hs), 98%);
|
|
5952
|
+
--vb-important-100: hsl(var(--vb-important-hs), 100%);
|
|
5953
|
+
}
|
|
5954
|
+
|
|
5955
|
+
:root, .vb-theme-root {
|
|
5956
|
+
--vb-background: var(--vb-neutral-100, hsl(214, 20%, 100%));
|
|
5957
|
+
--vb-background-dark: var(--vb-neutral-98, hsl(214, 20%, 98%));
|
|
5958
|
+
--vb-background-darker: var(--vb-neutral-95, hsl(214, 20%, 95%));
|
|
5959
|
+
--vb-background-hover: rgba(0, 0, 0, 0.05);
|
|
5960
|
+
--vb-background-focus: rgba(0, 0, 0, 0.05);
|
|
5961
|
+
--vb-background-active: rgba(0, 0, 0, 0.1);
|
|
5962
|
+
--vb-foreground: var(--vb-neutral-20, hsl(214, 20%, 20%));
|
|
5963
|
+
--vb-foreground-light: var(--vb-neutral-40, hsl(214, 20%, 40%));
|
|
5964
|
+
--vb-foreground-lighter: var(--vb-neutral-60, hsl(214, 20%, 60%));
|
|
5965
|
+
--vb-border-color: rgba(0, 0, 0, 0.1);
|
|
5966
|
+
--vb-border-color-dark: rgba(0, 0, 0, 0.2);
|
|
5967
|
+
--vb-border-color-darker: rgba(0, 0, 0, 0.3);
|
|
5968
|
+
--vb-shadow-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%);
|
|
5969
|
+
--vb-focus-visible: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
5970
|
+
color-scheme: light;
|
|
5971
|
+
}
|
|
5972
|
+
@media (prefers-color-scheme: dark) {
|
|
5973
|
+
:root, .vb-theme-root {
|
|
5974
|
+
--vb-background: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
5975
|
+
--vb-background-dark: var(--vb-neutral-12, hsl(214, 20%, 12%));
|
|
5976
|
+
--vb-background-darker: var(--vb-neutral-15, hsl(214, 20%, 15%));
|
|
5977
|
+
--vb-background-hover: rgba(255, 255, 255, 0.05);
|
|
5978
|
+
--vb-background-focus: rgba(255, 255, 255, 0.05);
|
|
5979
|
+
--vb-background-active: rgba(255, 255, 255, 0.1);
|
|
5980
|
+
--vb-foreground: var(--vb-neutral-90, hsl(214, 20%, 90%));
|
|
5981
|
+
--vb-foreground-light: var(--vb-neutral-70, hsl(214, 20%, 70%));
|
|
5982
|
+
--vb-foreground-lighter: var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
5983
|
+
--vb-border-color: rgba(255, 255, 255, 0.1);
|
|
5984
|
+
--vb-border-color-dark: rgba(255, 255, 255, 0.2);
|
|
5985
|
+
--vb-border-color-darker: rgba(255, 255, 255, 0.3);
|
|
5986
|
+
--vb-shadow-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 0%, 20%);
|
|
5987
|
+
--vb-focus-visible: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
5988
|
+
color-scheme: dark;
|
|
5989
|
+
}
|
|
5990
|
+
}
|
|
5991
|
+
|
|
5992
|
+
.vb-theme-light {
|
|
5993
|
+
--vb-background: var(--vb-neutral-100, hsl(214, 20%, 100%));
|
|
5994
|
+
--vb-background-dark: var(--vb-neutral-98, hsl(214, 20%, 98%));
|
|
5995
|
+
--vb-background-darker: var(--vb-neutral-95, hsl(214, 20%, 95%));
|
|
5996
|
+
--vb-background-hover: rgba(0, 0, 0, 0.05);
|
|
5997
|
+
--vb-background-focus: rgba(0, 0, 0, 0.05);
|
|
5998
|
+
--vb-background-active: rgba(0, 0, 0, 0.1);
|
|
5999
|
+
--vb-foreground: var(--vb-neutral-20, hsl(214, 20%, 20%));
|
|
6000
|
+
--vb-foreground-light: var(--vb-neutral-40, hsl(214, 20%, 40%));
|
|
6001
|
+
--vb-foreground-lighter: var(--vb-neutral-60, hsl(214, 20%, 60%));
|
|
6002
|
+
--vb-border-color: rgba(0, 0, 0, 0.1);
|
|
6003
|
+
--vb-border-color-dark: rgba(0, 0, 0, 0.2);
|
|
6004
|
+
--vb-border-color-darker: rgba(0, 0, 0, 0.3);
|
|
6005
|
+
--vb-shadow-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 20%, 20%);
|
|
6006
|
+
--vb-focus-visible: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
6007
|
+
color-scheme: light;
|
|
6008
|
+
}
|
|
6009
|
+
|
|
6010
|
+
.vb-theme-dark {
|
|
6011
|
+
--vb-background: var(--vb-neutral-10, hsl(214, 20%, 10%));
|
|
6012
|
+
--vb-background-dark: var(--vb-neutral-12, hsl(214, 20%, 12%));
|
|
6013
|
+
--vb-background-darker: var(--vb-neutral-15, hsl(214, 20%, 15%));
|
|
6014
|
+
--vb-background-hover: rgba(255, 255, 255, 0.05);
|
|
6015
|
+
--vb-background-focus: rgba(255, 255, 255, 0.05);
|
|
6016
|
+
--vb-background-active: rgba(255, 255, 255, 0.1);
|
|
6017
|
+
--vb-foreground: var(--vb-neutral-90, hsl(214, 20%, 90%));
|
|
6018
|
+
--vb-foreground-light: var(--vb-neutral-70, hsl(214, 20%, 70%));
|
|
6019
|
+
--vb-foreground-lighter: var(--vb-neutral-50, hsl(214, 20%, 50%));
|
|
6020
|
+
--vb-border-color: rgba(255, 255, 255, 0.1);
|
|
6021
|
+
--vb-border-color-dark: rgba(255, 255, 255, 0.2);
|
|
6022
|
+
--vb-border-color-darker: rgba(255, 255, 255, 0.3);
|
|
6023
|
+
--vb-shadow-color: hsl(var(--vb-neutral-hs, 214deg, 20%), 0%, 20%);
|
|
6024
|
+
--vb-focus-visible: var(--vb-primary-50, hsl(152, 60%, 50%));
|
|
6025
|
+
color-scheme: dark;
|
|
6026
|
+
}
|
|
6027
|
+
|
|
6533
6028
|
:root {
|
|
6534
6029
|
--vb-breakpoint-xs: 480px;
|
|
6535
6030
|
--vb-breakpoint-sm: 620px;
|
|
@@ -6538,4 +6033,17 @@ input::-moz-placeholder {
|
|
|
6538
6033
|
--vb-breakpoint-xl: 1380px;
|
|
6539
6034
|
}
|
|
6540
6035
|
|
|
6541
|
-
|
|
6036
|
+
:root {
|
|
6037
|
+
--vb-border-radius: 0.25rem;
|
|
6038
|
+
--vb-border-radius-lg: 0.5rem;
|
|
6039
|
+
--vb-border-radius-circle: 9999px;
|
|
6040
|
+
}
|
|
6041
|
+
|
|
6042
|
+
:root {
|
|
6043
|
+
--vb-transition-duration: 0.3s;
|
|
6044
|
+
--vb-transition-duration-short: 0.15s;
|
|
6045
|
+
--vb-transition-duration-long: 0.6s;
|
|
6046
|
+
--vb-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
6047
|
+
}
|
|
6048
|
+
|
|
6049
|
+
/*# sourceMappingURL=index.css.map */
|