diff --git a/src/material-experimental/mdc-checkbox/_checkbox-theme.scss b/src/material-experimental/mdc-checkbox/_checkbox-theme.scss index 303f171de116..e3696dca05ce 100644 --- a/src/material-experimental/mdc-checkbox/_checkbox-theme.scss +++ b/src/material-experimental/mdc-checkbox/_checkbox-theme.scss @@ -32,6 +32,7 @@ $primary: mat.get-color-from-palette(map.get($config, primary)); $accent: mat.get-color-from-palette(map.get($config, accent)); $warn: mat.get-color-from-palette(map.get($config, warn)); + $foreground: map.get($config, foreground); @include mat.private-using-mdc-theme($config) { .mat-mdc-checkbox { @@ -64,6 +65,11 @@ @include _selected-ripple-colors($warn, error); } } + + .mat-mdc-checkbox-disabled label { + // MDC should set the disabled color on the label, but doesn't, so we do it here instead. + color: mat.get-color-from-palette($foreground, disabled-text); + } } } diff --git a/src/material-experimental/mdc-radio/_radio-theme.scss b/src/material-experimental/mdc-radio/_radio-theme.scss index b944a97e34e1..16683d61e5c7 100644 --- a/src/material-experimental/mdc-radio/_radio-theme.scss +++ b/src/material-experimental/mdc-radio/_radio-theme.scss @@ -21,6 +21,7 @@ $primary: mat.get-color-from-palette(map.get($config, primary)); $accent: mat.get-color-from-palette(map.get($config, accent)); $warn: mat.get-color-from-palette(map.get($config, warn)); + $foreground: map.get($config, foreground); @include mat.private-using-mdc-theme($config) { $on-surface: rgba(mdc-theme-color.$on-surface, 0.54); @@ -46,6 +47,11 @@ --mat-mdc-radio-ripple-color: #{mdc-theme-color.prop-value(on-surface)}; + // MDC should set the disabled color on the label, but doesn't, so we do it here instead. + .mdc-radio--disabled + label { + color: mat.get-color-from-palette($foreground, disabled-text); + } + &.mat-primary { @include _color-palette($primary); } diff --git a/src/material-experimental/mdc-slide-toggle/_slide-toggle-theme.scss b/src/material-experimental/mdc-slide-toggle/_slide-toggle-theme.scss index ae63393d40e9..c81c0668dc6c 100644 --- a/src/material-experimental/mdc-slide-toggle/_slide-toggle-theme.scss +++ b/src/material-experimental/mdc-slide-toggle/_slide-toggle-theme.scss @@ -73,6 +73,7 @@ $accent: mat.get-color-from-palette(map.get($config, accent)); $warn: mat.get-color-from-palette(map.get($config, warn)); $is-dark: map.get($config, is-dark); + $foreground: map.get($config, foreground); @include mat.private-using-mdc-theme($config) { // MDC's switch doesn't support a `color` property. We add support @@ -81,6 +82,11 @@ @include mdc-form-field.core-styles($query: mat.$private-mdc-theme-styles-query); @include mdc-switch-theme.theme(_get-theme-base-map($is-dark)); + // MDC should set the disabled color on the label, but doesn't, so we do it here instead. + .mdc-switch--disabled + label { + color: mat.get-color-from-palette($foreground, disabled-text); + } + &.mat-primary { @include mdc-switch-theme.theme(_get-theme-color-map($primary)); }