@i-cell/ids-styles 0.0.59 → 0.0.61
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 +428 -75
- package/dist/components.min.css +1 -1
- package/dist/components.plugin.js +202 -202
- package/dist/menu-item/menu-item.css +356 -0
- package/dist/menu-item/menu-item.min.css +1 -1
- package/dist/menu-item/menu-item.plugin.js +20 -0
- package/dist/overlay-panel/overlay-panel.css +0 -3
- package/dist/overlay-panel/overlay-panel.min.css +1 -1
- package/dist/overlay-panel/overlay-panel.plugin.js +0 -3
- package/dist/segmented-control-toggle/segmented-control-toggle.css +72 -72
- package/dist/segmented-control-toggle/segmented-control-toggle.min.css +1 -1
- package/dist/segmented-control-toggle/segmented-control-toggle.plugin.js +182 -199
- package/package.json +1 -1
package/dist/components.css
CHANGED
|
@@ -8524,9 +8524,98 @@ a.ids-menu-item:link, a.ids-menu-item:visited {
|
|
|
8524
8524
|
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus-visible {
|
|
8525
8525
|
color: var(--ids-comp-menu-item-text-color-fg-label-surface-focused);
|
|
8526
8526
|
background: var(--ids-comp-menu-item-text-color-bg-surface-focused);
|
|
8527
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8528
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-compact);
|
|
8529
|
+
outline-offset: 2px;
|
|
8530
|
+
outline-style: solid;
|
|
8531
|
+
}
|
|
8532
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:active {
|
|
8533
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-pressed);
|
|
8534
|
+
outline-style: none;
|
|
8535
|
+
}
|
|
8536
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8537
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-disabled);
|
|
8538
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-disabled);
|
|
8539
|
+
}
|
|
8540
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface {
|
|
8541
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-default);
|
|
8542
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-default);
|
|
8543
|
+
}
|
|
8544
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface.ids-menu-item-active {
|
|
8545
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-active);
|
|
8546
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-active);
|
|
8547
|
+
}
|
|
8548
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:hover {
|
|
8549
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-hovered);
|
|
8550
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-hovered);
|
|
8551
|
+
}
|
|
8552
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus-visible {
|
|
8553
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-focused);
|
|
8554
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-focused);
|
|
8555
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8556
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-comfortable);
|
|
8557
|
+
outline-offset: 2px;
|
|
8558
|
+
outline-style: solid;
|
|
8559
|
+
}
|
|
8560
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:active {
|
|
8561
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-pressed);
|
|
8562
|
+
outline-style: none;
|
|
8563
|
+
}
|
|
8564
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8565
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-disabled);
|
|
8566
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-disabled);
|
|
8567
|
+
}
|
|
8568
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface {
|
|
8569
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-default);
|
|
8570
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-default);
|
|
8571
|
+
}
|
|
8572
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface.ids-menu-item-active {
|
|
8573
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-active);
|
|
8574
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-active);
|
|
8575
|
+
}
|
|
8576
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:hover {
|
|
8577
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-hovered);
|
|
8578
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-hovered);
|
|
8579
|
+
}
|
|
8580
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus-visible {
|
|
8581
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-focused);
|
|
8582
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-focused);
|
|
8583
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8584
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-spacious);
|
|
8585
|
+
outline-offset: 2px;
|
|
8586
|
+
outline-style: solid;
|
|
8527
8587
|
}
|
|
8528
8588
|
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:active {
|
|
8529
8589
|
background: var(--ids-comp-menu-item-text-color-bg-surface-pressed);
|
|
8590
|
+
outline-style: none;
|
|
8591
|
+
}
|
|
8592
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8593
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-disabled);
|
|
8594
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-disabled);
|
|
8595
|
+
}
|
|
8596
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface {
|
|
8597
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-default);
|
|
8598
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-default);
|
|
8599
|
+
}
|
|
8600
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface.ids-menu-item-active {
|
|
8601
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-active);
|
|
8602
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-active);
|
|
8603
|
+
}
|
|
8604
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:hover {
|
|
8605
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-hovered);
|
|
8606
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-hovered);
|
|
8607
|
+
}
|
|
8608
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-surface:focus-visible {
|
|
8609
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-surface-focused);
|
|
8610
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-focused);
|
|
8611
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8612
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-dense);
|
|
8613
|
+
outline-offset: 2px;
|
|
8614
|
+
outline-style: solid;
|
|
8615
|
+
}
|
|
8616
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:active {
|
|
8617
|
+
background: var(--ids-comp-menu-item-text-color-bg-surface-pressed);
|
|
8618
|
+
outline-style: none;
|
|
8530
8619
|
}
|
|
8531
8620
|
.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8532
8621
|
color: var(--ids-comp-menu-item-text-color-fg-label-surface-disabled);
|
|
@@ -8547,9 +8636,98 @@ a.ids-menu-item:link, a.ids-menu-item:visited {
|
|
|
8547
8636
|
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus-visible {
|
|
8548
8637
|
color: var(--ids-comp-menu-item-text-color-fg-label-light-focused);
|
|
8549
8638
|
background: var(--ids-comp-menu-item-text-color-bg-light-focused);
|
|
8639
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8640
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-compact);
|
|
8641
|
+
outline-offset: 2px;
|
|
8642
|
+
outline-style: solid;
|
|
8550
8643
|
}
|
|
8551
8644
|
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:active {
|
|
8552
8645
|
background: var(--ids-comp-menu-item-text-color-bg-light-pressed);
|
|
8646
|
+
outline-style: none;
|
|
8647
|
+
}
|
|
8648
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8649
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-disabled);
|
|
8650
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-disabled);
|
|
8651
|
+
}
|
|
8652
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light {
|
|
8653
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-default);
|
|
8654
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-default);
|
|
8655
|
+
}
|
|
8656
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light.ids-menu-item-active {
|
|
8657
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-active);
|
|
8658
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-active);
|
|
8659
|
+
}
|
|
8660
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:hover {
|
|
8661
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-hovered);
|
|
8662
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-hovered);
|
|
8663
|
+
}
|
|
8664
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus-visible {
|
|
8665
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-focused);
|
|
8666
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-focused);
|
|
8667
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8668
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-comfortable);
|
|
8669
|
+
outline-offset: 2px;
|
|
8670
|
+
outline-style: solid;
|
|
8671
|
+
}
|
|
8672
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:active {
|
|
8673
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-pressed);
|
|
8674
|
+
outline-style: none;
|
|
8675
|
+
}
|
|
8676
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8677
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-disabled);
|
|
8678
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-disabled);
|
|
8679
|
+
}
|
|
8680
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light {
|
|
8681
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-default);
|
|
8682
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-default);
|
|
8683
|
+
}
|
|
8684
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light.ids-menu-item-active {
|
|
8685
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-active);
|
|
8686
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-active);
|
|
8687
|
+
}
|
|
8688
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:hover {
|
|
8689
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-hovered);
|
|
8690
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-hovered);
|
|
8691
|
+
}
|
|
8692
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus-visible {
|
|
8693
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-focused);
|
|
8694
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-focused);
|
|
8695
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8696
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-spacious);
|
|
8697
|
+
outline-offset: 2px;
|
|
8698
|
+
outline-style: solid;
|
|
8699
|
+
}
|
|
8700
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:active {
|
|
8701
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-pressed);
|
|
8702
|
+
outline-style: none;
|
|
8703
|
+
}
|
|
8704
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8705
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-disabled);
|
|
8706
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-disabled);
|
|
8707
|
+
}
|
|
8708
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light {
|
|
8709
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-default);
|
|
8710
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-default);
|
|
8711
|
+
}
|
|
8712
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light.ids-menu-item-active {
|
|
8713
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-active);
|
|
8714
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-active);
|
|
8715
|
+
}
|
|
8716
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:hover {
|
|
8717
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-hovered);
|
|
8718
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-hovered);
|
|
8719
|
+
}
|
|
8720
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus-visible {
|
|
8721
|
+
color: var(--ids-comp-menu-item-text-color-fg-label-light-focused);
|
|
8722
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-focused);
|
|
8723
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8724
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-dense);
|
|
8725
|
+
outline-offset: 2px;
|
|
8726
|
+
outline-style: solid;
|
|
8727
|
+
}
|
|
8728
|
+
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:active {
|
|
8729
|
+
background: var(--ids-comp-menu-item-text-color-bg-light-pressed);
|
|
8730
|
+
outline-style: none;
|
|
8553
8731
|
}
|
|
8554
8732
|
.ids-menu-item.ids-menu-item-text.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8555
8733
|
color: var(--ids-comp-menu-item-text-color-fg-label-light-disabled);
|
|
@@ -8570,14 +8748,131 @@ a.ids-menu-item:link, a.ids-menu-item:visited {
|
|
|
8570
8748
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus-visible {
|
|
8571
8749
|
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-focused);
|
|
8572
8750
|
background: var(--ids-comp-menu-item-filled-color-bg-surface-focused);
|
|
8751
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8752
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-compact);
|
|
8753
|
+
outline-offset: 2px;
|
|
8754
|
+
outline-style: solid;
|
|
8573
8755
|
}
|
|
8574
8756
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:active {
|
|
8575
8757
|
background: var(--ids-comp-menu-item-filled-color-bg-surface-pressed);
|
|
8758
|
+
outline-style: none;
|
|
8576
8759
|
}
|
|
8577
8760
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8578
8761
|
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-disabled);
|
|
8579
8762
|
background: var(--ids-comp-menu-item-filled-color-bg-surface-disabled);
|
|
8580
8763
|
}
|
|
8764
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface {
|
|
8765
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-default);
|
|
8766
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-default);
|
|
8767
|
+
}
|
|
8768
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface.ids-menu-item-active {
|
|
8769
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-active);
|
|
8770
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-active);
|
|
8771
|
+
}
|
|
8772
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:hover {
|
|
8773
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-hovered);
|
|
8774
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-hovered);
|
|
8775
|
+
}
|
|
8776
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus-visible {
|
|
8777
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-focused);
|
|
8778
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-focused);
|
|
8779
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8780
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-comfortable);
|
|
8781
|
+
outline-offset: 2px;
|
|
8782
|
+
outline-style: solid;
|
|
8783
|
+
}
|
|
8784
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:active {
|
|
8785
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-pressed);
|
|
8786
|
+
outline-style: none;
|
|
8787
|
+
}
|
|
8788
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8789
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-disabled);
|
|
8790
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-disabled);
|
|
8791
|
+
}
|
|
8792
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface {
|
|
8793
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-default);
|
|
8794
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-default);
|
|
8795
|
+
}
|
|
8796
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface.ids-menu-item-active {
|
|
8797
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-active);
|
|
8798
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-active);
|
|
8799
|
+
}
|
|
8800
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:hover {
|
|
8801
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-hovered);
|
|
8802
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-hovered);
|
|
8803
|
+
}
|
|
8804
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus-visible {
|
|
8805
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-focused);
|
|
8806
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-focused);
|
|
8807
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8808
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-spacious);
|
|
8809
|
+
outline-offset: 2px;
|
|
8810
|
+
outline-style: solid;
|
|
8811
|
+
}
|
|
8812
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:active {
|
|
8813
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-pressed);
|
|
8814
|
+
outline-style: none;
|
|
8815
|
+
}
|
|
8816
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8817
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-disabled);
|
|
8818
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-disabled);
|
|
8819
|
+
}
|
|
8820
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface {
|
|
8821
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-default);
|
|
8822
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-default);
|
|
8823
|
+
}
|
|
8824
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface.ids-menu-item-active {
|
|
8825
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-active);
|
|
8826
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-active);
|
|
8827
|
+
}
|
|
8828
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:hover {
|
|
8829
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-hovered);
|
|
8830
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-hovered);
|
|
8831
|
+
}
|
|
8832
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:focus-visible {
|
|
8833
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-focused);
|
|
8834
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-focused);
|
|
8835
|
+
outline-color: var(--ids-comp-button-focused-outline-color-dark-focused);
|
|
8836
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-dense);
|
|
8837
|
+
outline-offset: 2px;
|
|
8838
|
+
outline-style: solid;
|
|
8839
|
+
}
|
|
8840
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:active {
|
|
8841
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-pressed);
|
|
8842
|
+
outline-style: none;
|
|
8843
|
+
}
|
|
8844
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:is(:disabled, .ids-menu-item-disabled) {
|
|
8845
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-surface-disabled);
|
|
8846
|
+
background: var(--ids-comp-menu-item-filled-color-bg-surface-disabled);
|
|
8847
|
+
}
|
|
8848
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light {
|
|
8849
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-default);
|
|
8850
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-default);
|
|
8851
|
+
}
|
|
8852
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light.ids-menu-item-active {
|
|
8853
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-active);
|
|
8854
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-active);
|
|
8855
|
+
}
|
|
8856
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:hover {
|
|
8857
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-hovered);
|
|
8858
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-hovered);
|
|
8859
|
+
}
|
|
8860
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus-visible {
|
|
8861
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-focused);
|
|
8862
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-focused);
|
|
8863
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8864
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-compact);
|
|
8865
|
+
outline-offset: 2px;
|
|
8866
|
+
outline-style: solid;
|
|
8867
|
+
}
|
|
8868
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:active {
|
|
8869
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-pressed);
|
|
8870
|
+
outline-style: none;
|
|
8871
|
+
}
|
|
8872
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8873
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-disabled);
|
|
8874
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-disabled);
|
|
8875
|
+
}
|
|
8581
8876
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light {
|
|
8582
8877
|
color: var(--ids-comp-menu-item-filled-color-fg-label-light-default);
|
|
8583
8878
|
background: var(--ids-comp-menu-item-filled-color-bg-light-default);
|
|
@@ -8593,9 +8888,70 @@ a.ids-menu-item:link, a.ids-menu-item:visited {
|
|
|
8593
8888
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus-visible {
|
|
8594
8889
|
color: var(--ids-comp-menu-item-filled-color-fg-label-light-focused);
|
|
8595
8890
|
background: var(--ids-comp-menu-item-filled-color-bg-light-focused);
|
|
8891
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8892
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-comfortable);
|
|
8893
|
+
outline-offset: 2px;
|
|
8894
|
+
outline-style: solid;
|
|
8596
8895
|
}
|
|
8597
8896
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:active {
|
|
8598
8897
|
background: var(--ids-comp-menu-item-filled-color-bg-light-pressed);
|
|
8898
|
+
outline-style: none;
|
|
8899
|
+
}
|
|
8900
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8901
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-disabled);
|
|
8902
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-disabled);
|
|
8903
|
+
}
|
|
8904
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light {
|
|
8905
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-default);
|
|
8906
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-default);
|
|
8907
|
+
}
|
|
8908
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light.ids-menu-item-active {
|
|
8909
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-active);
|
|
8910
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-active);
|
|
8911
|
+
}
|
|
8912
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:hover {
|
|
8913
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-hovered);
|
|
8914
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-hovered);
|
|
8915
|
+
}
|
|
8916
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus-visible {
|
|
8917
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-focused);
|
|
8918
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-focused);
|
|
8919
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8920
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-spacious);
|
|
8921
|
+
outline-offset: 2px;
|
|
8922
|
+
outline-style: solid;
|
|
8923
|
+
}
|
|
8924
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:active {
|
|
8925
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-pressed);
|
|
8926
|
+
outline-style: none;
|
|
8927
|
+
}
|
|
8928
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8929
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-disabled);
|
|
8930
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-disabled);
|
|
8931
|
+
}
|
|
8932
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light {
|
|
8933
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-default);
|
|
8934
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-default);
|
|
8935
|
+
}
|
|
8936
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light.ids-menu-item-active {
|
|
8937
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-active);
|
|
8938
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-active);
|
|
8939
|
+
}
|
|
8940
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:hover {
|
|
8941
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-hovered);
|
|
8942
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-hovered);
|
|
8943
|
+
}
|
|
8944
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus, .ids-menu-item.ids-menu-item-filled.ids-menu-item-light:focus-visible {
|
|
8945
|
+
color: var(--ids-comp-menu-item-filled-color-fg-label-light-focused);
|
|
8946
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-focused);
|
|
8947
|
+
outline-color: var(--ids-comp-button-focused-outline-color-light-focused);
|
|
8948
|
+
outline-width: var(--ids-comp-button-focused-outline-size-outline-dense);
|
|
8949
|
+
outline-offset: 2px;
|
|
8950
|
+
outline-style: solid;
|
|
8951
|
+
}
|
|
8952
|
+
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:active {
|
|
8953
|
+
background: var(--ids-comp-menu-item-filled-color-bg-light-pressed);
|
|
8954
|
+
outline-style: none;
|
|
8599
8955
|
}
|
|
8600
8956
|
.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:is(:disabled, .ids-menu-item-disabled) {
|
|
8601
8957
|
color: var(--ids-comp-menu-item-filled-color-fg-label-light-disabled);
|
|
@@ -9543,9 +9899,6 @@ a.ids-menu-item:link, a.ids-menu-item:visited {
|
|
|
9543
9899
|
.ids-overlay-panel.ids-overlay-panel-has-menu button:hover {
|
|
9544
9900
|
border-color: transparent;
|
|
9545
9901
|
}
|
|
9546
|
-
.ids-overlay-panel.ids-overlay-panel-has-menu button:focus, .ids-overlay-panel.ids-overlay-panel-has-menu button:focus-visible {
|
|
9547
|
-
outline-style: none !important;
|
|
9548
|
-
}
|
|
9549
9902
|
|
|
9550
9903
|
.ids-paginator {
|
|
9551
9904
|
box-sizing: border-box;
|
|
@@ -11282,298 +11635,298 @@ a.ids-menu-item:link, a.ids-menu-item:visited {
|
|
|
11282
11635
|
.ids-segmented-control-toggle.ids-segmented-control-toggle-primary .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-primary .ids-segmented-control-toggle-item > button:focus-visible {
|
|
11283
11636
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
11284
11637
|
}
|
|
11285
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11638
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button {
|
|
11286
11639
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default);
|
|
11287
11640
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default);
|
|
11288
11641
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default);
|
|
11289
11642
|
}
|
|
11290
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11643
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button .ids-icon {
|
|
11291
11644
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default);
|
|
11292
11645
|
}
|
|
11293
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11646
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
11294
11647
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-active);
|
|
11295
11648
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-active);
|
|
11296
11649
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-active);
|
|
11297
11650
|
}
|
|
11298
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11651
|
+
.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 {
|
|
11299
11652
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-active);
|
|
11300
11653
|
}
|
|
11301
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11654
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:hover {
|
|
11302
11655
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered);
|
|
11303
11656
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-hovered);
|
|
11304
11657
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-hovered);
|
|
11305
11658
|
}
|
|
11306
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11659
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:hover .ids-icon {
|
|
11307
11660
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-hovered);
|
|
11308
11661
|
}
|
|
11309
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11662
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:active {
|
|
11310
11663
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed);
|
|
11311
11664
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-pressed);
|
|
11312
11665
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-pressed);
|
|
11313
11666
|
}
|
|
11314
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11667
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:active .ids-icon {
|
|
11315
11668
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-pressed);
|
|
11316
11669
|
}
|
|
11317
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11670
|
+
.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 {
|
|
11318
11671
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-focused);
|
|
11319
11672
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-focused);
|
|
11320
11673
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-focused);
|
|
11321
11674
|
}
|
|
11322
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11675
|
+
.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 {
|
|
11323
11676
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-focused);
|
|
11324
11677
|
}
|
|
11325
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11678
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:disabled {
|
|
11326
11679
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled);
|
|
11327
11680
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-disabled);
|
|
11328
11681
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-disabled);
|
|
11329
11682
|
}
|
|
11330
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11683
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary > button:disabled .ids-icon {
|
|
11331
11684
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-disabled);
|
|
11332
11685
|
}
|
|
11333
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11686
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button {
|
|
11334
11687
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default);
|
|
11335
11688
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default);
|
|
11336
11689
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default);
|
|
11337
11690
|
}
|
|
11338
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11691
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button .ids-icon {
|
|
11339
11692
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default);
|
|
11340
11693
|
}
|
|
11341
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11694
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
11342
11695
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-active);
|
|
11343
11696
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-active);
|
|
11344
11697
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-active);
|
|
11345
11698
|
}
|
|
11346
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11699
|
+
.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 {
|
|
11347
11700
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-active);
|
|
11348
11701
|
}
|
|
11349
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11702
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:hover {
|
|
11350
11703
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered);
|
|
11351
11704
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-hovered);
|
|
11352
11705
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-hovered);
|
|
11353
11706
|
}
|
|
11354
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11707
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:hover .ids-icon {
|
|
11355
11708
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-hovered);
|
|
11356
11709
|
}
|
|
11357
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11710
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:active {
|
|
11358
11711
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed);
|
|
11359
11712
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-pressed);
|
|
11360
11713
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-pressed);
|
|
11361
11714
|
}
|
|
11362
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11715
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:active .ids-icon {
|
|
11363
11716
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-pressed);
|
|
11364
11717
|
}
|
|
11365
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11718
|
+
.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 {
|
|
11366
11719
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-focused);
|
|
11367
11720
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-focused);
|
|
11368
11721
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-focused);
|
|
11369
11722
|
}
|
|
11370
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11723
|
+
.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 {
|
|
11371
11724
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-focused);
|
|
11372
11725
|
}
|
|
11373
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11726
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:disabled {
|
|
11374
11727
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled);
|
|
11375
11728
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-disabled);
|
|
11376
11729
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-disabled);
|
|
11377
11730
|
}
|
|
11378
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11731
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary > button:disabled .ids-icon {
|
|
11379
11732
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-disabled);
|
|
11380
11733
|
}
|
|
11381
11734
|
.ids-segmented-control-toggle.ids-segmented-control-toggle-surface .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-surface .ids-segmented-control-toggle-item > button:focus-visible {
|
|
11382
11735
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused);
|
|
11383
11736
|
}
|
|
11384
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11737
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button {
|
|
11385
11738
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default);
|
|
11386
11739
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default);
|
|
11387
11740
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default);
|
|
11388
11741
|
}
|
|
11389
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11742
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button .ids-icon {
|
|
11390
11743
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default);
|
|
11391
11744
|
}
|
|
11392
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11745
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
11393
11746
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-active);
|
|
11394
11747
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-active);
|
|
11395
11748
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-active);
|
|
11396
11749
|
}
|
|
11397
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11750
|
+
.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 {
|
|
11398
11751
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-active);
|
|
11399
11752
|
}
|
|
11400
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11753
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:hover {
|
|
11401
11754
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered);
|
|
11402
11755
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-hovered);
|
|
11403
11756
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-hovered);
|
|
11404
11757
|
}
|
|
11405
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11758
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:hover .ids-icon {
|
|
11406
11759
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-hovered);
|
|
11407
11760
|
}
|
|
11408
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11761
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:active {
|
|
11409
11762
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed);
|
|
11410
11763
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-pressed);
|
|
11411
11764
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-pressed);
|
|
11412
11765
|
}
|
|
11413
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11766
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:active .ids-icon {
|
|
11414
11767
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-pressed);
|
|
11415
11768
|
}
|
|
11416
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11769
|
+
.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 {
|
|
11417
11770
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-focused);
|
|
11418
11771
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-focused);
|
|
11419
11772
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-focused);
|
|
11420
11773
|
}
|
|
11421
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11774
|
+
.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 {
|
|
11422
11775
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-focused);
|
|
11423
11776
|
}
|
|
11424
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11777
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:disabled {
|
|
11425
11778
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled);
|
|
11426
11779
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-disabled);
|
|
11427
11780
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-disabled);
|
|
11428
11781
|
}
|
|
11429
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11782
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface > button:disabled .ids-icon {
|
|
11430
11783
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-disabled);
|
|
11431
11784
|
}
|
|
11432
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11785
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button {
|
|
11433
11786
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default);
|
|
11434
11787
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default);
|
|
11435
11788
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default);
|
|
11436
11789
|
}
|
|
11437
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11790
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button .ids-icon {
|
|
11438
11791
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default);
|
|
11439
11792
|
}
|
|
11440
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11793
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
11441
11794
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-active);
|
|
11442
11795
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-active);
|
|
11443
11796
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-active);
|
|
11444
11797
|
}
|
|
11445
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11798
|
+
.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 {
|
|
11446
11799
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-active);
|
|
11447
11800
|
}
|
|
11448
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11801
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:hover {
|
|
11449
11802
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered);
|
|
11450
11803
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-hovered);
|
|
11451
11804
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-hovered);
|
|
11452
11805
|
}
|
|
11453
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11806
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:hover .ids-icon {
|
|
11454
11807
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-hovered);
|
|
11455
11808
|
}
|
|
11456
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11809
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:active {
|
|
11457
11810
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed);
|
|
11458
11811
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-pressed);
|
|
11459
11812
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-pressed);
|
|
11460
11813
|
}
|
|
11461
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11814
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:active .ids-icon {
|
|
11462
11815
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-pressed);
|
|
11463
11816
|
}
|
|
11464
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11817
|
+
.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 {
|
|
11465
11818
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-focused);
|
|
11466
11819
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-focused);
|
|
11467
11820
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-focused);
|
|
11468
11821
|
}
|
|
11469
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11822
|
+
.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 {
|
|
11470
11823
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-focused);
|
|
11471
11824
|
}
|
|
11472
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11825
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:disabled {
|
|
11473
11826
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled);
|
|
11474
11827
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-disabled);
|
|
11475
11828
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-disabled);
|
|
11476
11829
|
}
|
|
11477
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11830
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface > button:disabled .ids-icon {
|
|
11478
11831
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-disabled);
|
|
11479
11832
|
}
|
|
11480
11833
|
.ids-segmented-control-toggle.ids-segmented-control-toggle-light .ids-segmented-control-toggle-item > button:focus, .ids-segmented-control-toggle.ids-segmented-control-toggle-light .ids-segmented-control-toggle-item > button:focus-visible {
|
|
11481
11834
|
outline-color: var(--ids-comp-segmented-control-toggle-focused-outline-color-light-focused);
|
|
11482
11835
|
}
|
|
11483
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11836
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button {
|
|
11484
11837
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default);
|
|
11485
11838
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default);
|
|
11486
11839
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default);
|
|
11487
11840
|
}
|
|
11488
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11841
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button .ids-icon {
|
|
11489
11842
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default);
|
|
11490
11843
|
}
|
|
11491
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11844
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
11492
11845
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-active);
|
|
11493
11846
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-active);
|
|
11494
11847
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-active);
|
|
11495
11848
|
}
|
|
11496
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11849
|
+
.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 {
|
|
11497
11850
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-active);
|
|
11498
11851
|
}
|
|
11499
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11852
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:hover {
|
|
11500
11853
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered);
|
|
11501
11854
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-hovered);
|
|
11502
11855
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-hovered);
|
|
11503
11856
|
}
|
|
11504
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11857
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:hover .ids-icon {
|
|
11505
11858
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered);
|
|
11506
11859
|
}
|
|
11507
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11860
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:active {
|
|
11508
11861
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed);
|
|
11509
11862
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-pressed);
|
|
11510
11863
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-pressed);
|
|
11511
11864
|
}
|
|
11512
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11865
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:active .ids-icon {
|
|
11513
11866
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-pressed);
|
|
11514
11867
|
}
|
|
11515
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11868
|
+
.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 {
|
|
11516
11869
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-focused);
|
|
11517
11870
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-focused);
|
|
11518
11871
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-focused);
|
|
11519
11872
|
}
|
|
11520
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11873
|
+
.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 {
|
|
11521
11874
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-focused);
|
|
11522
11875
|
}
|
|
11523
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11876
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:disabled {
|
|
11524
11877
|
background-color: var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled);
|
|
11525
11878
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-disabled);
|
|
11526
11879
|
border-color: var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-disabled);
|
|
11527
11880
|
}
|
|
11528
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11881
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light > button:disabled .ids-icon {
|
|
11529
11882
|
color: var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-disabled);
|
|
11530
11883
|
}
|
|
11531
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11884
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button {
|
|
11532
11885
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default);
|
|
11533
11886
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default);
|
|
11534
11887
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default);
|
|
11535
11888
|
}
|
|
11536
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11889
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button .ids-icon {
|
|
11537
11890
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default);
|
|
11538
11891
|
}
|
|
11539
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11892
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button.ids-segmented-control-toggle-item-selected:not(:disabled) {
|
|
11540
11893
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-active);
|
|
11541
11894
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-active);
|
|
11542
11895
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-active);
|
|
11543
11896
|
}
|
|
11544
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11897
|
+
.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 {
|
|
11545
11898
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-active);
|
|
11546
11899
|
}
|
|
11547
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11900
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:hover {
|
|
11548
11901
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered);
|
|
11549
11902
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-hovered);
|
|
11550
11903
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-hovered);
|
|
11551
11904
|
}
|
|
11552
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11905
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:hover .ids-icon {
|
|
11553
11906
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-hovered);
|
|
11554
11907
|
}
|
|
11555
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11908
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:active {
|
|
11556
11909
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed);
|
|
11557
11910
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-pressed);
|
|
11558
11911
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-pressed);
|
|
11559
11912
|
}
|
|
11560
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11913
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:active .ids-icon {
|
|
11561
11914
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-pressed);
|
|
11562
11915
|
}
|
|
11563
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11916
|
+
.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 {
|
|
11564
11917
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-focused);
|
|
11565
11918
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-focused);
|
|
11566
11919
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-focused);
|
|
11567
11920
|
}
|
|
11568
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11921
|
+
.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 {
|
|
11569
11922
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-focused);
|
|
11570
11923
|
}
|
|
11571
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11924
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:disabled {
|
|
11572
11925
|
background-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled);
|
|
11573
11926
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-disabled);
|
|
11574
11927
|
border-color: var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-disabled);
|
|
11575
11928
|
}
|
|
11576
|
-
.ids-segmented-control-toggle.ids-segmented-control-toggle-
|
|
11929
|
+
.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light > button:disabled .ids-icon {
|
|
11577
11930
|
color: var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-disabled);
|
|
11578
11931
|
}
|
|
11579
11932
|
|