Skip to content

Commit 439ad2c

Browse files
crisbetoandrewseguin
authored andcommitted
fix(material/list): fix up disabled list item styles (#18881)
Fixes a couple of issues with the list item's disabled styles: - In dark themes we were setting the disabled styles to black. This looks out of place since it's not how other components style themselves under dark themes. - The disabled styles are somewhat similar to the selected styles. These changes also set the text color to the disabled text color to make it easier to distinguish. (cherry picked from commit 350ab4d)
1 parent a4f6558 commit 439ad2c

File tree

2 files changed

+5
-4
lines changed

2 files changed

+5
-4
lines changed

src/material/core/theming/_palette.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -705,7 +705,7 @@ $dark-theme-background-palette: (
705705
selected-disabled-button: map.get($grey-palette, 800),
706706
disabled-button-toggle: black,
707707
unselected-chip: map.get($grey-palette, 700),
708-
disabled-list-option: black,
708+
disabled-list-option: rgba(white, 0.12),
709709
tooltip: map.get($grey-palette, 700),
710710
);
711711

src/material/list/_list-theme.scss

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,11 @@
2222
.mat-subheader {
2323
color: theming.get-color-from-palette($foreground, secondary-text);
2424
}
25-
}
2625

27-
.mat-list-item-disabled {
28-
background-color: theming.get-color-from-palette($background, disabled-list-option);
26+
.mat-list-item-disabled {
27+
background-color: theming.get-color-from-palette($background, disabled-list-option);
28+
color: theming.get-color-from-palette($foreground, disabled-text);
29+
}
2930
}
3031

3132
.mat-list-option,

0 commit comments

Comments
 (0)