mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 11:17:19 +08:00
fix(segment): apply hover properly for segment with color (#18549)
This commit is contained in:
@ -27,7 +27,6 @@
|
||||
|
||||
:host(.ion-color)::slotted(ion-segment-button) {
|
||||
--border-color: #{current-color(base)};
|
||||
--background-hover: #{current-color(base, .04)};
|
||||
|
||||
background: transparent;
|
||||
color: #{current-color(base)};
|
||||
@ -52,6 +51,12 @@
|
||||
color: #{current-color(contrast, $segment-ios-opacity-disabled)};
|
||||
}
|
||||
|
||||
@media (any-hover: hover) {
|
||||
:host(.ion-color)::slotted(ion-segment-button:hover:not(.segment-button-checked)) {
|
||||
background: #{current-color(base, .1)};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Segment: Default Toolbar
|
||||
// --------------------------------------------------
|
||||
|
@ -23,7 +23,6 @@
|
||||
// --------------------------------------------------
|
||||
|
||||
:host(.ion-color)::slotted(ion-segment-button) {
|
||||
--background-hover: #{current-color(base, .04)};
|
||||
--background-activated: #{current-color(base, .16)};
|
||||
--ripple-color: #{current-color(base)};
|
||||
|
||||
@ -40,6 +39,11 @@
|
||||
color: #{current-color(base)};
|
||||
}
|
||||
|
||||
@media (any-hover: hover) {
|
||||
:host(.ion-color)::slotted(ion-segment-button:hover) {
|
||||
background: #{current-color(base, .04)};
|
||||
}
|
||||
}
|
||||
|
||||
// Segment: Default Toolbar
|
||||
// --------------------------------------------------
|
||||
|
Reference in New Issue
Block a user