Added Classes and CSS

newfold-labs · Jan 4, 2023 · 76f8631 · 76f8631
1 parent 3bd9abd
commit 76f8631
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js b/src/OnboardingSPA/pages/Steps/Ecommerce/StepAddress/index.js
@@ -148,9 +148,8 @@ const StepAddress = () => {
 									'wp-module-onboarding'
 								)}
 							/>
-							{settings === null && <p>Loading your details...</p>}
 						</div>
-						<div className='store-address-form'>
+							<div className={`store-address-form ${settings ? 'store-address-form--visible' : 'store-address-form--blank'}`}>
 							<div data-name='country'>
 								<label aria-required>
 									{__('Where is your store based?', 'wp-module-onboarding')}

diff --git a/src/OnboardingSPA/pages/Steps/Ecommerce/stylesheet.scss b/src/OnboardingSPA/pages/Steps/Ecommerce/stylesheet.scss
@@ -101,6 +101,14 @@
 				width: 100%;
 			}
 		}
+
+		&--visible {
+			animation: fadeIn 500ms ease-in;
+		}
+
+		&--blank {
+			opacity: 0;
+		}
 	}
 }