diff --git a/src/OnboardingSPA/components/Loaders/ImageUpload/stylesheet.scss b/src/OnboardingSPA/components/Loaders/ImageUpload/stylesheet.scss index 8147ea413..e877b9585 100644 --- a/src/OnboardingSPA/components/Loaders/ImageUpload/stylesheet.scss +++ b/src/OnboardingSPA/components/Loaders/ImageUpload/stylesheet.scss @@ -13,7 +13,7 @@ height: 100%; position: absolute; border-radius: 50px; - background: linear-gradient(45deg, #b6b5ff, #ff9797); + background: linear-gradient(45deg, var(--nfd-onboarding-loader-start), var(--nfd-onboarding-loader-end)); left: -100%; } } diff --git a/src/OnboardingSPA/styles/_branding.scss b/src/OnboardingSPA/styles/_branding.scss index a2586b4fb..b420b3766 100644 --- a/src/OnboardingSPA/styles/_branding.scss +++ b/src/OnboardingSPA/styles/_branding.scss @@ -27,6 +27,8 @@ body { --nfd-onboarding-border: 219, 219, 219; --nfd-onboarding-drawer-icon-fill: var(--nfd-onboarding-tertiary); --nfd-onboarding-drawer-icon-active-fill: var(--nfd-onboarding-light); + --nfd-onboarding-loader-start: var(--nfd-onboarding-primary); + --nfd-onboarding-loader-end: var(--nfd-onboarding-tertiary); --nfd-onboarding-step-loader-icon: url("../../Brands/bluehost/step-loader-logo.svg"); --nfd-onboarding-step-error-icon: url("../../Brands/bluehost/step-error-logo.svg"); } @@ -57,6 +59,8 @@ body { --nfd-onboarding-border: 245, 246, 248; --nfd-onboarding-drawer-icon-fill: var(--nfd-onboarding-tertiary); --nfd-onboarding-drawer-icon-active-fill: var(--nfd-onboarding-light); + --nfd-onboarding-loader-start: var(--nfd-onboarding-primary); + --nfd-onboarding-loader-end: var(--nfd-onboarding-tertiary); } &.nfd-brand-webcom { @@ -85,5 +89,7 @@ body { --nfd-onboarding-border: 219, 219, 219; --nfd-onboarding-drawer-icon-fill: var(--nfd-onboarding-tertiary-alt); --nfd-onboarding-drawer-icon-active-fill: var(--nfd-onboarding-tertiary-alt); + --nfd-onboarding-loader-start: var(--nfd-onboarding-primary); + --nfd-onboarding-loader-end: var(--nfd-onboarding-tertiary); } }