@i-cell/ids-styles 0.0.27 → 0.0.29
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/accordion/accordion.css +1 -0
- package/dist/accordion/accordion.min.css +1 -1
- package/dist/accordion/accordion.plugin.js +1 -0
- package/dist/components.css +118 -228
- package/dist/components.min.css +1 -1
- package/dist/components.plugin.js +207 -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
|
@@ -23,6 +23,7 @@
|
|
|
23
23
|
width: 100%;
|
|
24
24
|
flex: 1 0 0;
|
|
25
25
|
border-style: solid;
|
|
26
|
+
cursor: pointer;
|
|
26
27
|
}
|
|
27
28
|
.ids-accordion > .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion > .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
|
|
28
29
|
outline-offset: 2px;
|
|
@@ -9708,426 +9709,315 @@ button.ids-chip.ids-chip-outlined.ids-chip-dark:not(:disabled):active > .ids-chi
|
|
|
9708
9709
|
font-weight: var(--ids-comp-segmented-control-toggle-button-icon-typography-font-weight-dense);
|
|
9709
9710
|
line-height: var(--ids-comp-segmented-control-toggle-button-icon-typography-line-height-dense);
|
|
9710
9711
|
}
|
|
9711
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9712
|
-
|
|
9712
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled {
|
|
9713
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-surface-default);
|
|
9714
|
+
}
|
|
9715
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined {
|
|
9716
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-surface-default);
|
|
9717
|
+
}
|
|
9718
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled {
|
|
9719
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-filled-color-bg-light-default);
|
|
9720
|
+
}
|
|
9721
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined {
|
|
9722
|
+
background-color: var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-light-default);
|
|
9713
9723
|
}
|
|
9714
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9715
|
-
|
|
9724
|
+
.ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus-visible {
|
|
9725
|
+
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
9716
9726
|
}
|
|
9717
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9727
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button {
|
|
9718
9728
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default);
|
|
9719
9729
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default);
|
|
9720
9730
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default);
|
|
9721
9731
|
}
|
|
9722
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9732
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button .ids-icon {
|
|
9723
9733
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default);
|
|
9724
9734
|
}
|
|
9725
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9735
|
+
.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
9736
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-active);
|
|
9727
9737
|
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-
|
|
9738
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-active);
|
|
9729
9739
|
}
|
|
9730
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9740
|
+
.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
9741
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-active);
|
|
9732
9742
|
}
|
|
9733
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9743
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:hover {
|
|
9734
9744
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered);
|
|
9735
9745
|
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-
|
|
9746
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-hovered);
|
|
9737
9747
|
}
|
|
9738
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9748
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:hover .ids-icon {
|
|
9739
9749
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-hovered);
|
|
9740
9750
|
}
|
|
9741
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9751
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:active {
|
|
9742
9752
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed);
|
|
9743
9753
|
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-
|
|
9754
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-pressed);
|
|
9745
9755
|
}
|
|
9746
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9756
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:active .ids-icon {
|
|
9747
9757
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-pressed);
|
|
9748
9758
|
}
|
|
9749
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9759
|
+
.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
9760
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-focused);
|
|
9751
9761
|
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-
|
|
9762
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-focused);
|
|
9753
9763
|
}
|
|
9754
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9764
|
+
.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
9765
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-focused);
|
|
9756
9766
|
}
|
|
9757
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9767
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:disabled {
|
|
9758
9768
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled);
|
|
9759
9769
|
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-
|
|
9770
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-disabled);
|
|
9761
9771
|
}
|
|
9762
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9772
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:disabled .ids-icon {
|
|
9763
9773
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-disabled);
|
|
9764
9774
|
}
|
|
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 {
|
|
9775
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button {
|
|
9769
9776
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default);
|
|
9770
9777
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default);
|
|
9771
9778
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default);
|
|
9772
9779
|
}
|
|
9773
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9780
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button .ids-icon {
|
|
9774
9781
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default);
|
|
9775
9782
|
}
|
|
9776
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9783
|
+
.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
9784
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-active);
|
|
9778
9785
|
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-
|
|
9786
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-active);
|
|
9780
9787
|
}
|
|
9781
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9788
|
+
.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
9789
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-active);
|
|
9783
9790
|
}
|
|
9784
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9791
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:hover {
|
|
9785
9792
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered);
|
|
9786
9793
|
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-
|
|
9794
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-hovered);
|
|
9788
9795
|
}
|
|
9789
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9796
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:hover .ids-icon {
|
|
9790
9797
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-hovered);
|
|
9791
9798
|
}
|
|
9792
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9799
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:active {
|
|
9793
9800
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed);
|
|
9794
9801
|
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-
|
|
9802
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-pressed);
|
|
9796
9803
|
}
|
|
9797
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9804
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:active .ids-icon {
|
|
9798
9805
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-pressed);
|
|
9799
9806
|
}
|
|
9800
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9807
|
+
.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
9808
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-focused);
|
|
9802
9809
|
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-
|
|
9810
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-focused);
|
|
9804
9811
|
}
|
|
9805
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9812
|
+
.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
9813
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-focused);
|
|
9807
9814
|
}
|
|
9808
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9815
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:disabled {
|
|
9809
9816
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled);
|
|
9810
9817
|
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-
|
|
9818
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-disabled);
|
|
9812
9819
|
}
|
|
9813
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9820
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:disabled .ids-icon {
|
|
9814
9821
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-disabled);
|
|
9815
9822
|
}
|
|
9816
|
-
.ids-segmented-control-toggle
|
|
9823
|
+
.ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus-visible {
|
|
9817
9824
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
9818
9825
|
}
|
|
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 {
|
|
9826
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button {
|
|
9823
9827
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default);
|
|
9824
9828
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default);
|
|
9825
9829
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default);
|
|
9826
9830
|
}
|
|
9827
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9831
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button .ids-icon {
|
|
9828
9832
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default);
|
|
9829
9833
|
}
|
|
9830
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9834
|
+
.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
9835
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-active);
|
|
9832
9836
|
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-
|
|
9837
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-active);
|
|
9834
9838
|
}
|
|
9835
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9839
|
+
.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
9840
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-active);
|
|
9837
9841
|
}
|
|
9838
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9842
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:hover {
|
|
9839
9843
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered);
|
|
9840
9844
|
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-
|
|
9845
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-hovered);
|
|
9842
9846
|
}
|
|
9843
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9847
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:hover .ids-icon {
|
|
9844
9848
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-hovered);
|
|
9845
9849
|
}
|
|
9846
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9850
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:active {
|
|
9847
9851
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed);
|
|
9848
9852
|
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-
|
|
9853
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-pressed);
|
|
9850
9854
|
}
|
|
9851
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9855
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:active .ids-icon {
|
|
9852
9856
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-pressed);
|
|
9853
9857
|
}
|
|
9854
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9858
|
+
.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
9859
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-focused);
|
|
9856
9860
|
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-
|
|
9861
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-focused);
|
|
9858
9862
|
}
|
|
9859
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9863
|
+
.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
9864
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-focused);
|
|
9861
9865
|
}
|
|
9862
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9866
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:disabled {
|
|
9863
9867
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled);
|
|
9864
9868
|
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-
|
|
9869
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-disabled);
|
|
9866
9870
|
}
|
|
9867
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9871
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:disabled .ids-icon {
|
|
9868
9872
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-disabled);
|
|
9869
9873
|
}
|
|
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 {
|
|
9874
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button {
|
|
9874
9875
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default);
|
|
9875
9876
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default);
|
|
9876
9877
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default);
|
|
9877
9878
|
}
|
|
9878
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9879
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button .ids-icon {
|
|
9879
9880
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default);
|
|
9880
9881
|
}
|
|
9881
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9882
|
+
.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
9883
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-active);
|
|
9883
9884
|
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-
|
|
9885
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-active);
|
|
9885
9886
|
}
|
|
9886
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9887
|
+
.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
9888
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-active);
|
|
9888
9889
|
}
|
|
9889
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9890
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:hover {
|
|
9890
9891
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered);
|
|
9891
9892
|
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-
|
|
9893
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-hovered);
|
|
9893
9894
|
}
|
|
9894
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9895
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:hover .ids-icon {
|
|
9895
9896
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-hovered);
|
|
9896
9897
|
}
|
|
9897
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9898
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:active {
|
|
9898
9899
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed);
|
|
9899
9900
|
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-
|
|
9901
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-pressed);
|
|
9901
9902
|
}
|
|
9902
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9903
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:active .ids-icon {
|
|
9903
9904
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-pressed);
|
|
9904
9905
|
}
|
|
9905
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9906
|
+
.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
9907
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-focused);
|
|
9907
9908
|
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-
|
|
9909
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-focused);
|
|
9909
9910
|
}
|
|
9910
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9911
|
+
.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
9912
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-focused);
|
|
9912
9913
|
}
|
|
9913
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9914
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:disabled {
|
|
9914
9915
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled);
|
|
9915
9916
|
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-
|
|
9917
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-disabled);
|
|
9917
9918
|
}
|
|
9918
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9919
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:disabled .ids-icon {
|
|
9919
9920
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-disabled);
|
|
9920
9921
|
}
|
|
9921
|
-
.ids-segmented-control-toggle
|
|
9922
|
+
.ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle .ids-segmented-control-toggle-item > button:focus-visible {
|
|
9922
9923
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-light-focused);
|
|
9923
9924
|
}
|
|
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 {
|
|
9925
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button {
|
|
9928
9926
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default);
|
|
9929
9927
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default);
|
|
9930
9928
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default);
|
|
9931
9929
|
}
|
|
9932
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9930
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button .ids-icon {
|
|
9933
9931
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default);
|
|
9934
9932
|
}
|
|
9935
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9933
|
+
.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
9934
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-active);
|
|
9937
9935
|
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-
|
|
9936
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-active);
|
|
9939
9937
|
}
|
|
9940
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9938
|
+
.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
9939
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-active);
|
|
9942
9940
|
}
|
|
9943
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9941
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:hover {
|
|
9944
9942
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered);
|
|
9945
9943
|
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-
|
|
9944
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-hovered);
|
|
9947
9945
|
}
|
|
9948
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9946
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:hover .ids-icon {
|
|
9949
9947
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered);
|
|
9950
9948
|
}
|
|
9951
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9949
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:active {
|
|
9952
9950
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed);
|
|
9953
9951
|
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-
|
|
9952
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-pressed);
|
|
9955
9953
|
}
|
|
9956
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9954
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:active .ids-icon {
|
|
9957
9955
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-pressed);
|
|
9958
9956
|
}
|
|
9959
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9957
|
+
.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
9958
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-focused);
|
|
9961
9959
|
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-
|
|
9960
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-focused);
|
|
9963
9961
|
}
|
|
9964
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9962
|
+
.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
9963
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-focused);
|
|
9966
9964
|
}
|
|
9967
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9965
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:disabled {
|
|
9968
9966
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled);
|
|
9969
9967
|
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-
|
|
9968
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-disabled);
|
|
9971
9969
|
}
|
|
9972
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9970
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:disabled .ids-icon {
|
|
9973
9971
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-disabled);
|
|
9974
9972
|
}
|
|
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 {
|
|
9973
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button {
|
|
9979
9974
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default);
|
|
9980
9975
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default);
|
|
9981
9976
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default);
|
|
9982
9977
|
}
|
|
9983
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9978
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button .ids-icon {
|
|
9984
9979
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default);
|
|
9985
9980
|
}
|
|
9986
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9981
|
+
.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
9982
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-active);
|
|
9988
9983
|
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-
|
|
9984
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-active);
|
|
9990
9985
|
}
|
|
9991
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9986
|
+
.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
9987
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-active);
|
|
9993
9988
|
}
|
|
9994
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9989
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:hover {
|
|
9995
9990
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered);
|
|
9996
9991
|
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-
|
|
9992
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-hovered);
|
|
9998
9993
|
}
|
|
9999
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9994
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:hover .ids-icon {
|
|
10000
9995
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-hovered);
|
|
10001
9996
|
}
|
|
10002
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
9997
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:active {
|
|
10003
9998
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed);
|
|
10004
9999
|
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-
|
|
10000
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-pressed);
|
|
10006
10001
|
}
|
|
10007
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10002
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:active .ids-icon {
|
|
10008
10003
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-pressed);
|
|
10009
10004
|
}
|
|
10010
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10005
|
+
.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
10006
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-focused);
|
|
10012
10007
|
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-
|
|
10008
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-focused);
|
|
10014
10009
|
}
|
|
10015
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10010
|
+
.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
10011
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-focused);
|
|
10017
10012
|
}
|
|
10018
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10013
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:disabled {
|
|
10019
10014
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled);
|
|
10020
10015
|
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-
|
|
10016
|
+
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-disabled);
|
|
10022
10017
|
}
|
|
10023
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
10018
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:disabled .ids-icon {
|
|
10024
10019
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-disabled);
|
|
10025
10020
|
}
|
|
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
10021
|
|
|
10132
10022
|
.ids-select {
|
|
10133
10023
|
width: 100%;
|