@i-cell/ids-styles 0.0.27 → 0.0.28
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/dist/components.css +117 -228
- package/dist/components.min.css +1 -1
- package/dist/components.plugin.js +206 -334
- package/dist/segmented-control-toggle/segmented-control-toggle.css +117 -228
- package/dist/segmented-control-toggle/segmented-control-toggle.min.css +1 -1
- package/dist/segmented-control-toggle/segmented-control-toggle.plugin.js +206 -334
- package/package.json +1 -1
- package/dist/segmented-control/segmented-control-toggle.css +0 -452
- package/dist/segmented-control/segmented-control-toggle.min.css +0 -1
- package/dist/segmented-control/segmented-control-toggle.plugin.js +0 -430
package/dist/components.css
CHANGED
|
@@ -9708,426 +9708,315 @@ button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-chi
|
|
|
9708
9708
|
font-weight: var(--ids-comp-segmented-control-toggle-button-icon-typography-font-weight-dense);
|
|
9709
9709
|
line-height: var(--ids-comp-segmented-control-toggle-button-icon-typography-line-height-dense);
|
|
9710
9710
|
}
|
|
9711
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9712
|
-
|
|
9711
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled {
|
|
9712
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-surface-default);
|
|
9713
|
+
}
|
|
9714
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined {
|
|
9715
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-surface-default);
|
|
9716
|
+
}
|
|
9717
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled {
|
|
9718
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-light-default);
|
|
9719
|
+
}
|
|
9720
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined {
|
|
9721
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-light-default);
|
|
9713
9722
|
}
|
|
9714
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9715
|
-
|
|
9723
|
+
.ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus-visible {
|
|
9724
|
+
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
9716
9725
|
}
|
|
9717
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9726
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button {
|
|
9718
9727
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default);
|
|
9719
9728
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default);
|
|
9720
9729
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default);
|
|
9721
9730
|
}
|
|
9722
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9731
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button .ids-icon {
|
|
9723
9732
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default);
|
|
9724
9733
|
}
|
|
9725
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9734
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
9726
9735
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-active);
|
|
9727
9736
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-active);
|
|
9728
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-
|
|
9737
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-active);
|
|
9729
9738
|
}
|
|
9730
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9739
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
9731
9740
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-active);
|
|
9732
9741
|
}
|
|
9733
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9742
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:hover {
|
|
9734
9743
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered);
|
|
9735
9744
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-hovered);
|
|
9736
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-
|
|
9745
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-hovered);
|
|
9737
9746
|
}
|
|
9738
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9747
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:hover .ids-icon {
|
|
9739
9748
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-hovered);
|
|
9740
9749
|
}
|
|
9741
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9750
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:active {
|
|
9742
9751
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed);
|
|
9743
9752
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-pressed);
|
|
9744
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-
|
|
9753
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-pressed);
|
|
9745
9754
|
}
|
|
9746
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9755
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:active .ids-icon {
|
|
9747
9756
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-pressed);
|
|
9748
9757
|
}
|
|
9749
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9758
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:focus-visible {
|
|
9750
9759
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-focused);
|
|
9751
9760
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-focused);
|
|
9752
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-
|
|
9761
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-focused);
|
|
9753
9762
|
}
|
|
9754
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9763
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:focus-visible .ids-icon {
|
|
9755
9764
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-focused);
|
|
9756
9765
|
}
|
|
9757
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9766
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:disabled {
|
|
9758
9767
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled);
|
|
9759
9768
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-disabled);
|
|
9760
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-
|
|
9769
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-disabled);
|
|
9761
9770
|
}
|
|
9762
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9771
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:disabled .ids-icon {
|
|
9763
9772
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-disabled);
|
|
9764
9773
|
}
|
|
9765
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9766
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-primary-default);
|
|
9767
|
-
}
|
|
9768
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button {
|
|
9774
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button {
|
|
9769
9775
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default);
|
|
9770
9776
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default);
|
|
9771
9777
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default);
|
|
9772
9778
|
}
|
|
9773
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9779
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button .ids-icon {
|
|
9774
9780
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default);
|
|
9775
9781
|
}
|
|
9776
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9782
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
9777
9783
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-active);
|
|
9778
9784
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-active);
|
|
9779
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-
|
|
9785
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-active);
|
|
9780
9786
|
}
|
|
9781
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9787
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
9782
9788
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-active);
|
|
9783
9789
|
}
|
|
9784
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9790
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:hover {
|
|
9785
9791
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered);
|
|
9786
9792
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-hovered);
|
|
9787
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-
|
|
9793
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-hovered);
|
|
9788
9794
|
}
|
|
9789
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9795
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:hover .ids-icon {
|
|
9790
9796
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-hovered);
|
|
9791
9797
|
}
|
|
9792
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9798
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:active {
|
|
9793
9799
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed);
|
|
9794
9800
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-pressed);
|
|
9795
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-
|
|
9801
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-pressed);
|
|
9796
9802
|
}
|
|
9797
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9803
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:active .ids-icon {
|
|
9798
9804
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-pressed);
|
|
9799
9805
|
}
|
|
9800
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9806
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:focus-visible {
|
|
9801
9807
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-focused);
|
|
9802
9808
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-focused);
|
|
9803
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-
|
|
9809
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-focused);
|
|
9804
9810
|
}
|
|
9805
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9811
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:focus-visible .ids-icon {
|
|
9806
9812
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-focused);
|
|
9807
9813
|
}
|
|
9808
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9814
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:disabled {
|
|
9809
9815
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled);
|
|
9810
9816
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-disabled);
|
|
9811
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-
|
|
9817
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-disabled);
|
|
9812
9818
|
}
|
|
9813
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9819
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:disabled .ids-icon {
|
|
9814
9820
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-disabled);
|
|
9815
9821
|
}
|
|
9816
|
-
.ids-segmented-control-toggle
|
|
9822
|
+
.ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus-visible {
|
|
9817
9823
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
9818
9824
|
}
|
|
9819
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9820
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-surface-default);
|
|
9821
|
-
}
|
|
9822
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button {
|
|
9825
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button {
|
|
9823
9826
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default);
|
|
9824
9827
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default);
|
|
9825
9828
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default);
|
|
9826
9829
|
}
|
|
9827
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9830
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button .ids-icon {
|
|
9828
9831
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default);
|
|
9829
9832
|
}
|
|
9830
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9833
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
9831
9834
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-active);
|
|
9832
9835
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-active);
|
|
9833
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-
|
|
9836
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-active);
|
|
9834
9837
|
}
|
|
9835
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9838
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
9836
9839
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-active);
|
|
9837
9840
|
}
|
|
9838
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9841
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:hover {
|
|
9839
9842
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered);
|
|
9840
9843
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-hovered);
|
|
9841
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-
|
|
9844
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-hovered);
|
|
9842
9845
|
}
|
|
9843
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9846
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:hover .ids-icon {
|
|
9844
9847
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-hovered);
|
|
9845
9848
|
}
|
|
9846
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9849
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:active {
|
|
9847
9850
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed);
|
|
9848
9851
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-pressed);
|
|
9849
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-
|
|
9852
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-pressed);
|
|
9850
9853
|
}
|
|
9851
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9854
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:active .ids-icon {
|
|
9852
9855
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-pressed);
|
|
9853
9856
|
}
|
|
9854
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9857
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:focus-visible {
|
|
9855
9858
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-focused);
|
|
9856
9859
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-focused);
|
|
9857
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-
|
|
9860
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-focused);
|
|
9858
9861
|
}
|
|
9859
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9862
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:focus-visible .ids-icon {
|
|
9860
9863
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-focused);
|
|
9861
9864
|
}
|
|
9862
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9865
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:disabled {
|
|
9863
9866
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled);
|
|
9864
9867
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-disabled);
|
|
9865
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-
|
|
9868
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-disabled);
|
|
9866
9869
|
}
|
|
9867
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9870
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:disabled .ids-icon {
|
|
9868
9871
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-disabled);
|
|
9869
9872
|
}
|
|
9870
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9871
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-surface-default);
|
|
9872
|
-
}
|
|
9873
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button {
|
|
9873
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button {
|
|
9874
9874
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default);
|
|
9875
9875
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default);
|
|
9876
9876
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default);
|
|
9877
9877
|
}
|
|
9878
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9878
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button .ids-icon {
|
|
9879
9879
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default);
|
|
9880
9880
|
}
|
|
9881
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9881
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
9882
9882
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-active);
|
|
9883
9883
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-active);
|
|
9884
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-
|
|
9884
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-active);
|
|
9885
9885
|
}
|
|
9886
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9886
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
9887
9887
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-active);
|
|
9888
9888
|
}
|
|
9889
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9889
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:hover {
|
|
9890
9890
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered);
|
|
9891
9891
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-hovered);
|
|
9892
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-
|
|
9892
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-hovered);
|
|
9893
9893
|
}
|
|
9894
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9894
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:hover .ids-icon {
|
|
9895
9895
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-hovered);
|
|
9896
9896
|
}
|
|
9897
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9897
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:active {
|
|
9898
9898
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed);
|
|
9899
9899
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-pressed);
|
|
9900
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-
|
|
9900
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-pressed);
|
|
9901
9901
|
}
|
|
9902
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9902
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:active .ids-icon {
|
|
9903
9903
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-pressed);
|
|
9904
9904
|
}
|
|
9905
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9905
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:focus-visible {
|
|
9906
9906
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-focused);
|
|
9907
9907
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-focused);
|
|
9908
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-
|
|
9908
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-focused);
|
|
9909
9909
|
}
|
|
9910
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9910
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:focus-visible .ids-icon {
|
|
9911
9911
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-focused);
|
|
9912
9912
|
}
|
|
9913
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9913
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:disabled {
|
|
9914
9914
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled);
|
|
9915
9915
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-disabled);
|
|
9916
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-
|
|
9916
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-disabled);
|
|
9917
9917
|
}
|
|
9918
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9918
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:disabled .ids-icon {
|
|
9919
9919
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-disabled);
|
|
9920
9920
|
}
|
|
9921
|
-
.ids-segmented-control-toggle
|
|
9921
|
+
.ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus-visible {
|
|
9922
9922
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-light-focused);
|
|
9923
9923
|
}
|
|
9924
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9925
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-light-default);
|
|
9926
|
-
}
|
|
9927
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button {
|
|
9924
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button {
|
|
9928
9925
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default);
|
|
9929
9926
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default);
|
|
9930
9927
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default);
|
|
9931
9928
|
}
|
|
9932
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9929
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button .ids-icon {
|
|
9933
9930
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default);
|
|
9934
9931
|
}
|
|
9935
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9932
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
9936
9933
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-active);
|
|
9937
9934
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-active);
|
|
9938
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-
|
|
9935
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-active);
|
|
9939
9936
|
}
|
|
9940
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9937
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
9941
9938
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-active);
|
|
9942
9939
|
}
|
|
9943
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9940
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:hover {
|
|
9944
9941
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered);
|
|
9945
9942
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-hovered);
|
|
9946
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-
|
|
9943
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-hovered);
|
|
9947
9944
|
}
|
|
9948
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9945
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:hover .ids-icon {
|
|
9949
9946
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered);
|
|
9950
9947
|
}
|
|
9951
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9948
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:active {
|
|
9952
9949
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed);
|
|
9953
9950
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-pressed);
|
|
9954
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-
|
|
9951
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-pressed);
|
|
9955
9952
|
}
|
|
9956
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9953
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:active .ids-icon {
|
|
9957
9954
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-pressed);
|
|
9958
9955
|
}
|
|
9959
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9956
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:focus-visible {
|
|
9960
9957
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-focused);
|
|
9961
9958
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-focused);
|
|
9962
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-
|
|
9959
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-focused);
|
|
9963
9960
|
}
|
|
9964
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9961
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:focus-visible .ids-icon {
|
|
9965
9962
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-focused);
|
|
9966
9963
|
}
|
|
9967
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9964
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:disabled {
|
|
9968
9965
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled);
|
|
9969
9966
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-disabled);
|
|
9970
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-
|
|
9967
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-disabled);
|
|
9971
9968
|
}
|
|
9972
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9969
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:disabled .ids-icon {
|
|
9973
9970
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-disabled);
|
|
9974
9971
|
}
|
|
9975
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9976
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-light-default);
|
|
9977
|
-
}
|
|
9978
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button {
|
|
9972
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button {
|
|
9979
9973
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default);
|
|
9980
9974
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default);
|
|
9981
9975
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default);
|
|
9982
9976
|
}
|
|
9983
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9977
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button .ids-icon {
|
|
9984
9978
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default);
|
|
9985
9979
|
}
|
|
9986
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9980
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
9987
9981
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-active);
|
|
9988
9982
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-active);
|
|
9989
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-
|
|
9983
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-active);
|
|
9990
9984
|
}
|
|
9991
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9985
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
9992
9986
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-active);
|
|
9993
9987
|
}
|
|
9994
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9988
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:hover {
|
|
9995
9989
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered);
|
|
9996
9990
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-hovered);
|
|
9997
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-
|
|
9991
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-hovered);
|
|
9998
9992
|
}
|
|
9999
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9993
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:hover .ids-icon {
|
|
10000
9994
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-hovered);
|
|
10001
9995
|
}
|
|
10002
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9996
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:active {
|
|
10003
9997
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed);
|
|
10004
9998
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-pressed);
|
|
10005
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-
|
|
9999
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-pressed);
|
|
10006
10000
|
}
|
|
10007
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10001
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:active .ids-icon {
|
|
10008
10002
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-pressed);
|
|
10009
10003
|
}
|
|
10010
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10004
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:focus-visible {
|
|
10011
10005
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-focused);
|
|
10012
10006
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-focused);
|
|
10013
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-
|
|
10007
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-focused);
|
|
10014
10008
|
}
|
|
10015
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10009
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:focus-visible .ids-icon {
|
|
10016
10010
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-focused);
|
|
10017
10011
|
}
|
|
10018
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10012
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:disabled {
|
|
10019
10013
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled);
|
|
10020
10014
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-disabled);
|
|
10021
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-
|
|
10015
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-disabled);
|
|
10022
10016
|
}
|
|
10023
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10017
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:disabled .ids-icon {
|
|
10024
10018
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-disabled);
|
|
10025
10019
|
}
|
|
10026
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-dark .ids-segmented-control-toggle-item > button:focus-visible {
|
|
10027
|
-
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
10028
|
-
}
|
|
10029
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled {
|
|
10030
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-dark-default);
|
|
10031
|
-
}
|
|
10032
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button {
|
|
10033
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-default);
|
|
10034
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-default);
|
|
10035
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default);
|
|
10036
|
-
}
|
|
10037
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button .ids-icon {
|
|
10038
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-default);
|
|
10039
|
-
}
|
|
10040
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
10041
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-active);
|
|
10042
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-active);
|
|
10043
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default);
|
|
10044
|
-
}
|
|
10045
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
10046
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-active);
|
|
10047
|
-
}
|
|
10048
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:hover {
|
|
10049
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-hovered);
|
|
10050
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-hovered);
|
|
10051
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default);
|
|
10052
|
-
}
|
|
10053
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:hover .ids-icon {
|
|
10054
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-hovered);
|
|
10055
|
-
}
|
|
10056
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:active {
|
|
10057
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-pressed);
|
|
10058
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-pressed);
|
|
10059
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default);
|
|
10060
|
-
}
|
|
10061
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:active .ids-icon {
|
|
10062
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-pressed);
|
|
10063
|
-
}
|
|
10064
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:focus-visible {
|
|
10065
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-focused);
|
|
10066
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-focused);
|
|
10067
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default);
|
|
10068
|
-
}
|
|
10069
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:focus-visible .ids-icon {
|
|
10070
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-focused);
|
|
10071
|
-
}
|
|
10072
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:disabled {
|
|
10073
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-disabled);
|
|
10074
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-disabled);
|
|
10075
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default);
|
|
10076
|
-
}
|
|
10077
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item > button:disabled .ids-icon {
|
|
10078
|
-
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-disabled);
|
|
10079
|
-
}
|
|
10080
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined {
|
|
10081
|
-
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-dark-default);
|
|
10082
|
-
}
|
|
10083
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button {
|
|
10084
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-default);
|
|
10085
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-default);
|
|
10086
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default);
|
|
10087
|
-
}
|
|
10088
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button .ids-icon {
|
|
10089
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-default);
|
|
10090
|
-
}
|
|
10091
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
10092
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-active);
|
|
10093
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-active);
|
|
10094
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default);
|
|
10095
|
-
}
|
|
10096
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon {
|
|
10097
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-active);
|
|
10098
|
-
}
|
|
10099
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:hover {
|
|
10100
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-hovered);
|
|
10101
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-hovered);
|
|
10102
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default);
|
|
10103
|
-
}
|
|
10104
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:hover .ids-icon {
|
|
10105
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-hovered);
|
|
10106
|
-
}
|
|
10107
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:active {
|
|
10108
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-pressed);
|
|
10109
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-pressed);
|
|
10110
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default);
|
|
10111
|
-
}
|
|
10112
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:active .ids-icon {
|
|
10113
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-pressed);
|
|
10114
|
-
}
|
|
10115
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:focus-visible {
|
|
10116
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-focused);
|
|
10117
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-focused);
|
|
10118
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default);
|
|
10119
|
-
}
|
|
10120
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:focus .ids-icon, .ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:focus-visible .ids-icon {
|
|
10121
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-focused);
|
|
10122
|
-
}
|
|
10123
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:disabled {
|
|
10124
|
-
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-disabled);
|
|
10125
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-disabled);
|
|
10126
|
-
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default);
|
|
10127
|
-
}
|
|
10128
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item > button:disabled .ids-icon {
|
|
10129
|
-
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-disabled);
|
|
10130
|
-
}
|
|
10131
10020
|
|
|
10132
10021
|
.ids-select {
|
|
10133
10022
|
width: 100%;
|