Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug(select): multiple select uses single select text color for selected options (on-secondary-container) #30366

Open
AJJPostma opened this issue Jan 22, 2025 · 0 comments · May be fixed by #30367
Labels
area: material/select P4 A relatively minor issue that is not relevant to core functions

Comments

@AJJPostma
Copy link

AJJPostma commented Jan 22, 2025

Description

When using a single select, the selected option gets seconary-container backround color with on-secondary-container text color. When using a multiple select the backround color of selected options stays the same (because there already is a checkbox to show selected state), but the text color still changes to on-secondary-container making it potentially hard to read (depending on your theme).

Reproduction

StackBlitz link: https://stackblitz.com/edit/components-issue-starter-zxlbij2m

  1. Select an option in the single select
  2. Select an option in the multiple select
  3. See invisible selected item in multiple select.

Expected Behavior

mat-option text color should only change when selected for single select

Actual Behavior

mat-option, in mat-select with multiple, text color changes when selected, making it hard/impossible to see on some color schemes.

Environment

  • Angular:
  • CDK/Material:
  • Browser(s):
  • Operating System (e.g. Windows, macOS, Ubuntu):
@AJJPostma AJJPostma added the needs triage This issue needs to be triaged by the team label Jan 22, 2025
@crisbeto crisbeto added P4 A relatively minor issue that is not relevant to core functions area: material/select and removed needs triage This issue needs to be triaged by the team labels Jan 24, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area: material/select P4 A relatively minor issue that is not relevant to core functions
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants