@dialpad/dialtone 7.15.0 → 7.15.2
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.
|
@@ -103,12 +103,14 @@
|
|
|
103
103
|
content: '';
|
|
104
104
|
}
|
|
105
105
|
|
|
106
|
-
&:hover {
|
|
107
|
-
--button
|
|
106
|
+
&:hover:not([disabled]) {
|
|
107
|
+
--button-color-background: hsla(var(--black-800-hsl) ~' / ' 15%);
|
|
108
108
|
}
|
|
109
109
|
|
|
110
|
-
&:active
|
|
111
|
-
|
|
110
|
+
&:active:not([disabled]),
|
|
111
|
+
&.d-btn--active:not([disabled]),
|
|
112
|
+
&.d-btn--active:active:not([disabled]) {
|
|
113
|
+
--button-color-background: hsla(var(--black-800-hsl) ~' / ' 25%);
|
|
112
114
|
}
|
|
113
115
|
|
|
114
116
|
.d-btn__icon .d-svg {
|
|
@@ -139,7 +139,6 @@
|
|
|
139
139
|
cursor: pointer;
|
|
140
140
|
}
|
|
141
141
|
|
|
142
|
-
|
|
143
142
|
// ============================================================================
|
|
144
143
|
// $ CHECKBOXES
|
|
145
144
|
// ----------------------------------------------------------------------------
|
|
@@ -207,3 +206,41 @@
|
|
|
207
206
|
}
|
|
208
207
|
}
|
|
209
208
|
}
|
|
209
|
+
|
|
210
|
+
// ============================================================================
|
|
211
|
+
// $ RADIOS
|
|
212
|
+
// ----------------------------------------------------------------------------
|
|
213
|
+
.d-radio {
|
|
214
|
+
@supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
|
|
215
|
+
border-radius: var(--br-circle);
|
|
216
|
+
|
|
217
|
+
// Disabled
|
|
218
|
+
&[disabled],
|
|
219
|
+
&--disabled {
|
|
220
|
+
--check-radio-color: var(--fc-disabled);
|
|
221
|
+
--check-radio-color-border: var(--check-radio-color-border-disabled);
|
|
222
|
+
--check-radio-color-background: var(--check-radio-color-background-disabled);
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
&:focus-visible,
|
|
226
|
+
&:checked:focus-visible {
|
|
227
|
+
box-shadow: var(--bs-focus-ring), inset 0 0 0 var(--size-200) var(--white);
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
&:checked {
|
|
231
|
+
--check-radio-color-background: var(--check-radio-color);
|
|
232
|
+
|
|
233
|
+
box-shadow: inset 0 0 0 var(--size-200) var(--white);
|
|
234
|
+
|
|
235
|
+
// Disabled
|
|
236
|
+
&[disabled] {
|
|
237
|
+
--check-radio-color-background: var(--black-400);
|
|
238
|
+
}
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
&--disabled:checked {
|
|
242
|
+
--check-radio-color-border: var(--check-radio-color-border-disabled);
|
|
243
|
+
--check-radio-color-background: var(--black-400);
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
}
|
|
@@ -1390,11 +1390,13 @@ body {
|
|
|
1390
1390
|
height: 2.8rem;
|
|
1391
1391
|
content: '';
|
|
1392
1392
|
}
|
|
1393
|
-
.d-chip__close:hover {
|
|
1394
|
-
--button
|
|
1393
|
+
.d-chip__close:hover:not([disabled]) {
|
|
1394
|
+
--button-color-background: hsla(var(--black-800-hsl) / 15%);
|
|
1395
1395
|
}
|
|
1396
|
-
.d-chip__close:active
|
|
1397
|
-
|
|
1396
|
+
.d-chip__close:active:not([disabled]),
|
|
1397
|
+
.d-chip__close.d-btn--active:not([disabled]),
|
|
1398
|
+
.d-chip__close.d-btn--active:active:not([disabled]) {
|
|
1399
|
+
--button-color-background: hsla(var(--black-800-hsl) / 25%);
|
|
1398
1400
|
}
|
|
1399
1401
|
.d-chip__close .d-btn__icon .d-svg {
|
|
1400
1402
|
width: 1.8rem;
|
|
@@ -2659,6 +2661,38 @@ body {
|
|
|
2659
2661
|
--check-radio-color-background: var(--check-radio-color-background-disabled);
|
|
2660
2662
|
}
|
|
2661
2663
|
}
|
|
2664
|
+
@supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
|
|
2665
|
+
.d-radio {
|
|
2666
|
+
border-radius: var(--br-circle);
|
|
2667
|
+
}
|
|
2668
|
+
.d-radio[disabled],
|
|
2669
|
+
.d-radio--disabled {
|
|
2670
|
+
--check-radio-color: var(--fc-disabled);
|
|
2671
|
+
--check-radio-color-border: var(--check-radio-color-border-disabled);
|
|
2672
|
+
--check-radio-color-background: var(--check-radio-color-background-disabled);
|
|
2673
|
+
}
|
|
2674
|
+
.d-radio.focus-visible.js-focus-visible,
|
|
2675
|
+
.js-focus-visible .d-radio.focus-visible,
|
|
2676
|
+
.d-radio:checked.focus-visible.js-focus-visible,
|
|
2677
|
+
.js-focus-visible .d-radio:checked.focus-visible {
|
|
2678
|
+
box-shadow: var(--bs-focus-ring), inset 0 0 0 var(--size-200) var(--white);
|
|
2679
|
+
}
|
|
2680
|
+
.d-radio:focus-visible,
|
|
2681
|
+
.d-radio:checked:focus-visible {
|
|
2682
|
+
box-shadow: var(--bs-focus-ring), inset 0 0 0 var(--size-200) var(--white);
|
|
2683
|
+
}
|
|
2684
|
+
.d-radio:checked {
|
|
2685
|
+
--check-radio-color-background: var(--check-radio-color);
|
|
2686
|
+
box-shadow: inset 0 0 0 var(--size-200) var(--white);
|
|
2687
|
+
}
|
|
2688
|
+
.d-radio:checked[disabled] {
|
|
2689
|
+
--check-radio-color-background: var(--black-400);
|
|
2690
|
+
}
|
|
2691
|
+
.d-radio--disabled:checked {
|
|
2692
|
+
--check-radio-color-border: var(--check-radio-color-border-disabled);
|
|
2693
|
+
--check-radio-color-background: var(--black-400);
|
|
2694
|
+
}
|
|
2695
|
+
}
|
|
2662
2696
|
.d-select {
|
|
2663
2697
|
--select-color-border: var(--black-500);
|
|
2664
2698
|
--select-notch-position-right: calc(var(--size-300) * 2);
|