diff --git a/ui/components/path-simple/base/_deprecate.scss b/ui/components/path-simple/base/_deprecate.scss index 4283a0108a..687b798b79 100644 --- a/ui/components/path-simple/base/_deprecate.scss +++ b/ui/components/path-simple/base/_deprecate.scss @@ -1,13 +1,13 @@ // Copyright (c) 2015-present, salesforce.com, inc. All rights reserved // Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license -$legacy-color-background-path-incomplete: #e0e5ee; -$legacy-color-background-path-incomplete-hover: #d8dde6; -$legacy-color-background-path-complete: #51c983; -$legacy-color-background-path-complete-hover: #1f8956; -$legacy-color-background-path-current: #1172cf; -$legacy-color-background-path-current-hover: #0d61af; -$legacy-color-background-path-lost: #c23934; +$legacy-color-background-path-incomplete: #f3f3f3; +$legacy-color-background-path-incomplete-hover: #c9c9c9; +$legacy-color-background-path-complete: #3ba755; +$legacy-color-background-path-complete-hover: #2e844a; +$legacy-color-background-path-current: #014486; +$legacy-color-background-path-current-hover: #032d60; +$legacy-color-background-path-lost: #ea001e; .slds-path-coach { @include deprecate('4.0.0', 'Use .slds-path instead of .slds-path-coach') { @@ -70,18 +70,18 @@ $legacy-color-background-path-lost: #c23934; } .slds-is-current { - background-color: var(--slds-g-color-brand-base-50, #{$legacy-color-background-path-current}); + background-color: var(--slds-g-color-palette-blue-30, #{$legacy-color-background-path-current}); &:hover { - background-color: var(--slds-g-color-brand-base-40, #{$legacy-color-background-path-current-hover}); + background-color: var(--slds-g-color-palette-blue-20, #{$legacy-color-background-path-current-hover}); } + .slds-is-incomplete:before { - background-color: var(--slds-g-color-brand-base-50, #{$legacy-color-background-path-current}); + background-color: var(--slds-g-color-palette-blue-30, #{$legacy-color-background-path-current}); } &:hover + .slds-is-incomplete:before { - background-color: var(--slds-g-color-brand-base-40, #{$legacy-color-background-path-current-hover}); + background-color: var(--slds-g-color-palette-blue-20, #{$legacy-color-background-path-current-hover}); } } @@ -89,7 +89,7 @@ $legacy-color-background-path-lost: #c23934; background-color: var(--slds-g-color-neutral-base-95, #{$legacy-color-background-path-incomplete}); &:hover { - background-color: var(--slds-g-color-neutral-base-90, #{$legacy-color-background-path-incomplete-hover}); + background-color: var(--slds-g-color-neutral-base-80, #{$legacy-color-background-path-incomplete-hover}); } .slds-tabs_path__link, @@ -100,7 +100,7 @@ $legacy-color-background-path-lost: #c23934; .slds-is-lost, .slds-is-lost:hover { - background-color: var(--slds-g-color-error-base-40, #{$legacy-color-background-path-lost}); + background-color: var(--slds-g-color-error-base-50, #{$legacy-color-background-path-lost}); } // Lets make sure we have the right color when these steps are activated @@ -218,7 +218,7 @@ $legacy-color-background-path-lost: #c23934; &:hover + .slds-is-incomplete:before, &:hover + .slds-is-lost:before { - background-color: var(--slds-g-color-neutral-base-90, #{$legacy-color-background-path-incomplete-hover}); + background-color: var(--slds-g-color-neutral-base-80, #{$legacy-color-background-path-incomplete-hover}); } } } diff --git a/ui/components/path/tokens/background-color.yml b/ui/components/path/tokens/background-color.yml index b211692a19..bb627bb8a2 100644 --- a/ui/components/path/tokens/background-color.yml +++ b/ui/components/path/tokens/background-color.yml @@ -13,7 +13,7 @@ imports: props: COLOR_BACKGROUND_PATH_COMPLETE: - value: '{!PALETTE_GREEN_70}' + value: '{!PALETTE_GREEN_60}' comment: The background color for Salespath stages that are complete. COLOR_BACKGROUND_PATH_COMPLETE_HOVER: value: '{!PALETTE_GREEN_50}'