diff --git a/packages/styles/scss/components/notification/_tokens.scss b/packages/styles/scss/components/notification/_tokens.scss index 4c560073b5a7..53bf96191c9a 100644 --- a/packages/styles/scss/components/notification/_tokens.scss +++ b/packages/styles/scss/components/notification/_tokens.scss @@ -84,30 +84,15 @@ $notification-background-info: ( ) !default; $notification-background-warning: ( - fallback: - color.mix( - map.get(notification.$color-map, yellow-30), - map.get(notification.$color-map, white-0), - 15% - ), + fallback: map.get(notification.$notification-background-warning, white-theme), values: ( ( theme: themes.$white, - value: - color.mix( - map.get(notification.$color-map, yellow-30), - map.get(notification.$color-map, white-0), - 15% - ), + value: map.get(notification.$notification-background-warning, white-theme), ), ( theme: themes.$g10, - value: - color.mix( - map.get(notification.$color-map, yellow-30), - map.get(notification.$color-map, white-0), - 15% - ), + value: map.get(notification.$notification-background-warning, g-10), ), ( theme: themes.$g90, diff --git a/packages/themes/src/component-tokens/notification/tokens.js b/packages/themes/src/component-tokens/notification/tokens.js index ccaf16094fdb..9527fc713217 100644 --- a/packages/themes/src/component-tokens/notification/tokens.js +++ b/packages/themes/src/component-tokens/notification/tokens.js @@ -4,7 +4,7 @@ import { gray90, green10, blue10, - yellow30, + yellow10, white0, } from '@carbon/colors'; import { @@ -50,14 +50,9 @@ export const notificationBackgroundInfo = { g100: gray90, }; -export const colorMap = { - yellow30, - white0, -}; - export const notificationBackgroundWarning = { - whiteTheme: colorMap, - g10: colorMap, + whiteTheme: yellow10, + g10: yellow10, g90: gray80, g100: gray90, };