37 lines
996 B
TypeScript
37 lines
996 B
TypeScript
import { ReactNode } from 'react';
|
|
import { Header } from './Header';
|
|
import { Sidebar } from './Sidebar';
|
|
import { useUIStore } from '@/stores/ui';
|
|
import { cn } from '@/lib/utils';
|
|
import { AstralBackground } from '../ui/AstralBackground';
|
|
|
|
interface LayoutProps {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export function Layout({ children }: LayoutProps) {
|
|
const { sidebarOpen } = useUIStore();
|
|
|
|
return (
|
|
<div className="min-h-screen bg-kodo-void text-kodo-text-main relative overflow-x-hidden">
|
|
<AstralBackground />
|
|
|
|
<Header />
|
|
|
|
<div className="flex relative z-10 transition-all duration-500">
|
|
<Sidebar />
|
|
|
|
<main
|
|
className={cn(
|
|
'flex-1 min-h-layout-main transition-all duration-300 ease-in-out',
|
|
sidebarOpen ? 'lg:ml-64' : 'ml-0',
|
|
)}
|
|
>
|
|
<div className="max-w-layout-content mx-auto p-4 sm:p-6 lg:p-8 animate-fadeIn">
|
|
{children}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|