Skip to content

Commit

Permalink
fix(material-experimental/mdc-list): fix selected indication in high …
Browse files Browse the repository at this point in the history
…contrast mode

We have some special handling for single selection lists in high contrast mode which wasn't switched to the non-deprecated list styles.
  • Loading branch information
crisbeto committed Jul 25, 2021
1 parent 24c35a4 commit 04a10ad
Showing 1 changed file with 5 additions and 5 deletions.
10 changes: 5 additions & 5 deletions src/material-experimental/mdc-list/list-option.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
@use '@material/checkbox' as mdc-checkbox;
@use '@material/list' as mdc-list;
@use '@material/list/evolution-variables' as mdc-list-variables;
@use '../mdc-helpers/mdc-helpers';
@use '../../cdk/a11y';
@use './list-option-trailing-avatar-compat';
Expand Down Expand Up @@ -33,21 +33,21 @@
// In single selection mode, the selected option is indicated by changing its
// background color, but that doesn't work in high contrast mode. We add an
// alternate indication by rendering out a circle.
.mat-mdc-list-option.mdc-deprecated-list-item--selected::after {
.mat-mdc-list-option.mdc-list-item--selected::after {
$size: 10px;
content: '';
position: absolute;
top: 50%;
right: mdc-list.$deprecated-side-padding;
right: mdc-list-variables.$side-padding;
transform: translateY(-50%);
width: $size;
height: 0;
border-bottom: solid $size;
border-radius: $size;
}

[dir='rtl'] .mat-mdc-list-option.mdc-deprecated-list-item--selected::after {
[dir='rtl'] .mat-mdc-list-option.mdc-list-item--selected::after {
right: auto;
left: mdc-list.$deprecated-side-padding;
left: mdc-list-variables.$side-padding;
}
}

0 comments on commit 04a10ad

Please sign in to comment.