Feat: Mobile responsiveness improvements (sidebar, calendar)

src/app/dashboard/layout.tsx

@@ -1,15 +1,22 @@
+'use client'
+
 import { MainNav } from "@/components/main-nav"
 import { UserNav } from "@/components/user-nav"
-import { Building } from "lucide-react"
+import { Building, Menu } from "lucide-react"
+import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet"
+import { Button } from "@/components/ui/button"
+import { useState } from "react"
 
 export default function DashboardLayout({
     children,
 }: {
     children: React.ReactNode
 }) {
+    const [isMobileOpen, setIsMobileOpen] = useState(false)
+
     return (
         <div className="flex min-h-screen bg-gray-50/50 dark:bg-gray-900/50">
-            {/* Sidebar */}
+            {/* Desktop Sidebar */}
             <aside className="hidden md:flex w-72 flex-col fixed inset-y-0 z-50 bg-white dark:bg-gray-950 border-r shadow-sm">
                 <MainNav />
             </aside>
@@ -17,10 +24,23 @@ export default function DashboardLayout({
             {/* Main Content */}
             <div className="flex-1 md:ml-72 flex flex-col min-h-screen">
                 {/* Header */}
-                <header className="sticky top-0 z-40 h-16 glass border-b px-6 flex items-center justify-between">
-                    <div className="md:hidden flex items-center font-bold text-xl">
-                        <Building className="mr-2 h-6 w-6 text-primary" />
-                        WeddingOS
+                <header className="sticky top-0 z-40 h-16 glass border-b px-4 md:px-6 flex items-center justify-between">
+                    <div className="flex items-center gap-2 md:hidden">
+                        <Sheet open={isMobileOpen} onOpenChange={setIsMobileOpen}>
+                            <SheetTrigger asChild>
+                                <Button variant="ghost" size="icon" className="md:hidden">
+                                    <Menu className="h-6 w-6" />
+                                    <span className="sr-only">Menüyü aç</span>
+                                </Button>
+                            </SheetTrigger>
+                            <SheetContent side="left" className="p-0 w-72">
+                                <MainNav onNavClick={() => setIsMobileOpen(false)} />
+                            </SheetContent>
+                        </Sheet>
+                        <div className="flex items-center font-bold text-lg">
+                            <Building className="mr-2 h-5 w-5 text-primary" />
+                            WeddingOS
+                        </div>
                     </div>
 
                     <div className="ml-auto flex items-center space-x-4">
@@ -29,7 +49,7 @@ export default function DashboardLayout({
                 </header>
 
                 {/* Page Content */}
-                <main className="flex-1 p-6 md:p-8 overflow-y-auto">
+                <main className="flex-1 p-4 md:p-8 overflow-y-auto overflow-x-hidden">
                     <div className="max-w-7xl mx-auto animate-in fade-in slide-in-from-bottom-4 duration-500">
                         {children}
                     </div>