@dialpad/dialtone 7.20.0 → 7.22.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/build/less/components/badge.less +34 -1
- package/lib/build/less/components/chip.less +5 -5
- package/lib/build/less/components/input.less +1 -0
- package/lib/build/less/components/table.less +1 -1
- package/lib/build/less/utilities/colors.less +49 -0
- package/lib/build/less/variables/colors.less +11 -0
- package/lib/build/svg/brand/dialbot.svg +11 -0
- package/lib/dist/css/dialtone.css +411 -5
- package/lib/dist/css/dialtone.min.css +1 -1
- package/lib/dist/svg/brand/dialbot.svg +1 -0
- package/lib/dist/vue/icons/IconDialbot.vue +3 -0
- package/package.json +2 -2
|
@@ -579,7 +579,7 @@ body {
|
|
|
579
579
|
}
|
|
580
580
|
.d-badge {
|
|
581
581
|
--badge-color-text: var(--fc-primary);
|
|
582
|
-
--badge-color-background: var(--
|
|
582
|
+
--badge-color-background: var(--bgc-moderate-opaque);
|
|
583
583
|
--badge-color-background-ai: linear-gradient(to bottom right, var(--purple-400) 0%, var(--magenta-300) 100%);
|
|
584
584
|
--badge-radius: var(--size-300);
|
|
585
585
|
--badge-line-height: calc(var(--size-500) + var(--size-200));
|
|
@@ -590,6 +590,7 @@ body {
|
|
|
590
590
|
--badge-padding-y: var(--space-100);
|
|
591
591
|
--badge-padding-x: var(--space-400);
|
|
592
592
|
--badge-text-case: none;
|
|
593
|
+
--badge-decorative-color: var(--black-900);
|
|
593
594
|
display: inline-flex;
|
|
594
595
|
gap: var(--badge-gap);
|
|
595
596
|
align-items: center;
|
|
@@ -634,8 +635,82 @@ body {
|
|
|
634
635
|
--badge-color-background: var(--magenta-300);
|
|
635
636
|
background-image: var(--badge-color-background-ai);
|
|
636
637
|
}
|
|
638
|
+
.d-badge--decorate-black-400 {
|
|
639
|
+
--badge-decorative-color: var(--black-400);
|
|
640
|
+
}
|
|
641
|
+
.d-badge--decorate-black-500 {
|
|
642
|
+
--badge-decorative-color: var(--black-500);
|
|
643
|
+
}
|
|
644
|
+
.d-badge--decorate-black-900 {
|
|
645
|
+
--badge-decorative-color: var(--black-900);
|
|
646
|
+
}
|
|
647
|
+
.d-badge--decorate-red-200 {
|
|
648
|
+
--badge-decorative-color: var(--red-200);
|
|
649
|
+
}
|
|
650
|
+
.d-badge--decorate-red-300 {
|
|
651
|
+
--badge-decorative-color: var(--red-300);
|
|
652
|
+
}
|
|
653
|
+
.d-badge--decorate-red-400 {
|
|
654
|
+
--badge-decorative-color: var(--red-400);
|
|
655
|
+
}
|
|
656
|
+
.d-badge--decorate-purple-200 {
|
|
657
|
+
--badge-decorative-color: var(--purple-200);
|
|
658
|
+
}
|
|
659
|
+
.d-badge--decorate-purple-300 {
|
|
660
|
+
--badge-decorative-color: var(--purple-300);
|
|
661
|
+
}
|
|
662
|
+
.d-badge--decorate-purple-400 {
|
|
663
|
+
--badge-decorative-color: var(--purple-400);
|
|
664
|
+
}
|
|
665
|
+
.d-badge--decorate-purple-500 {
|
|
666
|
+
--badge-decorative-color: var(--purple-500);
|
|
667
|
+
}
|
|
668
|
+
.d-badge--decorate-blue-200 {
|
|
669
|
+
--badge-decorative-color: var(--blue-200);
|
|
670
|
+
}
|
|
671
|
+
.d-badge--decorate-blue-300 {
|
|
672
|
+
--badge-decorative-color: var(--blue-300);
|
|
673
|
+
}
|
|
674
|
+
.d-badge--decorate-blue-400 {
|
|
675
|
+
--badge-decorative-color: var(--blue-400);
|
|
676
|
+
}
|
|
677
|
+
.d-badge--decorate-green-300 {
|
|
678
|
+
--badge-decorative-color: var(--green-300);
|
|
679
|
+
}
|
|
680
|
+
.d-badge--decorate-green-400 {
|
|
681
|
+
--badge-decorative-color: var(--green-400);
|
|
682
|
+
}
|
|
683
|
+
.d-badge--decorate-green-500 {
|
|
684
|
+
--badge-decorative-color: var(--green-500);
|
|
685
|
+
}
|
|
686
|
+
.d-badge--decorate-gold-300 {
|
|
687
|
+
--badge-decorative-color: var(--gold-300);
|
|
688
|
+
}
|
|
689
|
+
.d-badge--decorate-gold-400 {
|
|
690
|
+
--badge-decorative-color: var(--gold-400);
|
|
691
|
+
}
|
|
692
|
+
.d-badge--decorate-gold-500 {
|
|
693
|
+
--badge-decorative-color: var(--gold-500);
|
|
694
|
+
}
|
|
695
|
+
.d-badge--decorate-magenta-200 {
|
|
696
|
+
--badge-decorative-color: var(--magenta-200);
|
|
697
|
+
}
|
|
698
|
+
.d-badge--decorate-magenta-300 {
|
|
699
|
+
--badge-decorative-color: var(--magenta-300);
|
|
700
|
+
}
|
|
701
|
+
.d-badge--decorate-magenta-400 {
|
|
702
|
+
--badge-decorative-color: var(--magenta-400);
|
|
703
|
+
}
|
|
704
|
+
.d-badge__decorative {
|
|
705
|
+
display: inline-flex;
|
|
706
|
+
width: var(--size-400);
|
|
707
|
+
height: var(--size-400);
|
|
708
|
+
background-color: var(--badge-decorative-color);
|
|
709
|
+
border-radius: var(--size-200);
|
|
710
|
+
}
|
|
637
711
|
.d-badge__label {
|
|
638
712
|
display: flex;
|
|
713
|
+
align-items: center;
|
|
639
714
|
}
|
|
640
715
|
.d-badge__icon-left,
|
|
641
716
|
.d-badge__icon-right {
|
|
@@ -1220,14 +1295,14 @@ body {
|
|
|
1220
1295
|
padding: 0 var(--size-500) var(--size-500);
|
|
1221
1296
|
}
|
|
1222
1297
|
.d-chip {
|
|
1298
|
+
--chip-color-text: var(--fc-primary);
|
|
1299
|
+
--chip-color-background: var(--bgc-moderate-opaque);
|
|
1300
|
+
--chip-border-radius: var(--br-pill);
|
|
1223
1301
|
position: relative;
|
|
1224
1302
|
display: inline-flex;
|
|
1225
1303
|
align-items: center;
|
|
1226
1304
|
}
|
|
1227
1305
|
.d-chip__label {
|
|
1228
|
-
--chip-color-text: var(--fc-primary);
|
|
1229
|
-
--chip-color-background: var(--black-200);
|
|
1230
|
-
--chip-border-radius: var(--br-pill);
|
|
1231
1306
|
display: inline-flex;
|
|
1232
1307
|
align-items: center;
|
|
1233
1308
|
justify-content: center;
|
|
@@ -1641,6 +1716,7 @@ legend .d-label {
|
|
|
1641
1716
|
transition-duration: var(--td100);
|
|
1642
1717
|
transition-property: box-shadow, background-color;
|
|
1643
1718
|
appearance: none;
|
|
1719
|
+
caret-color: var(--input-color-text);
|
|
1644
1720
|
}
|
|
1645
1721
|
.d-input::placeholder,
|
|
1646
1722
|
.d-input--md::placeholder,
|
|
@@ -2805,6 +2881,7 @@ legend .d-label {
|
|
|
2805
2881
|
transition-duration: var(--td100);
|
|
2806
2882
|
transition-property: box-shadow, background-color;
|
|
2807
2883
|
appearance: none;
|
|
2884
|
+
caret-color: var(--input-color-text);
|
|
2808
2885
|
padding-right: var(--select-notch-padding-right);
|
|
2809
2886
|
}
|
|
2810
2887
|
.d-select__input::placeholder {
|
|
@@ -3018,7 +3095,7 @@ legend .d-label {
|
|
|
3018
3095
|
--table-color-border: var(--bc-inverted-default);
|
|
3019
3096
|
}
|
|
3020
3097
|
.d-table--striped tr:nth-child(even) {
|
|
3021
|
-
background-color:
|
|
3098
|
+
background-color: var(--bgc-secondary-opaque);
|
|
3022
3099
|
}
|
|
3023
3100
|
.d-table--striped.d-table--inverted tr:nth-child(even) {
|
|
3024
3101
|
background-color: hsla(var(--bgc-primary-hsl) / 0.1);
|
|
@@ -13417,30 +13494,348 @@ body.theme-dark .d\:d-bgc-black-700 {
|
|
|
13417
13494
|
.fv\:d-fc-unset:focus-visible {
|
|
13418
13495
|
color: unset !important;
|
|
13419
13496
|
}
|
|
13497
|
+
.d-bgc-secondary-opaque {
|
|
13498
|
+
background-color: var(--bgc-secondary-opaque);
|
|
13499
|
+
}
|
|
13500
|
+
.h\:d-bgc-secondary-opaque:hover {
|
|
13501
|
+
background-color: var(--bgc-secondary-opaque);
|
|
13502
|
+
}
|
|
13503
|
+
.f\:d-bgc-secondary-opaque:focus {
|
|
13504
|
+
background-color: var(--bgc-secondary-opaque);
|
|
13505
|
+
}
|
|
13506
|
+
.f\:d-bgc-secondary-opaque:focus-within {
|
|
13507
|
+
background-color: var(--bgc-secondary-opaque);
|
|
13508
|
+
}
|
|
13509
|
+
.fv\:d-bgc-secondary-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-secondary-opaque.focus-visible {
|
|
13510
|
+
background-color: var(--bgc-secondary-opaque);
|
|
13511
|
+
}
|
|
13512
|
+
.fv\:d-bgc-secondary-opaque:focus-visible {
|
|
13513
|
+
background-color: var(--bgc-secondary-opaque);
|
|
13514
|
+
}
|
|
13515
|
+
.d-bgc-moderate-opaque {
|
|
13516
|
+
background-color: var(--bgc-moderate-opaque);
|
|
13517
|
+
}
|
|
13518
|
+
.h\:d-bgc-moderate-opaque:hover {
|
|
13519
|
+
background-color: var(--bgc-moderate-opaque);
|
|
13520
|
+
}
|
|
13521
|
+
.f\:d-bgc-moderate-opaque:focus {
|
|
13522
|
+
background-color: var(--bgc-moderate-opaque);
|
|
13523
|
+
}
|
|
13524
|
+
.f\:d-bgc-moderate-opaque:focus-within {
|
|
13525
|
+
background-color: var(--bgc-moderate-opaque);
|
|
13526
|
+
}
|
|
13527
|
+
.fv\:d-bgc-moderate-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-moderate-opaque.focus-visible {
|
|
13528
|
+
background-color: var(--bgc-moderate-opaque);
|
|
13529
|
+
}
|
|
13530
|
+
.fv\:d-bgc-moderate-opaque:focus-visible {
|
|
13531
|
+
background-color: var(--bgc-moderate-opaque);
|
|
13532
|
+
}
|
|
13533
|
+
.d-bgc-bold-opaque {
|
|
13534
|
+
background-color: var(--bgc-bold-opaque);
|
|
13535
|
+
}
|
|
13536
|
+
.h\:d-bgc-bold-opaque:hover {
|
|
13537
|
+
background-color: var(--bgc-bold-opaque);
|
|
13538
|
+
}
|
|
13539
|
+
.f\:d-bgc-bold-opaque:focus {
|
|
13540
|
+
background-color: var(--bgc-bold-opaque);
|
|
13541
|
+
}
|
|
13542
|
+
.f\:d-bgc-bold-opaque:focus-within {
|
|
13543
|
+
background-color: var(--bgc-bold-opaque);
|
|
13544
|
+
}
|
|
13545
|
+
.fv\:d-bgc-bold-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-bold-opaque.focus-visible {
|
|
13546
|
+
background-color: var(--bgc-bold-opaque);
|
|
13547
|
+
}
|
|
13548
|
+
.fv\:d-bgc-bold-opaque:focus-visible {
|
|
13549
|
+
background-color: var(--bgc-bold-opaque);
|
|
13550
|
+
}
|
|
13551
|
+
.d-bgc-success-opaque {
|
|
13552
|
+
background-color: var(--bgc-success-opaque) !important;
|
|
13553
|
+
}
|
|
13554
|
+
.h\:d-bgc-success-opaque:hover {
|
|
13555
|
+
background-color: var(--bgc-success-opaque) !important;
|
|
13556
|
+
}
|
|
13557
|
+
.f\:d-bgc-success-opaque:focus {
|
|
13558
|
+
background-color: var(--bgc-success-opaque) !important;
|
|
13559
|
+
}
|
|
13560
|
+
.f\:d-bgc-success-opaque:focus-within {
|
|
13561
|
+
background-color: var(--bgc-success-opaque) !important;
|
|
13562
|
+
}
|
|
13563
|
+
.fv\:d-bgc-success-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-success-opaque.focus-visible {
|
|
13564
|
+
background-color: var(--bgc-success-opaque) !important;
|
|
13565
|
+
}
|
|
13566
|
+
.fv\:d-bgc-success-opaque:focus-visible {
|
|
13567
|
+
background-color: var(--bgc-success-opaque) !important;
|
|
13568
|
+
}
|
|
13420
13569
|
.d-bgc-success-subtle {
|
|
13421
13570
|
background-color: var(--bgc-success-subtle) !important;
|
|
13422
13571
|
}
|
|
13572
|
+
.h\:d-bgc-success-subtle:hover {
|
|
13573
|
+
background-color: var(--bgc-success-subtle) !important;
|
|
13574
|
+
}
|
|
13575
|
+
.f\:d-bgc-success-subtle:focus {
|
|
13576
|
+
background-color: var(--bgc-success-subtle) !important;
|
|
13577
|
+
}
|
|
13578
|
+
.f\:d-bgc-success-subtle:focus-within {
|
|
13579
|
+
background-color: var(--bgc-success-subtle) !important;
|
|
13580
|
+
}
|
|
13581
|
+
.fv\:d-bgc-success-subtle.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-success-subtle.focus-visible {
|
|
13582
|
+
background-color: var(--bgc-success-subtle) !important;
|
|
13583
|
+
}
|
|
13584
|
+
.fv\:d-bgc-success-subtle:focus-visible {
|
|
13585
|
+
background-color: var(--bgc-success-subtle) !important;
|
|
13586
|
+
}
|
|
13587
|
+
.d-bgc-success-subtle-opaque {
|
|
13588
|
+
background-color: var(--bgc-success-subtle-opaque) !important;
|
|
13589
|
+
}
|
|
13590
|
+
.h\:d-bgc-success-subtle-opaque:hover {
|
|
13591
|
+
background-color: var(--bgc-success-subtle-opaque) !important;
|
|
13592
|
+
}
|
|
13593
|
+
.f\:d-bgc-success-subtle-opaque:focus {
|
|
13594
|
+
background-color: var(--bgc-success-subtle-opaque) !important;
|
|
13595
|
+
}
|
|
13596
|
+
.f\:d-bgc-success-subtle-opaque:focus-within {
|
|
13597
|
+
background-color: var(--bgc-success-subtle-opaque) !important;
|
|
13598
|
+
}
|
|
13599
|
+
.fv\:d-bgc-success-subtle-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-success-subtle-opaque.focus-visible {
|
|
13600
|
+
background-color: var(--bgc-success-subtle-opaque) !important;
|
|
13601
|
+
}
|
|
13602
|
+
.fv\:d-bgc-success-subtle-opaque:focus-visible {
|
|
13603
|
+
background-color: var(--bgc-success-subtle-opaque) !important;
|
|
13604
|
+
}
|
|
13423
13605
|
.d-bgc-success-strong {
|
|
13424
13606
|
background-color: var(--bgc-success-strong) !important;
|
|
13425
13607
|
}
|
|
13608
|
+
.h\:d-bgc-success-strong:hover {
|
|
13609
|
+
background-color: var(--bgc-success-strong) !important;
|
|
13610
|
+
}
|
|
13611
|
+
.f\:d-bgc-success-strong:focus {
|
|
13612
|
+
background-color: var(--bgc-success-strong) !important;
|
|
13613
|
+
}
|
|
13614
|
+
.f\:d-bgc-success-strong:focus-within {
|
|
13615
|
+
background-color: var(--bgc-success-strong) !important;
|
|
13616
|
+
}
|
|
13617
|
+
.fv\:d-bgc-success-strong.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-success-strong.focus-visible {
|
|
13618
|
+
background-color: var(--bgc-success-strong) !important;
|
|
13619
|
+
}
|
|
13620
|
+
.fv\:d-bgc-success-strong:focus-visible {
|
|
13621
|
+
background-color: var(--bgc-success-strong) !important;
|
|
13622
|
+
}
|
|
13623
|
+
.d-bgc-warning-opaque {
|
|
13624
|
+
background-color: var(--bgc-warning-opaque) !important;
|
|
13625
|
+
}
|
|
13626
|
+
.h\:d-bgc-warning-opaque:hover {
|
|
13627
|
+
background-color: var(--bgc-warning-opaque) !important;
|
|
13628
|
+
}
|
|
13629
|
+
.f\:d-bgc-warning-opaque:focus {
|
|
13630
|
+
background-color: var(--bgc-warning-opaque) !important;
|
|
13631
|
+
}
|
|
13632
|
+
.f\:d-bgc-warning-opaque:focus-within {
|
|
13633
|
+
background-color: var(--bgc-warning-opaque) !important;
|
|
13634
|
+
}
|
|
13635
|
+
.fv\:d-bgc-warning-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-warning-opaque.focus-visible {
|
|
13636
|
+
background-color: var(--bgc-warning-opaque) !important;
|
|
13637
|
+
}
|
|
13638
|
+
.fv\:d-bgc-warning-opaque:focus-visible {
|
|
13639
|
+
background-color: var(--bgc-warning-opaque) !important;
|
|
13640
|
+
}
|
|
13426
13641
|
.d-bgc-warning-subtle {
|
|
13427
13642
|
background-color: var(--bgc-warning-subtle) !important;
|
|
13428
13643
|
}
|
|
13644
|
+
.h\:d-bgc-warning-subtle:hover {
|
|
13645
|
+
background-color: var(--bgc-warning-subtle) !important;
|
|
13646
|
+
}
|
|
13647
|
+
.f\:d-bgc-warning-subtle:focus {
|
|
13648
|
+
background-color: var(--bgc-warning-subtle) !important;
|
|
13649
|
+
}
|
|
13650
|
+
.f\:d-bgc-warning-subtle:focus-within {
|
|
13651
|
+
background-color: var(--bgc-warning-subtle) !important;
|
|
13652
|
+
}
|
|
13653
|
+
.fv\:d-bgc-warning-subtle.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-warning-subtle.focus-visible {
|
|
13654
|
+
background-color: var(--bgc-warning-subtle) !important;
|
|
13655
|
+
}
|
|
13656
|
+
.fv\:d-bgc-warning-subtle:focus-visible {
|
|
13657
|
+
background-color: var(--bgc-warning-subtle) !important;
|
|
13658
|
+
}
|
|
13659
|
+
.d-bgc-warning-subtle-opaque {
|
|
13660
|
+
background-color: var(--bgc-warning-subtle-opaque) !important;
|
|
13661
|
+
}
|
|
13662
|
+
.h\:d-bgc-warning-subtle-opaque:hover {
|
|
13663
|
+
background-color: var(--bgc-warning-subtle-opaque) !important;
|
|
13664
|
+
}
|
|
13665
|
+
.f\:d-bgc-warning-subtle-opaque:focus {
|
|
13666
|
+
background-color: var(--bgc-warning-subtle-opaque) !important;
|
|
13667
|
+
}
|
|
13668
|
+
.f\:d-bgc-warning-subtle-opaque:focus-within {
|
|
13669
|
+
background-color: var(--bgc-warning-subtle-opaque) !important;
|
|
13670
|
+
}
|
|
13671
|
+
.fv\:d-bgc-warning-subtle-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-warning-subtle-opaque.focus-visible {
|
|
13672
|
+
background-color: var(--bgc-warning-subtle-opaque) !important;
|
|
13673
|
+
}
|
|
13674
|
+
.fv\:d-bgc-warning-subtle-opaque:focus-visible {
|
|
13675
|
+
background-color: var(--bgc-warning-subtle-opaque) !important;
|
|
13676
|
+
}
|
|
13429
13677
|
.d-bgc-warning-strong {
|
|
13430
13678
|
background-color: var(--bgc-warning-strong) !important;
|
|
13431
13679
|
}
|
|
13680
|
+
.h\:d-bgc-warning-strong:hover {
|
|
13681
|
+
background-color: var(--bgc-warning-strong) !important;
|
|
13682
|
+
}
|
|
13683
|
+
.f\:d-bgc-warning-strong:focus {
|
|
13684
|
+
background-color: var(--bgc-warning-strong) !important;
|
|
13685
|
+
}
|
|
13686
|
+
.f\:d-bgc-warning-strong:focus-within {
|
|
13687
|
+
background-color: var(--bgc-warning-strong) !important;
|
|
13688
|
+
}
|
|
13689
|
+
.fv\:d-bgc-warning-strong.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-warning-strong.focus-visible {
|
|
13690
|
+
background-color: var(--bgc-warning-strong) !important;
|
|
13691
|
+
}
|
|
13692
|
+
.fv\:d-bgc-warning-strong:focus-visible {
|
|
13693
|
+
background-color: var(--bgc-warning-strong) !important;
|
|
13694
|
+
}
|
|
13695
|
+
.d-bgc-info-opaque {
|
|
13696
|
+
background-color: var(--bgc-info-opaque) !important;
|
|
13697
|
+
}
|
|
13698
|
+
.h\:d-bgc-info-opaque:hover {
|
|
13699
|
+
background-color: var(--bgc-info-opaque) !important;
|
|
13700
|
+
}
|
|
13701
|
+
.f\:d-bgc-info-opaque:focus {
|
|
13702
|
+
background-color: var(--bgc-info-opaque) !important;
|
|
13703
|
+
}
|
|
13704
|
+
.f\:d-bgc-info-opaque:focus-within {
|
|
13705
|
+
background-color: var(--bgc-info-opaque) !important;
|
|
13706
|
+
}
|
|
13707
|
+
.fv\:d-bgc-info-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-info-opaque.focus-visible {
|
|
13708
|
+
background-color: var(--bgc-info-opaque) !important;
|
|
13709
|
+
}
|
|
13710
|
+
.fv\:d-bgc-info-opaque:focus-visible {
|
|
13711
|
+
background-color: var(--bgc-info-opaque) !important;
|
|
13712
|
+
}
|
|
13432
13713
|
.d-bgc-info-subtle {
|
|
13433
13714
|
background-color: var(--bgc-info-subtle) !important;
|
|
13434
13715
|
}
|
|
13716
|
+
.h\:d-bgc-info-subtle:hover {
|
|
13717
|
+
background-color: var(--bgc-info-subtle) !important;
|
|
13718
|
+
}
|
|
13719
|
+
.f\:d-bgc-info-subtle:focus {
|
|
13720
|
+
background-color: var(--bgc-info-subtle) !important;
|
|
13721
|
+
}
|
|
13722
|
+
.f\:d-bgc-info-subtle:focus-within {
|
|
13723
|
+
background-color: var(--bgc-info-subtle) !important;
|
|
13724
|
+
}
|
|
13725
|
+
.fv\:d-bgc-info-subtle.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-info-subtle.focus-visible {
|
|
13726
|
+
background-color: var(--bgc-info-subtle) !important;
|
|
13727
|
+
}
|
|
13728
|
+
.fv\:d-bgc-info-subtle:focus-visible {
|
|
13729
|
+
background-color: var(--bgc-info-subtle) !important;
|
|
13730
|
+
}
|
|
13731
|
+
.d-bgc-info-subtle-opaque {
|
|
13732
|
+
background-color: var(--bgc-info-subtle-opaque) !important;
|
|
13733
|
+
}
|
|
13734
|
+
.h\:d-bgc-info-subtle-opaque:hover {
|
|
13735
|
+
background-color: var(--bgc-info-subtle-opaque) !important;
|
|
13736
|
+
}
|
|
13737
|
+
.f\:d-bgc-info-subtle-opaque:focus {
|
|
13738
|
+
background-color: var(--bgc-info-subtle-opaque) !important;
|
|
13739
|
+
}
|
|
13740
|
+
.f\:d-bgc-info-subtle-opaque:focus-within {
|
|
13741
|
+
background-color: var(--bgc-info-subtle-opaque) !important;
|
|
13742
|
+
}
|
|
13743
|
+
.fv\:d-bgc-info-subtle-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-info-subtle-opaque.focus-visible {
|
|
13744
|
+
background-color: var(--bgc-info-subtle-opaque) !important;
|
|
13745
|
+
}
|
|
13746
|
+
.fv\:d-bgc-info-subtle-opaque:focus-visible {
|
|
13747
|
+
background-color: var(--bgc-info-subtle-opaque) !important;
|
|
13748
|
+
}
|
|
13435
13749
|
.d-bgc-info-strong {
|
|
13436
13750
|
background-color: var(--bgc-info-strong) !important;
|
|
13437
13751
|
}
|
|
13752
|
+
.h\:d-bgc-info-strong:hover {
|
|
13753
|
+
background-color: var(--bgc-info-strong) !important;
|
|
13754
|
+
}
|
|
13755
|
+
.f\:d-bgc-info-strong:focus {
|
|
13756
|
+
background-color: var(--bgc-info-strong) !important;
|
|
13757
|
+
}
|
|
13758
|
+
.f\:d-bgc-info-strong:focus-within {
|
|
13759
|
+
background-color: var(--bgc-info-strong) !important;
|
|
13760
|
+
}
|
|
13761
|
+
.fv\:d-bgc-info-strong.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-info-strong.focus-visible {
|
|
13762
|
+
background-color: var(--bgc-info-strong) !important;
|
|
13763
|
+
}
|
|
13764
|
+
.fv\:d-bgc-info-strong:focus-visible {
|
|
13765
|
+
background-color: var(--bgc-info-strong) !important;
|
|
13766
|
+
}
|
|
13767
|
+
.d-bgc-critical-opaque {
|
|
13768
|
+
background-color: var(--bgc-critical-opaque) !important;
|
|
13769
|
+
}
|
|
13770
|
+
.h\:d-bgc-critical-opaque:hover {
|
|
13771
|
+
background-color: var(--bgc-critical-opaque) !important;
|
|
13772
|
+
}
|
|
13773
|
+
.f\:d-bgc-critical-opaque:focus {
|
|
13774
|
+
background-color: var(--bgc-critical-opaque) !important;
|
|
13775
|
+
}
|
|
13776
|
+
.f\:d-bgc-critical-opaque:focus-within {
|
|
13777
|
+
background-color: var(--bgc-critical-opaque) !important;
|
|
13778
|
+
}
|
|
13779
|
+
.fv\:d-bgc-critical-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-critical-opaque.focus-visible {
|
|
13780
|
+
background-color: var(--bgc-critical-opaque) !important;
|
|
13781
|
+
}
|
|
13782
|
+
.fv\:d-bgc-critical-opaque:focus-visible {
|
|
13783
|
+
background-color: var(--bgc-critical-opaque) !important;
|
|
13784
|
+
}
|
|
13438
13785
|
.d-bgc-critical-subtle {
|
|
13439
13786
|
background-color: var(--bgc-critical-subtle) !important;
|
|
13440
13787
|
}
|
|
13788
|
+
.h\:d-bgc-critical-subtle:hover {
|
|
13789
|
+
background-color: var(--bgc-critical-subtle) !important;
|
|
13790
|
+
}
|
|
13791
|
+
.f\:d-bgc-critical-subtle:focus {
|
|
13792
|
+
background-color: var(--bgc-critical-subtle) !important;
|
|
13793
|
+
}
|
|
13794
|
+
.f\:d-bgc-critical-subtle:focus-within {
|
|
13795
|
+
background-color: var(--bgc-critical-subtle) !important;
|
|
13796
|
+
}
|
|
13797
|
+
.fv\:d-bgc-critical-subtle.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-critical-subtle.focus-visible {
|
|
13798
|
+
background-color: var(--bgc-critical-subtle) !important;
|
|
13799
|
+
}
|
|
13800
|
+
.fv\:d-bgc-critical-subtle:focus-visible {
|
|
13801
|
+
background-color: var(--bgc-critical-subtle) !important;
|
|
13802
|
+
}
|
|
13803
|
+
.d-bgc-critical-subtle-opaque {
|
|
13804
|
+
background-color: var(--bgc-critical-subtle-opaque) !important;
|
|
13805
|
+
}
|
|
13806
|
+
.h\:d-bgc-critical-subtle-opaque:hover {
|
|
13807
|
+
background-color: var(--bgc-critical-subtle-opaque) !important;
|
|
13808
|
+
}
|
|
13809
|
+
.f\:d-bgc-critical-subtle-opaque:focus {
|
|
13810
|
+
background-color: var(--bgc-critical-subtle-opaque) !important;
|
|
13811
|
+
}
|
|
13812
|
+
.f\:d-bgc-critical-subtle-opaque:focus-within {
|
|
13813
|
+
background-color: var(--bgc-critical-subtle-opaque) !important;
|
|
13814
|
+
}
|
|
13815
|
+
.fv\:d-bgc-critical-subtle-opaque.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-critical-subtle-opaque.focus-visible {
|
|
13816
|
+
background-color: var(--bgc-critical-subtle-opaque) !important;
|
|
13817
|
+
}
|
|
13818
|
+
.fv\:d-bgc-critical-subtle-opaque:focus-visible {
|
|
13819
|
+
background-color: var(--bgc-critical-subtle-opaque) !important;
|
|
13820
|
+
}
|
|
13441
13821
|
.d-bgc-critical-strong {
|
|
13442
13822
|
background-color: var(--bgc-critical-strong) !important;
|
|
13443
13823
|
}
|
|
13824
|
+
.h\:d-bgc-critical-strong:hover {
|
|
13825
|
+
background-color: var(--bgc-critical-strong) !important;
|
|
13826
|
+
}
|
|
13827
|
+
.f\:d-bgc-critical-strong:focus {
|
|
13828
|
+
background-color: var(--bgc-critical-strong) !important;
|
|
13829
|
+
}
|
|
13830
|
+
.f\:d-bgc-critical-strong:focus-within {
|
|
13831
|
+
background-color: var(--bgc-critical-strong) !important;
|
|
13832
|
+
}
|
|
13833
|
+
.fv\:d-bgc-critical-strong.focus-visible.js-focus-visible, .js-focus-visible .fv\:d-bgc-critical-strong.focus-visible {
|
|
13834
|
+
background-color: var(--bgc-critical-strong) !important;
|
|
13835
|
+
}
|
|
13836
|
+
.fv\:d-bgc-critical-strong:focus-visible {
|
|
13837
|
+
background-color: var(--bgc-critical-strong) !important;
|
|
13838
|
+
}
|
|
13444
13839
|
.d-bgc-transparent {
|
|
13445
13840
|
background-color: transparent !important;
|
|
13446
13841
|
background-image: none !important;
|
|
@@ -20998,28 +21393,39 @@ body {
|
|
|
20998
21393
|
--base-color-background: var(--bgc-primary);
|
|
20999
21394
|
--bgc-critical: var(--red-100);
|
|
21000
21395
|
--bgc-critical-hsl: var(--red-100-hsl);
|
|
21396
|
+
--bgc-critical-opaque: hsla(var(--red-300-hsl) / 0.11);
|
|
21001
21397
|
--bgc-critical-subtle: #fff2f3;
|
|
21398
|
+
--bgc-critical-subtle-opaque: hsla(var(--red-300-hsl) / 0.05);
|
|
21002
21399
|
--bgc-critical-strong: var(--red-400);
|
|
21003
21400
|
--bgc-info: var(--blue-100);
|
|
21004
21401
|
--bgc-info-hsl: var(--blue-100-hsl);
|
|
21402
|
+
--bgc-info-opaque: hsla(var(--blue-400-hsl) / 0.09);
|
|
21005
21403
|
--bgc-info-subtle: #f5f9fd;
|
|
21404
|
+
--bgc-info-subtle-opaque: hsla(var(--blue-400-hsl) / 0.04);
|
|
21006
21405
|
--bgc-info-strong: var(--blue-400);
|
|
21007
21406
|
--bgc-warning: var(--gold-100);
|
|
21008
21407
|
--bgc-warning-hsl: var(--gold-100-hsl);
|
|
21408
|
+
--bgc-warning-opaque: hsla(var(--gold-200-hsl) / 0.38);
|
|
21009
21409
|
--bgc-warning-subtle: #fffae5;
|
|
21410
|
+
--bgc-warning-subtle-opaque: hsla(var(--gold-200-hsl) / 0.18);
|
|
21010
21411
|
--bgc-warning-strong: var(--gold-500);
|
|
21011
21412
|
--bgc-success: var(--green-100);
|
|
21012
21413
|
--bgc-success-hsl: var(--green-100-hsl);
|
|
21414
|
+
--bgc-success-opaque: hsla(var(--green-400-hsl) / 0.08);
|
|
21013
21415
|
--bgc-success-subtle: #f8fdf7;
|
|
21416
|
+
--bgc-success-subtle-opaque: hsla(var(--green-400-hsl) / 0.03);
|
|
21014
21417
|
--bgc-success-strong: var(--green-400);
|
|
21015
21418
|
--bgc-primary: var(--white);
|
|
21016
21419
|
--bgc-primary-hsl: var(--white-hsl);
|
|
21017
21420
|
--bgc-secondary: var(--black-100);
|
|
21018
21421
|
--bgc-secondary-hsl: var(--black-100-hsl);
|
|
21422
|
+
--bgc-secondary-opaque: hsla(var(--black-900-hsl) / 0.02);
|
|
21019
21423
|
--bgc-moderate: var(--black-200);
|
|
21020
21424
|
--bgc-moderate-hsl: var(--black-200-hsl);
|
|
21425
|
+
--bgc-moderate-opaque: hsla(var(--black-900-hsl) / 0.09);
|
|
21021
21426
|
--bgc-bold: var(--black-300);
|
|
21022
21427
|
--bgc-bold-hsl: var(--black-300-hsl);
|
|
21428
|
+
--bgc-bold-opaque: hsla(var(--black-900-hsl) / 0.18);
|
|
21023
21429
|
--bgc-strong: var(--black-600);
|
|
21024
21430
|
--bgc-strong-hsl: var(--black-600-hsl);
|
|
21025
21431
|
--bgc-contrast: var(--black-800);
|