From f6537a18ff5bcaa18573b0314fc62ff0843c3865 Mon Sep 17 00:00:00 2001 From: timmoy Date: Sat, 17 Feb 2018 10:06:43 -0500 Subject: [PATCH] docs(theming): update mat-color usage for numeric hue and -contrast modifier (#9977) --- guides/theming-your-components.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/guides/theming-your-components.md b/guides/theming-your-components.md index 9fa51128e9d..4708aebe80b 100644 --- a/guides/theming-your-components.md +++ b/guides/theming-your-components.md @@ -65,11 +65,12 @@ You can use the `mat-color` function to extract a specific color from a palette. // Use mat-color to extract individual colors from a palette as necessary. // The hue can be one of the standard values (500, A400, etc.), one of the three preconfigured // hues (default, lighter, darker), or any of the aforementioned prefixed with "-contrast". -// For example a hue of "darker-contrast" gives a light color to contrast with a "darker" hue +// For example a hue of "darker-contrast" gives a light color to contrast with a "darker" hue. +// Note that quotes are needed when using a numeric hue with the "-contrast" modifier. // Available color palettes: https://www.google.com/design/spec/style/color.html .candy-carousel { background-color: mat-color($candy-app-primary); border-color: mat-color($candy-app-accent, A400); - color: mat-color($candy-app-primary, darker); + color: mat-color($candy-app-primary, '100-contrast'); } ```