fix(checkbox): Disabled state colors in IE11 high contrast mode (#5263)

material-components · Nov 22, 2019 · d6a1d4b · d6a1d4b
1 parent fe444ac
commit d6a1d4b
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/packages/mdc-checkbox/_mixins.scss b/packages/mdc-checkbox/_mixins.scss
@@ -71,6 +71,15 @@ $mdc-checkbox-ripple-target: ".mdc-checkbox__ripple";
   @include mdc-checkbox-disabled-ink-color($mdc-checkbox-mark-color, $query: $query);
 
   @media screen and (-ms-high-contrast: active) {
+    @include mdc-checkbox-disabled-container-colors(
+      $unmarked-stroke-color: GrayText,
+      $unmarked-fill-color: transparent,
+      $marked-stroke-color: GrayText,
+      $marked-fill-color: transparent,
+      $query: $query
+    );
+    @include mdc-checkbox-disabled-ink-color(GrayText, $query: $query);
+
     .mdc-checkbox__mixedmark {
       @include mdc-feature-targets($feat-structure) {
         margin: 0 1px; // Extra horizontal space around mixedmark symbol.

diff --git a/packages/mdc-theme/_variables.scss b/packages/mdc-theme/_variables.scss
@@ -162,7 +162,10 @@ $mdc-theme-property-values: (
     $style == "currentColor" or
     str_slice($style, 1, 4) == "var(" or
     $style == "inherit" or
-    $style == "transparent";
+    $style == "transparent" or
+    // NOTE: `GrayText` is deprecated, but is the only feasible way to convey the
+    // correct high-contrast mode colors in alignment with Windows system colors.
+    $style == "GrayText";
 }
 
 @function mdc-theme-text-emphasis($emphasis) {