Skip to content

Commit

Permalink
fix(material-experimental/mdc-chips): checkmark not visible in… (#18061)
Browse files Browse the repository at this point in the history
In high contrast mode SVG colors aren't changed which means that the white checkmark in the `mat-chip` will blend in with the background in black-on-white mode. These changes add an override to make the checkmark black in this case.
  • Loading branch information
crisbeto authored and mmalerba committed Dec 29, 2019
1 parent 61029c8 commit 99af8e9
Showing 1 changed file with 9 additions and 0 deletions.
9 changes: 9 additions & 0 deletions src/material-experimental/mdc-chips/chips.scss
Original file line number Diff line number Diff line change
Expand Up @@ -71,3 +71,12 @@ $mat-chip-input-width: 150px;
input.mat-mdc-chip-input {
flex: 1 0 $mat-chip-input-width;
}

.mdc-chip__checkmark-path {
@include cdk-high-contrast(black-on-white) {
// SVG colors won't be changed in high contrast mode and since the checkmark is white
// by default, it'll blend in with the background in black-on-white mode. Override the color
// to ensure that it's visible. We need !important, because the theme styles are very specific.
stroke: #000 !important;
}
}

0 comments on commit 99af8e9

Please sign in to comment.