diff --git a/src/assets/images/test1-reverse.png b/src/assets/images/test1-reverse.png
new file mode 100644
index 0000000..f26dbde
Binary files /dev/null and b/src/assets/images/test1-reverse.png differ
diff --git a/src/components/Footer/BottomFooterOne.tsx b/src/components/Footer/BottomFooterOne.tsx
index 2819d90..2babfea 100644
--- a/src/components/Footer/BottomFooterOne.tsx
+++ b/src/components/Footer/BottomFooterOne.tsx
@@ -62,7 +62,7 @@ const CustomerLinks = () => {
)
);
return (
-
+
{links}
);
diff --git a/src/components/Header/HeaderMenuItem.tsx b/src/components/Header/HeaderMenuItem.tsx
index 2cd44b3..498eaea 100644
--- a/src/components/Header/HeaderMenuItem.tsx
+++ b/src/components/Header/HeaderMenuItem.tsx
@@ -14,13 +14,15 @@ const HeaderMenuItem: React.FC
= ({ item }) => {
return (
{item.name}
{showSubMenu && item.subItems && (
-
+
{item.subItems.map((subItem, index) => (
))}
diff --git a/src/components/LetsGetStated/LetsGetStarted.tsx b/src/components/LetsGetStated/LetsGetStarted.tsx
new file mode 100644
index 0000000..b3f0144
--- /dev/null
+++ b/src/components/LetsGetStated/LetsGetStarted.tsx
@@ -0,0 +1,102 @@
+import React from "react";
+import { InputCompOne } from "..";
+
+const LetsGetStarted: React.FC = () => {
+ const [pinValues, setPinValues] = React.useState({
+ bvn: "",
+ otp: "",
+ });
+
+ const [hideOTPComponent, setHideOTPComponent] = React.useState(true);
+ const inputRef = React.useRef(null);
+
+ const handleChange = (e: React.ChangeEvent) => {
+ let { name, value } = e.target as HTMLInputElement;
+
+ setPinValues((prev) => ({ ...prev, [name]: value }));
+ };
+
+ const handleInput = (e: React.FormEvent) => {
+ let { name, value } = e.target as HTMLInputElement;
+
+ if (name === "bvn") {
+ const regex = /^[0-9]+$/;
+
+ if (regex.test(value)) {
+ if (value?.length == 10) {
+ setHideOTPComponent(false);
+ } else setHideOTPComponent(true);
+ } else {
+ console.log("object not found");
+ }
+ }
+ };
+
+ return (
+
+
+
+
+ Let’s Get You Started
+
+
+
+
+
+ );
+};
+
+export default LetsGetStarted;
diff --git a/src/components/LetsGetStated/LetsGetStartedNav.tsx b/src/components/LetsGetStated/LetsGetStartedNav.tsx
new file mode 100644
index 0000000..e4116f6
--- /dev/null
+++ b/src/components/LetsGetStated/LetsGetStartedNav.tsx
@@ -0,0 +1,22 @@
+import React from "react";
+import { Link } from "react-router-dom";
+import Logo from "../../assets/icons/logo.svg";
+
+
+const LetsGetStartedNav: React.FC = () => {
+ return (
+
+
+
+

+
+
+
+ );
+};
+
+export default LetsGetStartedNav;
diff --git a/src/components/LetsGetStated/index.ts b/src/components/LetsGetStated/index.ts
new file mode 100644
index 0000000..35c2c03
--- /dev/null
+++ b/src/components/LetsGetStated/index.ts
@@ -0,0 +1,4 @@
+import LetsGetStarted from "./LetsGetStarted";
+import LetsGetStartedNav from "./LetsGetStartedNav";
+
+export { LetsGetStarted, LetsGetStartedNav };
diff --git a/src/components/index.ts b/src/components/index.ts
index 8423231..50e7f51 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -7,4 +7,5 @@ export * from "./DashboardLayout";
export * from "./Icons";
export * from "./Dashboard";
export * from "./Cards";
+export * from "./LetsGetStated";
export * from "./TsAndCs";
diff --git a/src/components/shared/InputCompOne.tsx b/src/components/shared/InputCompOne.tsx
index eba689e..bec215e 100644
--- a/src/components/shared/InputCompOne.tsx
+++ b/src/components/shared/InputCompOne.tsx
@@ -21,6 +21,7 @@ export interface InputCompOneProps {
parentInputClass?: string;
selectClass?: string;
parentSelectClass?: string;
+ parentClass?: string;
}
const InputCompOne = forwardRef(
@@ -45,11 +46,12 @@ const InputCompOne = forwardRef(
parentInputClass,
selectClass,
parentSelectClass,
+ parentClass,
},
forwardedRef
) => {
return (
-
+
{label && (