Header + Footer ready for deployment

2026-06-07 20:38:24 +02:00 · 2026-04-10 01:27:02 +02:00
parent 5941df3c39
commit 63d5cf743a
24 changed files with 136 additions and 2813 deletions
@@ -0,0 +1,53 @@
+import Aku from "../assets/images/aku.png";
+
+export default function Header() {
+    const navItems = [
+        {
+            label: "Nextcloud",
+            url: "https://aramjonghu.nl/nextcloud",
+        },
+        {
+            label: "Navidrome",
+            url: "https://music.aramjonghu.nl",
+        },
+        {
+            label: "Forgejo Git",
+            url: "https://git.aramjonghu.nl",
+        },
+        {
+            label: "Stream",
+            url: "https://stream.aramjonghu.nl",
+        },
+        {
+            label: "SearXNG",
+            url: "https://xng.aramjonghu.nl",
+        },
+    ];
+
+    const goHome = () => {
+        window.location.href = "/";
+    };
+
+    return (
+        <header className="flex items-center px-12 py-6 gap-6">
+            <img
+                className="size-16 cursor-pointer"
+                src={Aku}
+                alt="Home"
+                onClick={goHome}
+            />
+
+            <nav className="flex flex-wrap gap-3 items-center">
+                {navItems.map((item) => (
+                    <a
+                        key={item.label}
+                        href={item.url}
+                        className="text-ctp-text hover:text-ctp-green-900 border rounded border-ctp-white-800 hover:border-ctp-green-900 cursor-pointer px-3 py-1 transition-colors"
+                    >
+                        {item.label}
+                    </a>
+                ))}
+            </nav>
+        </header>
+    );
+}