From 66e138dc36b7ab4959490878a23cb4f7a6e79e13 Mon Sep 17 00:00:00 2001 From: crisbeto Date: Wed, 24 Jul 2019 22:42:02 +0200 Subject: [PATCH] fix(popover-edit): blending in with background in high contrast mode Fixes the popover edit's overlay blending in with the background in high contrast mode, because it doesn't have a border or an outline. --- src/material-experimental/popover-edit/_popover-edit.scss | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/material-experimental/popover-edit/_popover-edit.scss b/src/material-experimental/popover-edit/_popover-edit.scss index c84f71eeccea..7216107e621a 100644 --- a/src/material-experimental/popover-edit/_popover-edit.scss +++ b/src/material-experimental/popover-edit/_popover-edit.scss @@ -1,3 +1,4 @@ +@import '../../cdk/a11y/a11y'; @import '../../material/core/style/variables'; @import '../../material/core/style/elevation'; @import '../../material/core/theming/palette'; @@ -80,6 +81,13 @@ color: mat-color($foreground, text); display: block; padding: 16px 24px; + + @include cdk-high-contrast { + // Note that normally we use 1px for high contrast outline, however here we use 3, + // because the popover is rendered on top of a table which already has some borders + // and doesn't have a backdrop. The thicker outline makes it easier to differentiate. + outline: solid 3px; + } } .mat-edit-lens {