Skip to content

Commit 3119763

Browse files
crisbetoandrewseguin
authored andcommitted
fix(popover-edit): blending in with background in high contrast mode (#16604)
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.
1 parent 9dee466 commit 3119763

File tree

1 file changed

+8
-0
lines changed

1 file changed

+8
-0
lines changed

src/material-experimental/popover-edit/_popover-edit.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
@import '../../cdk/a11y/a11y';
12
@import '../../material/core/style/variables';
23
@import '../../material/core/style/elevation';
34
@import '../../material/core/theming/palette';
@@ -80,6 +81,13 @@
8081
color: mat-color($foreground, text);
8182
display: block;
8283
padding: 16px 24px;
84+
85+
@include cdk-high-contrast {
86+
// Note that normally we use 1px for high contrast outline, however here we use 3,
87+
// because the popover is rendered on top of a table which already has some borders
88+
// and doesn't have a backdrop. The thicker outline makes it easier to differentiate.
89+
outline: solid 3px;
90+
}
8391
}
8492

8593
.mat-edit-lens {

0 commit comments

Comments
 (0)