From 6e613684dbf77d700474d3e020dfb77d04ac0d5e Mon Sep 17 00:00:00 2001 From: Katie Noake Date: Thu, 7 Sep 2023 12:40:51 +0100 Subject: [PATCH] fix(material/snack-bar): snack-bar action button does not follow material guidelines Fixes a bug in the Angular Material snack-bar, where accent color is used for action button color in light themes and grey is used in dark themes. This does not follow the material design guidelines which recommend a tone of primary color is used in both light and dark themes, and that the color should contrast with the background. Fixes #13905 --- src/material/core/tokens/m2/mat/_snack-bar.scss | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/material/core/tokens/m2/mat/_snack-bar.scss b/src/material/core/tokens/m2/mat/_snack-bar.scss index 9c78d5087fbd..d9f650f73c1b 100644 --- a/src/material/core/tokens/m2/mat/_snack-bar.scss +++ b/src/material/core/tokens/m2/mat/_snack-bar.scss @@ -16,8 +16,12 @@ $prefix: (mat, snack-bar); $is-dark: inspection.get-theme-type($theme) == dark; @return ( - button-color: if( - $is-dark, rgba(0, 0, 0, 0.87), inspection.get-theme-color($theme, accent, text)) + button-color: + if( + $is-dark, + inspection.get-theme-color($theme, primary, 500), + inspection.get-theme-color($theme, primary, 100) + ) ); }