From e14841410fb5f6fc192739c59c83ded612707b46 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Tue, 21 Aug 2018 20:34:17 +0200 Subject: [PATCH] fix(slide-toggle): blended ripples do not match spec (#12735) * In order to fully align the slide-toggle with the 2018 specs, we need to reduce the opacity of the transient ripples because those blend together with the persistent ripple that has been introduced for hover/focus. --- src/lib/slide-toggle/slide-toggle.scss | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/lib/slide-toggle/slide-toggle.scss b/src/lib/slide-toggle/slide-toggle.scss index dbeec46dcab..fb00bccc602 100644 --- a/src/lib/slide-toggle/slide-toggle.scss +++ b/src/lib/slide-toggle/slide-toggle.scss @@ -191,7 +191,10 @@ $mat-slide-toggle-bar-track-width: $mat-slide-toggle-bar-width - $mat-slide-togg pointer-events: none; .mat-ripple-element:not(.mat-slide-toggle-persistent-ripple) { - opacity: 0.16; + // Although the specs describe an opacity of 16% for ripples if the slide-toggle is being + // pressed, we need to reduce the opacity a bit because besides the transient ripples, + // the persistent ripple will still show up and blend with the transient ripple. + opacity: 0.12; } }