Spaces:
Sleeping
Sleeping
| import { Outlet } from 'react-router-dom'; | |
| import { Sidebar } from './Sidebar'; | |
| import { Header } from './Header'; | |
| import { useState } from 'react'; | |
| import { useIsMobile } from '@/hooks/use-mobile'; | |
| import { cn } from '@/lib/utils'; | |
| export function MainLayout() { | |
| const [mobileMenuOpen, setMobileMenuOpen] = useState(false); | |
| const isMobile = useIsMobile(); | |
| return ( | |
| <div className="min-h-screen bg-background"> | |
| <Sidebar | |
| mobileOpen={mobileMenuOpen} | |
| onMobileClose={() => setMobileMenuOpen(false)} | |
| /> | |
| <div className={cn( | |
| 'transition-all duration-300', | |
| isMobile ? 'pl-0' : 'pl-64' | |
| )}> | |
| <Header onMobileMenuOpen={() => setMobileMenuOpen(true)} /> | |
| <main className="p-4 md:p-6"> | |
| <Outlet /> | |
| </main> | |
| </div> | |
| </div> | |
| ); | |
| } | |