fix(checkbox): no focus indicator in high contrast

devversion · devversion · commit c4595158b1c1 · 2018-09-22T11:59:51.000+02:00
* Fixes that the checkbox does not have a focus indicator in high-contrast. Similarly to native checkboxes, the Material checkbox should have a dotted border/outline on keyboard focus. Fixes #13227
diff --git a/src/lib/checkbox/checkbox.scss b/src/lib/checkbox/checkbox.scss
@@ -240,6 +240,12 @@ $_mat-checkbox-mark-stroke-size: 2 / 15 * $mat-checkbox-size !default;
   ._mat-animation-noopable & {
     transition: none;
   }
+
+  @include cdk-high-contrast {
+    .mat-checkbox.cdk-keyboard-focused & {
+      border-style: dotted;
+    }
+  }
 }
 
 .mat-checkbox-background {

Original file line number	Diff line number	Diff line change
`@@ -240,6 +240,12 @@ $_mat-checkbox-mark-stroke-size: 2 / 15 * $mat-checkbox-size !default;`
`240`	`240`	`._mat-animation-noopable & {`
`241`	`241`	`transition: none;`
`242`	`242`	`}`
	`243`	`+`
	`244`	`+ @include cdk-high-contrast {`
	`245`	`+ .mat-checkbox.cdk-keyboard-focused & {`
	`246`	`+ border-style: dotted;`
	`247`	`+ }`
	`248`	`+ }`
`243`	`249`	`}`
`244`	`250`
`245`	`251`	`.mat-checkbox-background {`