From 6ad4493f4284729699091d132ec43fd76f4b24e1 Mon Sep 17 00:00:00 2001
From: Eero Holmala <eero.holmala@hotmail.com>
Date: Sat, 1 Jun 2024 11:49:50 +0300
Subject: [PATCH] Frontend: Add some additional navbar style

---
 .../src/components/ui/navbar.tsx              | 40 +++++++++++--------
 1 file changed, 24 insertions(+), 16 deletions(-)

diff --git a/wretched-machines-frontend/src/components/ui/navbar.tsx b/wretched-machines-frontend/src/components/ui/navbar.tsx
index 92c98e0..7dd5f57 100644
--- a/wretched-machines-frontend/src/components/ui/navbar.tsx
+++ b/wretched-machines-frontend/src/components/ui/navbar.tsx
@@ -1,24 +1,32 @@
 import Link from "next/link";
 import { cn } from "@/lib/utils"
 
+
+const Break = ()=> <hr className={cn("w-100")}></hr>
+
 const Navbar = () => {
     return (
-        <div className={cn("flex h-20 bg-gray-800 text-white justify-around opacity-100 items-center")}>
-            <Link href="/">
-                <div>Home</div>
-            </Link>
-            <Link href="/blog">
-                <div>Blog</div>
-            </Link>
-            <Link href="/tools">
-                <div>Tools</div>
-            </Link>
-            <Link href="/demos">
-                <div>Demos</div>
-            </Link>
-            <Link href="/login">
-                <div>Login</div>
-            </Link>
+        <div className={cn("bg-gray-800 pt-1 pb-1")}>
+            <Break/>
+            <div className={cn("flex h-20 bg-gray-800 text-white justify-around opacity-100 items-center")}>
+                <Link href="/">
+                    <div>Home</div>
+                </Link>
+                <Link href="/blog">
+                    <div>Blog</div>
+                </Link>
+                <Link href="/tools">
+                    <div>Tools</div>
+                </Link>
+                <Link href="/demos">
+                    <div>Demos</div>
+                </Link>
+                <Link href="/login">
+                    <div>Login</div>
+                </Link>
+                <br></br>
+            </div>
+            <Break/>
         </div>
     );
 }