Merge pull request #168 from newfold-labs/enhance/inherit-brand-var-i…

…mageuploader-component

use branding variables in image uploader loading state gradient

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%;
 		}
 	}

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);
 	}
 }