@dialpad/dialtone-css 8.32.0 → 8.33.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.
|
@@ -22,6 +22,7 @@
|
|
|
22
22
|
// --------------------------------------------------------------------------
|
|
23
23
|
--badge-color-text: var(--dt-badge-color-foreground-default);
|
|
24
24
|
--badge-color-background: var(--dt-badge-color-background-default);
|
|
25
|
+
--badge-color-outline: var(--dt-color-border-subtle);
|
|
25
26
|
--badge-radius: var(--dt-size-300);
|
|
26
27
|
--badge-line-height: calc(var(--dt-size-500) + var(--dt-size-200));
|
|
27
28
|
--badge-font-size: var(--dt-font-size-100);
|
|
@@ -82,6 +83,17 @@
|
|
|
82
83
|
&--bulletin {
|
|
83
84
|
--badge-color-text: var(--dt-badge-color-foreground-bulletin);
|
|
84
85
|
--badge-color-background: var(--dt-badge-color-background-bulletin);
|
|
86
|
+
|
|
87
|
+
&.d-badge--subtle {
|
|
88
|
+
--badge-color-text: hsl(var(--primary-color-h) var(--primary-color-s) calc(var(--primary-color-l) - 40%));
|
|
89
|
+
--badge-color-background: hsla(var(--primary-color-hsl) / 0.1);
|
|
90
|
+
--badge-color-outline: hsla(var(--primary-color-hsl) / 0.5);
|
|
91
|
+
|
|
92
|
+
.dialtone-theme-dark & {
|
|
93
|
+
--badge-color-text: var(--dt-color-foreground-primary);
|
|
94
|
+
--badge-color-background: hsla(var(--primary-color-hsl) / 0.6);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
85
97
|
}
|
|
86
98
|
|
|
87
99
|
&--ai {
|
|
@@ -91,6 +103,12 @@
|
|
|
91
103
|
background-image: var(--dt-badge-color-background-ai);
|
|
92
104
|
}
|
|
93
105
|
|
|
106
|
+
&--outlined {
|
|
107
|
+
box-shadow: 0 0 0 var(--dt-size-border-150) var(--badge-color-outline) inset;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
// DECORATIVE
|
|
111
|
+
// --------------------------------------------------------------------------
|
|
94
112
|
&--decorate-black-400 { --badge-decorative-color: var(--dt-color-black-400); }
|
|
95
113
|
&--decorate-black-500 { --badge-decorative-color: var(--dt-color-black-500); }
|
|
96
114
|
&--decorate-black-900 { --badge-decorative-color: var(--dt-color-black-900); }
|
package/lib/dist/dialtone.css
CHANGED
|
@@ -736,6 +736,7 @@ template {
|
|
|
736
736
|
.d-badge {
|
|
737
737
|
--badge-color-text: var(--dt-badge-color-foreground-default);
|
|
738
738
|
--badge-color-background: var(--dt-badge-color-background-default);
|
|
739
|
+
--badge-color-outline: var(--dt-color-border-subtle);
|
|
739
740
|
--badge-radius: var(--dt-size-300);
|
|
740
741
|
--badge-line-height: calc(var(--dt-size-500) + var(--dt-size-200));
|
|
741
742
|
--badge-font-size: var(--dt-font-size-100);
|
|
@@ -785,11 +786,23 @@ template {
|
|
|
785
786
|
--badge-color-text: var(--dt-badge-color-foreground-bulletin);
|
|
786
787
|
--badge-color-background: var(--dt-badge-color-background-bulletin);
|
|
787
788
|
}
|
|
789
|
+
.d-badge--bulletin.d-badge--subtle {
|
|
790
|
+
--badge-color-text: hsl(var(--primary-color-h) var(--primary-color-s) calc(var(--primary-color-l) - 40%));
|
|
791
|
+
--badge-color-background: hsla(var(--primary-color-hsl) / 0.1);
|
|
792
|
+
--badge-color-outline: hsla(var(--primary-color-hsl) / 0.5);
|
|
793
|
+
}
|
|
794
|
+
.dialtone-theme-dark .d-badge--bulletin.d-badge--subtle {
|
|
795
|
+
--badge-color-text: var(--dt-color-foreground-primary);
|
|
796
|
+
--badge-color-background: hsla(var(--primary-color-hsl) / 0.6);
|
|
797
|
+
}
|
|
788
798
|
.d-badge--ai {
|
|
789
799
|
--badge-color-text: var(--dt-badge-color-foreground-bulletin);
|
|
790
800
|
--badge-color-background: var(--dt-color-magenta-300);
|
|
791
801
|
background-image: var(--dt-badge-color-background-ai);
|
|
792
802
|
}
|
|
803
|
+
.d-badge--outlined {
|
|
804
|
+
box-shadow: 0 0 0 var(--dt-size-border-150) var(--badge-color-outline) inset;
|
|
805
|
+
}
|
|
793
806
|
.d-badge--decorate-black-400 {
|
|
794
807
|
--badge-decorative-color: var(--dt-color-black-400);
|
|
795
808
|
}
|
|
@@ -7548,7 +7561,7 @@ body {
|
|
|
7548
7561
|
}
|
|
7549
7562
|
/**
|
|
7550
7563
|
* Do not edit directly
|
|
7551
|
-
* Generated on Thu,
|
|
7564
|
+
* Generated on Thu, 30 May 2024 20:07:37 GMT
|
|
7552
7565
|
*/
|
|
7553
7566
|
|
|
7554
7567
|
.dialtone-theme-light {
|
|
@@ -8365,7 +8378,7 @@ body {
|
|
|
8365
8378
|
|
|
8366
8379
|
/**
|
|
8367
8380
|
* Do not edit directly
|
|
8368
|
-
* Generated on Thu,
|
|
8381
|
+
* Generated on Thu, 30 May 2024 20:07:38 GMT
|
|
8369
8382
|
*/
|
|
8370
8383
|
|
|
8371
8384
|
.dialtone-theme-dark {
|