diff --git a/src/pages/seller-onboarding/components/hero-stepper/hero-stepper.module.scss b/src/pages/seller-onboarding/components/hero-stepper/hero-stepper.module.scss
index 65b642fb..5c71be2c 100644
--- a/src/pages/seller-onboarding/components/hero-stepper/hero-stepper.module.scss
+++ b/src/pages/seller-onboarding/components/hero-stepper/hero-stepper.module.scss
@@ -17,6 +17,28 @@
margin-top: 64px;
gap: 32px;
+ div {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ .steps {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ gap: 16px;
+ height: 32px;
+ width: 32px;
+
+ border: 2px solid var(--blue-principal-000052);
+ border-radius: 50%;
+
+ p {
+ font-size: 1.125rem;
+ font-weight: 700;
+ }
+ }
+ }
+
h1 {
color: var(--blue-principal-000052);
margin-bottom: 16px;
diff --git a/src/pages/seller-onboarding/components/hero-stepper/index.tsx b/src/pages/seller-onboarding/components/hero-stepper/index.tsx
index 3ef743a6..d6f89b59 100644
--- a/src/pages/seller-onboarding/components/hero-stepper/index.tsx
+++ b/src/pages/seller-onboarding/components/hero-stepper/index.tsx
@@ -12,8 +12,8 @@ const SellerOnboardingHeroStepper: React.FC = () => {
return (
-
- {steps.map((label) => (
+
+ {steps.map((label, i) => (
@@ -23,15 +23,18 @@ const SellerOnboardingHeroStepper: React.FC = () => {
+ {/*
1
*/}
Apply to shop and start earning today
Sign up now and see why over 600,000 shoppers choose Instacart for flexible earnings.
+ {/*
2
*/}
Apply to shop and start earning today
Sign up now and see why over 600,000 shoppers choose Instacart for flexible earnings.
+ {/*
3
*/}
Apply to shop and start earning today
Sign up now and see why over 600,000 shoppers choose Instacart for flexible earnings.
diff --git a/src/pages/seller-onboarding/components/seller-onboarding-hero/hero.module.scss b/src/pages/seller-onboarding/components/seller-onboarding-hero/hero.module.scss
index adb43c6c..28792f9c 100644
--- a/src/pages/seller-onboarding/components/seller-onboarding-hero/hero.module.scss
+++ b/src/pages/seller-onboarding/components/seller-onboarding-hero/hero.module.scss
@@ -2,7 +2,7 @@
display: grid;
grid-template-columns: 53.5% 41%;
gap: 0px 32px;
- height: 480px;
+ min-height: 500px;
.hero_content {
display: flex;
@@ -14,7 +14,7 @@
h1 {
margin-top: 32px;
- font-size: 4.5vw;
+ font-size: 2.8vw;
line-height: 1.2;
color: var(--blue-principal-000052);
}
@@ -29,7 +29,7 @@
background-image: url('../../../../../public/assets/hero/heroOnboarding.svg');
background-repeat: no-repeat;
background-position: center;
- background-size: 100%;
+ background-size: 80%;
object-fit: cover;
}
}
diff --git a/src/pages/seller-onboarding/components/seller-onboarding-hero/index.tsx b/src/pages/seller-onboarding/components/seller-onboarding-hero/index.tsx
index eda487a8..2e69eecc 100644
--- a/src/pages/seller-onboarding/components/seller-onboarding-hero/index.tsx
+++ b/src/pages/seller-onboarding/components/seller-onboarding-hero/index.tsx
@@ -70,7 +70,7 @@ const {
diff --git a/tests/units/src/components/footer/__snapshots__/index.unit.spec.tsx.snap b/tests/units/src/components/footer/__snapshots__/index.unit.spec.tsx.snap
index e91d29db..a707db7e 100644
--- a/tests/units/src/components/footer/__snapshots__/index.unit.spec.tsx.snap
+++ b/tests/units/src/components/footer/__snapshots__/index.unit.spec.tsx.snap
@@ -5,286 +5,253 @@ exports[`Footer should render the the footer with default data 1`] = `