Updated layout

src/app/(main)/layout.tsx

@@ -1,3 +1,4 @@
+import { ThemeSwitcher } from "@/components/theme-switcher"
 import { Button } from "@/components/ui/button"
 import { Settings } from "lucide-react"
 import Link from "next/link"
@@ -6,15 +7,20 @@ import { ReactNode } from "react"
 export default function RootLayout({ children }: Readonly<{ children: ReactNode }>) {
     return (
         <>
-            <nav className="flex items-center justify-between px-6 py-4 border-b">
-                <Link href="/">
-                    <span className="font-semibold text-lg">Hypixel Stats</span>
-                </Link>
-                <Button variant="ghost" size="icon" aria-label="Settings">
-                    <Settings className="h-5 w-5" />
-                </Button>
-            </nav>
-            <div>
+            <header className="fixed w-screen bg-background/50 backdrop-blur-sm">
+                <nav className="flex justify-between items-center px-6 border-b h-header">
+                    <Link href="/">
+                        <span className="text-lg font-semibold">Hypixel Stats</span>
+                    </Link>
+                    <div className="flex items-center">
+                        <ThemeSwitcher />
+                        <Button variant="ghost" size="icon" aria-label="Settings">
+                            <Settings className="w-5 h-5" />
+                        </Button>
+                    </div>
+                </nav>
+            </header>
+            <div className="pt-header">
                 {children}
             </div>
         </>