From 0d4528617f951843e0b337aec007aeac249e22b3 Mon Sep 17 00:00:00 2001 From: crisbeto Date: Fri, 6 Mar 2020 21:50:45 +0100 Subject: [PATCH] fix(slide-toggle): incorrect text color when placed inside an overlay with a dark theme The slide toggle doesn't define its text color, but inherits it from the closest theme root element. The problem is that if the element is moved out to something like an overlay, the color may be inherited from the `body` which won't be correct. These changes explicitly set the `color`. Fixes #18701. --- src/material/slide-toggle/_slide-toggle-theme.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/material/slide-toggle/_slide-toggle-theme.scss b/src/material/slide-toggle/_slide-toggle-theme.scss index 165b98aa2219..e2b1066e9fe6 100644 --- a/src/material/slide-toggle/_slide-toggle-theme.scss +++ b/src/material/slide-toggle/_slide-toggle-theme.scss @@ -46,6 +46,10 @@ .mat-slide-toggle { @include _mat-slide-toggle-checked($accent, $thumb-checked-hue); + // Explicitly set the text color since the slide toggle may be + // inside an overlay that doesn't have the proper theme text color. + color: mat-color($foreground, 'text'); + &.mat-primary { @include _mat-slide-toggle-checked($primary, $thumb-checked-hue); }