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 d266acb6f95c..7e2643d32f55 100644 --- a/src/material-experimental/mdc-slide-toggle/_slide-toggle-theme.scss +++ b/src/material-experimental/mdc-slide-toggle/_slide-toggle-theme.scss @@ -13,9 +13,17 @@ // Save original values of MDC global variables. We need to save these so we can restore the // variables to their original values and prevent unintended side effects from using this mixin. $orig-mdc-switch-baseline-theme-color: $mdc-switch-baseline-theme-color; + $orig-mdc-switch-toggled-off-thumb-color: $mdc-switch-toggled-off-thumb-color; + $orig-mdc-switch-toggled-off-track-color: $mdc-switch-toggled-off-track-color; + $orig-mdc-switch-disabled-thumb-color: $mdc-switch-disabled-thumb-color; + $orig-mdc-switch-disabled-track-color: $mdc-switch-disabled-track-color; @include mat-using-mdc-theme($theme) { $mdc-switch-baseline-theme-color: primary !global; + $mdc-switch-toggled-off-thumb-color: mdc-theme-prop-value(surface) !global; + $mdc-switch-toggled-off-track-color: mdc-theme-prop-value(on-surface) !global; + $mdc-switch-disabled-thumb-color: mdc-theme-prop-value(surface) !global; + $mdc-switch-disabled-track-color: mdc-theme-prop-value(on-surface) !global; @include mdc-form-field-core-styles($query: $mat-theme-styles-query); @@ -63,6 +71,10 @@ // Restore original values of MDC global variables. $mdc-switch-baseline-theme-color: $orig-mdc-switch-baseline-theme-color !global; + $mdc-switch-toggled-off-thumb-color: $orig-mdc-switch-toggled-off-thumb-color !global; + $mdc-switch-toggled-off-track-color: $orig-mdc-switch-toggled-off-track-color !global; + $mdc-switch-disabled-thumb-color: $orig-mdc-switch-disabled-thumb-color !global; + $mdc-switch-disabled-track-color: $orig-mdc-switch-disabled-track-color !global; } @mixin mat-mdc-slide-toggle-typography($config) {