Add function Navbar

Michael-Liendo · Jul 18, 2024 · bbfee86 · bbfee86
1 parent 04c7225
commit bbfee86
Showing 1 changed file with 29 additions and 2 deletions.
diff --git a/client/src/pages/home.tsx b/client/src/pages/home.tsx
@@ -1,7 +1,34 @@
 export default function Home() {
+  return (
+    <Navbar />
+  )
+}
+
+function Navbar() {
   return (
     <>
-      <h1 className="text-black text-4xl">Home</h1>
+      <nav className="p-4 border-b-2 border-blue-500">
+        <div className="container mx-auto flex justify-between items-center">
+          <div className="text-slate-950 text-2xl font-bold">Linx</div>
+          <ul className="flex space-x-4">
+            <li>
+              <a href="#product" className="text-slate-950 hover:text-blue-700">
+                Product
+              </a>
+            </li>
+            <li>
+              <a href="#login" className="text-slate-950 hover:text-blue-700">
+                Login
+              </a>
+            </li>
+            <li>
+              <a href="#signup" className="text-slate-950 hover:text-blue-700">
+                Sign Up
+              </a>
+            </li>
+          </ul>
+        </div>
+      </nav>
     </>
   );
-}
+}