From fe367bd6ef053702c1384466364ad8d10cb70273 Mon Sep 17 00:00:00 2001 From: crisbeto Date: Mon, 30 Jul 2018 23:08:35 +0200 Subject: [PATCH] fix(form-field): unable to distinguish disabled form field in high contrast mode Fixes the disabled form field being indistinguishable from enabled ones in high contrast mode, due to the dotted gradient not being rendered. --- src/lib/form-field/form-field-legacy.scss | 5 +++++ src/lib/form-field/form-field-standard.scss | 5 +++++ 2 files changed, 10 insertions(+) diff --git a/src/lib/form-field/form-field-legacy.scss b/src/lib/form-field/form-field-legacy.scss index f0be9791b866..77344f0999f6 100644 --- a/src/lib/form-field/form-field-legacy.scss +++ b/src/lib/form-field/form-field-legacy.scss @@ -58,6 +58,11 @@ $mat-form-field-legacy-underline-height: 1px !default; &.mat-form-field-disabled .mat-form-field-underline { background-position: 0; background-color: transparent; + + @include cdk-high-contrast { + border-top-style: dotted; + border-top-width: 2px; + } } &.mat-form-field-invalid:not(.mat-focused) .mat-form-field-ripple { diff --git a/src/lib/form-field/form-field-standard.scss b/src/lib/form-field/form-field-standard.scss index 4910f3efa458..16a8ce349c9f 100644 --- a/src/lib/form-field/form-field-standard.scss +++ b/src/lib/form-field/form-field-standard.scss @@ -42,6 +42,11 @@ $mat-form-field-standard-padding-top: 0.75em !default; &.mat-form-field-disabled .mat-form-field-underline { background-position: 0; background-color: transparent; + + @include cdk-high-contrast { + border-top-style: dotted; + border-top-width: 2px; + } } // Note that we need this specific of a selector because we don't want