skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(slide-toggle): focus ripple not hiding after click/touch (#13562)

Browse Source 
Similarly to the checkbox (#13295), the persistent ripple should only show up for focus if the slide-toggle has been focused through keyboard.

https://storage.googleapis.com/spec-host-backup/mio-design%2Fassets%2F1w3KOMo81gakKP7JC6yNogxCt-CadYQvx%2Fslidercontrols-1a-v02.mp4
This commit is contained in:
Paul Gschwendtner
2019-05-14 18:58:43 +02:00
committed by Jeremy Elbourn
parent 20a09301e9
commit 917a52e03c
1 changed files with 4 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/material/slide-toggle/slide-toggle.scss
+4 -1
View File
@@ -210,7 +210,10 @@ $mat-slide-toggle-bar-track-width: $mat-slide-toggle-bar-width - $mat-slide-togg
opacity: 0.04;
}
.mat-slide-toggle:not(.mat-disabled).cdk-focused & {
// As per specifications, the focus ripple should only show up if the slide-toggle has
// been focused through keyboard. We cannot account for `cdk-program-focused` because clicking
// on the label causes the focus origin to be `program` due to the focus redirection.
.mat-slide-toggle:not(.mat-disabled).cdk-keyboard-focused & {
opacity: 0.12;
}