javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 08:09:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(button): show correct activated state for ios (#26900)

Browse Source 
fixes #22468
This commit is contained in:
Brandy Carney
2023-03-07 13:00:37 -05:00
committed by GitHub
parent 8d184c8c1b
commit 67815ccbf4
38 changed files with 272 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
core/src/components/button/button.scss
View File

@ -246,17 +246,6 @@ ion-ripple-effect {
@include button-state();
}
// Button Activated
:host(.ion-activated) {
color: var(--color-activated);
}
:host(.ion-activated) .button-native::after {
background: var(--background-activated);
opacity: var(--background-activated-opacity);
}
// Button Focused
:host(.ion-focused) {
color: var(--color-focused);
@ -281,6 +270,17 @@ ion-ripple-effect {
}
}
// Button Activated
:host(.ion-activated) {
color: var(--color-activated);
}
:host(.ion-activated) .button-native::after {
background: var(--background-activated);
opacity: var(--background-activated-opacity);
}
// Button Colors
// --------------------------------------------------
@ -305,6 +305,7 @@ ion-ripple-effect {
color: current-color(base);
}
// Button in Toolbar
// --------------------------------------------------
@ -320,3 +321,11 @@ ion-ripple-effect {
background: #{var(--ion-toolbar-color, var(--background))};
color: #{var(--ion-toolbar-background, var(--color))};
}
// Activated Button in Toolbar
// --------------------------------------------------
:host(.button-outline.ion-activated.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native {
background: var(--ion-toolbar-color, var(--color));
color: #{var(--ion-toolbar-background, var(--background), ion-color(primary, contrast))};
}