bug(DIALOG): dialog's container-color does not follow Material 3 design specs
Nobody has claimed this yet.
Assessment
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Newbie friendliness
- 64/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- angular, typescript
Research direction
No file or test is named. Locate the Angular Material dialog theming implementation and its existing tests, then compare the container-color token with the linked Material 3 dialog specification. Done means the default token uses surface-container-high and the relevant test coverage passes.
Written by the indexing model from the issue text.
Description
Is this a regression?
- Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was
No response
Description
As per Material 3 guidelines, container-color should use value surface-container-high token, but it's using value surface token.
We can override it by using dialog-overrides mixin like below:
@include mat.dialog-overrides((
container-color: var(--mat-sys-surface-container-high),
));
But, it should be the default behaviour as per Material 3 specs.
Reproduction
Not needed
Expected Behavior
As per Material 3 guidelines, container-color should use value surface-container-high token.
Actual Behavior
Dialog's container-color is using value surface token.
Environment
- Angular: 19
- CDK/Material: 19
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows
- Dominant language
- TypeScript
- Stars
- 25k
- Forks
- 6.8k
- Avg merge
- 1d 2h
- Merged PRs (30d)
- 80
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from angular/components
-
area: material/tree docs gemini-triaged needs triage
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
angular/components#33832 ·
-
area: material/datepicker gemini-triaged P4
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
angular/components#33763 · 2 comments · 3 reactions ·
-
area: material/table gemini-triaged P4
Difficulty 1/5 Under an hour Newbie friendliness 88/100
angular/components#33709 · 1 comment ·
-
area: material/table docs gemini-triaged P4
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
angular/components#33455 ·
-
area: material/core gemini-triaged P3
Difficulty 1/5 Under an hour Newbie friendliness 78/100
angular/components#33059 · 2 comments ·
All issues in angular/components
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
safetrustcr/dApp-SafeTrust#426 ·
-
area:workflow bug ready-for-agent
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
fil-donadoni/tolaria#4409 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
Fission-AI/OpenSpec#1960 ·
-
Add dependabot Open
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
corsairdev/corsair#1764 ·