Added signup and register pages and links to them

src/components/TopNav.jsx

@@ -1,6 +1,6 @@
 import { Link } from "react-router-dom";
 import logo from "../assets/logo.png";
-import { motion } from "framer-motion"
+import { motion } from "framer-motion";
 
 import {
   FaBars,
@@ -16,8 +16,7 @@ import Logo from "./Logo";
 export default function TopNav() {
   const [showAll, setShowAll] = useState(false);
   const [SideNav, setSideNav] = useState(false);
-  const sideNav = useRef()
-
+  const sideNav = useRef();
 
   const listItems = [
     {
@@ -84,7 +83,7 @@ export default function TopNav() {
         </div>
         <div className="flex flex-col items-start justify-center headerHover">
           <p className="text-sm mdl:text-xs text-white mdl:text-gray-200 text-lightText font-light">
-            Hello, sign in
+            Hello, <Link className="text-green hover:text-sky_blue hover:underline cursor-pointer" to={"/signin"}>sign in</Link>
           </p>
           <p className="text-sm font-semibold -mt-1 text-white hidden mdl:inline-flex">
             Accounts & list{" "}

src/pages/Register/Register.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import { Link } from "react-router-dom";
 import logo from "../../assets/logo.png";
 import Logo from "../../components/Logo";
 
@@ -6,7 +7,7 @@ const Register = () => {
   return (
     <div className="w-full">
       <div className="w-[400px] mx-auto bg-gray-100 pb-2 my-9 border border-zinc-500">
-        <form>
+        <form onSubmit={(e)=>e.preventDefault()}>
           <div className="w-full p-3 flex justify-center text-white text-lg bg-darkBrown">
             <Logo />
           </div>
@@ -14,6 +15,7 @@ const Register = () => {
             <h3 className="w-full text-lg py-2 font-titleFont italic text-center">
               Register
             </h3>
+            <p className="text-sm w-full flex justify-center">Already have an account,&nbsp;<Link className="text-green hover:text-sky_blue hover:underline cursor-pointer" to={'/signin'}>sign-in</Link></p>
           </div>
           <div className="flex py-2">
             <div className="px-2 flex flex-col gap-2">

src/pages/Signin/Signin.jsx

@@ -1,13 +1,12 @@
 import React from "react";
 import { Link } from "react-router-dom";
-import logo from "../../assets/logo.png";
 import Logo from "../../components/Logo";
 
 const Signin = () => {
   return (
     <div className="w-full">
       <div className="w-[300px] mx-auto bg-gray-100 pb-2 my-9 border border-zinc-500">
-        <form>
+        <form onSubmit={(e)=>e.preventDefault()}>
           <div className="w-full p-3 flex justify-center text-white text-lg bg-darkBrown">
             <Logo />
           </div>