Fix Upload Design Styling

GenerateNU · Dec 8, 2023 · 911ca35 · 911ca35
1 parent 914aac4
commit 911ca35
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/frontend/src/components/Upload/BottomNavOptions.tsx b/frontend/src/components/Upload/BottomNavOptions.tsx
@@ -1,5 +1,6 @@
 import { Box } from '@mui/material';
 import StyledButton from '../Button/Button';
+import router from '../../router';
 
 export type BottomNavProps = {
     cancel: () => void,
@@ -15,14 +16,19 @@ export default function BottomNavOptions({
     enabled
 }: BottomNavProps) {
     if (step === 6 || step === 7) return null;
+
+    const returnHome = () => {
+        router.navigate({ to: '/jobs' })
+    }
+
     return (
         <Box className='flex flex-row justify-center gap-x-6 mt-6 mb-8'>
             {step !== 8 ?
                 <>
                     <StyledButton
                         color={'primary'}
                         size={'md'}
-                        onClick={cancel}
+                        onClick={step === 1 ? returnHome : cancel}
                     >
                         Cancel
                     </StyledButton>

diff --git a/frontend/src/components/Upload/UploadFlowComponents/Checkout.tsx b/frontend/src/components/Upload/UploadFlowComponents/Checkout.tsx
@@ -48,7 +48,7 @@ export default function Checkout({states, setters}: CheckoutProps) {
     console.log(JSON.stringify(options));
 
     return (
-        <div className="mt-32">
+        <div className="">
             <div id="checkout">
                 {clientSecret && (
                     <EmbeddedCheckoutProvider

diff --git a/frontend/src/components/Upload/VoxetiStepper.tsx b/frontend/src/components/Upload/VoxetiStepper.tsx
@@ -41,7 +41,7 @@ export default function VoxetiStepper({currentStep}: StepperProps) {
             alternativeLabel
             activeStep={currentStep}
             connector={<VoxetiConnector />}
-            className='mb-16'
+            className='mb-16 !mt-20'
         >
             {steps.map((label) => (
                 <Step key={label}>