fix review page spacing

calblueprint · Dec 13, 2024 · c8b45a4 · c8b45a4
1 parent 0179ea1
commit c8b45a4
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 20 deletions.
diff --git a/app/onboarding/page.tsx b/app/onboarding/page.tsx
@@ -28,7 +28,7 @@ const stateOptions: DropdownOption<string>[] = [
 
 const gardenTypeOptions: DropdownOption<UserTypeEnum>[] = [
   { label: 'Individual', value: 'INDIV' },
-  { label: 'Community', value: 'ORG' },
+  { label: 'Community/Organization', value: 'ORG' },
   { label: 'School', value: 'SCHOOL' },
 ];
 
@@ -228,20 +228,18 @@ const ReviewPage = ({
 
   return (
     <OnboardingContainer>
-      <Flex $direction="column" $justify="start">
+      <div style={{ width: '100%', display: 'flex', flexDirection: 'column' }}>
         <ProgressBar progress={100} />
-        <QuestionDiv>
-          <H3
-            $color={COLORS.shrub}
-            style={{
-              textAlign: 'center',
-              marginTop: '90px',
-              marginBottom: '40px',
-            }}
-          >
-            Review & Submit
-          </H3>
-        </QuestionDiv>
+        <H3
+          $color={COLORS.shrub}
+          style={{
+            textAlign: 'center',
+            marginTop: '90px',
+            marginBottom: '40px',
+          }}
+        >
+          Review & Submit
+        </H3>
         <ContentContainer>
           <P1 style={{ color: COLORS.shrub, marginBottom: '16px' }}>
             Your Responses
@@ -265,12 +263,11 @@ const ReviewPage = ({
             options={plotOptions}
             onChange={value => setSelectedPlot(value === true)} // Convert the value as needed
           />
-          <div style={{ height: '12.625rem' }} />
-          <BigButton color={COLORS.shrub} onClick={handleSubmit}>
-            Let&apos;s Start Growing !
-          </BigButton>
         </ContentContainer>
-      </Flex>
+      </div>
+      <BigButton color={COLORS.shrub} onClick={handleSubmit}>
+        Let&apos;s Start Growing!
+      </BigButton>
     </OnboardingContainer>
   );
 };

diff --git a/app/onboarding/styles.ts b/app/onboarding/styles.ts
@@ -27,7 +27,7 @@ export const ContentContainer = styled.div`
 export const QuestionDiv = styled.div`
   display: flex;
   flex-direction: column;
-  min-height: 60px;
+  height: max(60px, max-content);
   align-items: center;
   justify-content: end;
   align-content: center;

diff --git a/components/Buttons.tsx b/components/Buttons.tsx
@@ -18,6 +18,7 @@ export const BigButton = styled.button<ButtonProps>`
   width: 100%;
   height: 3rem;
   max-height: 3rem;
+  font-family: inherit;
 `;
 
 export const Button = styled.button<ButtonProps>`