diff --git a/src/App.css b/src/App.css index 90517c2..0fc9006 100644 --- a/src/App.css +++ b/src/App.css @@ -1,5 +1,5 @@ .btn-primary { - background: #5A2C82; + background: #5A2C82 !important; color: #FFFFFF; display: block; text-decoration: none; @@ -8,7 +8,7 @@ } .btn-active { - background: #D10056; + background: #D10056 !important; } .btn-R { diff --git a/src/components/GetStarted/BasicInfo.tsx b/src/components/GetStarted/BasicInfo.tsx index 5151404..93c335e 100644 --- a/src/components/GetStarted/BasicInfo.tsx +++ b/src/components/GetStarted/BasicInfo.tsx @@ -1,5 +1,5 @@ import React, { useRef, useState } from "react"; -import InputSection from "./InputSection"; +import InputDetails from "./IntroDetails"; import OTPSection from "./OtpSection"; import SpouseDetails from "./SpouseDetails"; import { Button } from ".."; @@ -65,7 +65,7 @@ const BasicInfo: React.FC = ({ Let’s Get You Started
- { + return ( + <> +
+

+ EMPLOYMENT DETAILS +

+
+ +
+ +
+ + +
+
+ + +
+
+ + +
+ +
+ + ); +}; + +export default EmploymentDetails; diff --git a/src/components/GetStarted/GetStarted.tsx b/src/components/GetStarted/GetStarted.tsx index 3aaf3b7..93d248f 100644 --- a/src/components/GetStarted/GetStarted.tsx +++ b/src/components/GetStarted/GetStarted.tsx @@ -1,5 +1,7 @@ import React from "react"; import BasicInfo from "./BasicInfo"; +import YourAreAlmostThere from "./YourAreAlmostThere"; +import LoanAmountComp from "./LoanAmountComp"; const GetStarted = () => { const [step, setStep] = React.useState(1); @@ -38,7 +40,8 @@ const GetStarted = () => { handleNextStep={handleNextStep} /> )} - {step === 2 && "lol"} + {step === 2 && } + {step === 3 && } diff --git a/src/components/GetStarted/InputSection.tsx b/src/components/GetStarted/IntroDetails.tsx similarity index 100% rename from src/components/GetStarted/InputSection.tsx rename to src/components/GetStarted/IntroDetails.tsx diff --git a/src/components/GetStarted/LoanAmountComp.tsx b/src/components/GetStarted/LoanAmountComp.tsx new file mode 100644 index 0000000..a283dbb --- /dev/null +++ b/src/components/GetStarted/LoanAmountComp.tsx @@ -0,0 +1,41 @@ +import React from "react"; +import { InputCompOne } from ".."; + +const LoanAmountComp = () => { + return ( + <> +
+

+ Loan Amount +

+
+

+ For more enquiries and support +

+

+ Call: 09099000000 +

+

+ Email: fcmbloan@support.com +

+
+
+
+ + +
+
+ + ); +}; + +export default LoanAmountComp; diff --git a/src/components/GetStarted/ReferenceDetails.tsx b/src/components/GetStarted/ReferenceDetails.tsx new file mode 100644 index 0000000..9987185 --- /dev/null +++ b/src/components/GetStarted/ReferenceDetails.tsx @@ -0,0 +1,126 @@ +import React from "react"; +import { InputCompOne } from ".."; + +const ReferenceDetails: React.FC = () => { + return ( + <> +
+

+ REFERENCE DETAILS ( Must be 18 years and above ) +

+
+
+
+
+
+ + +
+
+ + +
+ +
+
+
+ + +
+
+ + +
+ +
+
+
+ + ); +}; + +export default ReferenceDetails; diff --git a/src/components/GetStarted/YourAreAlmostThere.tsx b/src/components/GetStarted/YourAreAlmostThere.tsx new file mode 100644 index 0000000..ad540e9 --- /dev/null +++ b/src/components/GetStarted/YourAreAlmostThere.tsx @@ -0,0 +1,36 @@ +import React from "react"; +import { useNavigate } from "react-router-dom"; +import EmploymentDetails from "./EmploymentDetails"; +import ReferenceDetails from "./ReferenceDetails"; +import { Button } from ".."; + +interface YourAreAlmostThereProps { + handleNextStep: any; +} + +const YourAreAlmostThere: React.FC = ({ handleNextStep }) => { + const navigate = useNavigate(); + + const navigation = () => { + navigate(""); + }; + return ( + <> +

+ You’re almost there +

+ + + +