initial commit

2024-06-14 18:06:25 +01:00
commit e707f95288
150 changed files with 11018 additions and 0 deletions
@@ -0,0 +1,111 @@
+import { useState } from "react";
+import { Button, FloatLabelInput } from "..";
+// import { Link } from "react-router-dom";
+
+type FormType = {
+  email: string;
+  password: string;
+};
+
+type HandleChange = {
+  name: string;
+  value: string;
+};
+
+export default function Login() {
+  let [formDetails, setFormDetails] = useState<FormType>({
+    email: "",
+    password: "",
+  });
+
+  const handleFormChange = ({
+    target: { name, value },
+  }: {
+    target: HandleChange;
+  }): any => {
+    setFormDetails((prev) => ({ ...prev, [name]: value }));
+  };
+
+  return (
+    <div className={`w-full overflow-y-auto bg-top bg-cover`}>
+      <div className="w-full flex justify-center">
+        <div className="w-4/5 md:max-w-[570px]">
+          <div className="bg-white w-full rounded-2xl border-2 border-black">
+            <div className="w-full p-5 sm:p-10 lg:p-20 flex flex-col justify-between items-center">
+              <div className="mb-4">
+                <h1 className="text-2xl text-center font-bold leading-3 tracking-wide text-black dark:text-black">
+                    Enter OTP
+                </h1>
+                <p className="text-xl mt-4 text-center font-medium text-black dark:text-black">
+                  Please enter verification code sent to you
+                </p>
+              </div>
+
+              <div className="w-full sm:w-4/5">
+                {/* INPUTS */}
+                <div className="w-full flex justify-between gap-8">
+                  <div className="relative my-2 py-2">
+                    <FloatLabelInput
+                      id="email"
+                      name="email"
+                      type="email"
+                    //   placeHolder="Email"
+                    //   labelName="Email"
+                      value={formDetails.email}
+                      inputClass=""
+                      onChange={handleFormChange}
+                    />
+                  </div>
+                  <div className="relative my-2 py-2">
+                    <FloatLabelInput
+                      id="password"
+                      name="password"
+                      type="password"
+                    //   placeHolder="Password"
+                    //   labelName="Password"
+                      value={formDetails.password}
+                      inputClass=""
+                      onChange={handleFormChange}
+                    />
+                  </div>
+                  <div className="relative my-2 py-2">
+                    <FloatLabelInput
+                      id="password"
+                      name="password"
+                      type="password"
+                    //   placeHolder="Password"
+                    //   labelName="Password"
+                      value={formDetails.password}
+                      inputClass=""
+                      onChange={handleFormChange}
+                    />
+                  </div>
+                  <div className="relative my-2 py-2">
+                    <FloatLabelInput
+                      id="password"
+                      name="password"
+                      type="password"
+                    //   placeHolder="Password"
+                    //   labelName="Password"
+                      value={formDetails.password}
+                      inputClass=""
+                      onChange={handleFormChange}
+                    />
+                  </div>
+                </div>
+
+                <div className="mt-10 w-full">
+                  <Button
+                    text="Enter"
+                    className="rounded-md w-full text-xl capitalize font-bold"
+                  />
+                  {/* <Link to='#' className='text-black text-sm'>Forget your password?</Link> */}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}