Skip to content

Commit

Permalink
fix(material/snack-bar): prevent override of snack bar action button …
Browse files Browse the repository at this point in the history
…color (#27511)

Co-authored-by: Daniel Kimmich <[email protected]>
(cherry picked from commit d0cf8bf)
  • Loading branch information
json-derulo authored and mmalerba committed Nov 12, 2024
1 parent c643f04 commit aed9094
Showing 1 changed file with 10 additions and 8 deletions.
18 changes: 10 additions & 8 deletions src/material/snack-bar/snack-bar-container.scss
Original file line number Diff line number Diff line change
Expand Up @@ -105,14 +105,16 @@ $_side-padding: 8px;
// The `mat-mdc-button` and `:not(:disabled)` here are redundant, but we need them to increase
// the specificity over the button styles that may bleed in from the rest of the app.
.mat-mdc-snack-bar-container .mat-mdc-button.mat-mdc-snack-bar-action:not(:disabled) {
// MDC's `action-label-text-color` should be able to do this, but the button theme has a
// higher specificity so it ends up overriding it. Define our own variable that we can
// use to control the color instead.
@include token-utils.use-tokens(
tokens-mat-snack-bar.$prefix,
tokens-mat-snack-bar.get-token-slots()
) {
@include token-utils.create-token-slot(color, button-color);
&.mat-unthemed {
// MDC's `action-label-text-color` should be able to do this, but the button theme has a
// higher specificity so it ends up overriding it. Define our own variable that we can
// use to control the color instead.
@include token-utils.use-tokens(
tokens-mat-snack-bar.$prefix,
tokens-mat-snack-bar.get-token-slots()
) {
@include token-utils.create-token-slot(color, button-color);
}
}

// Darken the ripples in the button so they're visible against the dark background.
Expand Down

0 comments on commit aed9094

Please sign in to comment.