Merge pull request #427 from newfold-labs/PRESS2-1574-ui-fixes

ui fixes
newfold-labs · Jan 25, 2024 · 8ef143f · 8ef143f
2 parents cc905da + 907c2d0
commit 8ef143f
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 10 deletions.
diff --git a/src/OnboardingSPA/components/Button/NextButtonSiteGen/index.js b/src/OnboardingSPA/components/Button/NextButtonSiteGen/index.js
@@ -37,7 +37,8 @@ const NextButtonSiteGen = ( {
 				}
 			} }
 		>
-			{ text }
+			<p className="nfd-onboarding-button--site-gen-next--text">{ text }</p>
+
 			{ showChevronRight && (
 				<Icon
 					className={ 'nfd-onboarding-button--site-gen-next--icon' }

diff --git a/src/OnboardingSPA/components/Button/NextButtonSiteGen/stylesheet.scss b/src/OnboardingSPA/components/Button/NextButtonSiteGen/stylesheet.scss
@@ -31,6 +31,14 @@
 				color: var(--nfd-onboarding-secondary);
 			}
 		}
+
+		&--disabled &--text {
+			opacity: 0.5;
+		}
+
+		&--disabled &--icon {
+			opacity: 0.5;
+		}
 	}
 
 	&--icon {

diff --git a/src/OnboardingSPA/components/HeadingWithSubHeading/SiteGen/stylesheet.scss b/src/OnboardingSPA/components/HeadingWithSubHeading/SiteGen/stylesheet.scss
@@ -10,7 +10,7 @@
 			font-weight: 300;
 			text-align: center;
 			color: var(--nfd-onboarding-primary);
-			margin: 35px !important;
+			margin: 35px 35px 15px 35px !important;
 			font-size: 30px;
 		}
 

diff --git a/src/OnboardingSPA/components/ImageUploader/components/ImageUploaderWithText/stylesheet.scss b/src/OnboardingSPA/components/ImageUploader/components/ImageUploaderWithText/stylesheet.scss
@@ -106,7 +106,7 @@
 					flex-direction: column;
 					justify-content: center;
 					margin-left: 18px;
-					max-width: 27vw;
+					max-width: 26vw;
 
 					@media (max-width: #{ ($break-large) }) {
 						width: 60vw;

diff --git a/src/OnboardingSPA/components/StartOptions/stylesheet.scss b/src/OnboardingSPA/components/StartOptions/stylesheet.scss
@@ -47,13 +47,16 @@
 			}
 
 			&__span {
-				background-color: var(--nfd-onboarding-white);
-				color: rgb(6, 0, 0);
+				background-color: var(--nfd-onboarding-primary);
+				color: var(--nfd-onboarding-secondary);
 				padding-right: 6px;
 				padding-left: 5px;
 				margin-right: 5px;
-				border: 1px solid #fff;
+				border: 1px solid var(--nfd-onboarding-primary);
 				border-radius: 8px;
+				font-size: clamp(15px, 17px, 19px);
+				padding-top: 3px;
+				padding-bottom: 2px;
 			}
 		}
 
@@ -84,7 +87,7 @@
 				font-weight: 510;
 				text-align: center;
 				font-size: 14px;
-				line-height: 16.71px;
+				margin-top: 0;
 			}
 		}
 	}

diff --git a/src/OnboardingSPA/steps/SiteGen/SiteLogo/stylesheet.scss b/src/OnboardingSPA/steps/SiteGen/SiteLogo/stylesheet.scss
@@ -18,10 +18,10 @@
 				&__buttons {
 					width: 99%;
 					display: flex;
-					padding: 16px;
 					flex-direction: row;
 					align-items: center;
 					justify-content: flex-end;
+					margin-top: 20px;
 
 					&__skip {
 						font-size: clamp(0.6rem, 0.755rem + 0.227vw, 1.3rem);

diff --git a/src/OnboardingSPA/steps/SiteGen/SocialMedia/stylesheet.scss b/src/OnboardingSPA/steps/SiteGen/SocialMedia/stylesheet.scss
@@ -14,7 +14,7 @@
 					display: flex;
 					align-items: center;
 					justify-content: flex-end;
-					padding: 16px;
+					margin-top: 20px;
 
 					&__skip {
 						font-size: clamp(0.6rem, 0.755rem + 0.227vw, 1.3rem);

diff --git a/src/OnboardingSPA/styles/_branding.scss b/src/OnboardingSPA/styles/_branding.scss
@@ -327,7 +327,7 @@ body {
 		--nfd-onboarding-progress-bar-fill: #0060f0;
 		--nfd-onboarding-progress-bar-background: #d5d5d5;
 		--nfd-onboarding-site-logo-on-drag: rgba(53, 59, 64, 0.3);
-		--nfd-onboarding-navigation-back-background: rgba(54, 62, 68, 0.35);
+		--nfd-onboarding-navigation-back-background: rgba(212, 212, 212, 0.35);
 		--nfd-onboarding-site-logo-border: var(--nfd-onboarding-primary);
 		--nfd-onboarding-header-border: rgba(var(--nfd-onboarding-primary-rgb), 0.3);
 		--nfd-onboarding-card-overlay: rgba(0, 0, 0, 0.4);