35 lines
1.2 KiB
TypeScript
35 lines
1.2 KiB
TypeScript
import { FC, ReactElement, useState } from 'react';
|
|
import { Outlet } from 'react-router';
|
|
import { Sidebar } from '../../components/sidebar';
|
|
|
|
const DashboardLayout: FC = (): ReactElement => {
|
|
const [sidebarOpen, setSidebarOpen] = useState(false);
|
|
|
|
return (
|
|
<div className="flex min-h-screen bg-gray-50">
|
|
<Sidebar isOpen={sidebarOpen} onClose={() => setSidebarOpen(false)} />
|
|
|
|
<div className="flex-1 flex flex-col overflow-auto">
|
|
{/* Mobile Header with Hamburger */}
|
|
<div className="lg:hidden bg-white border-b px-4 py-3 flex items-center">
|
|
<button
|
|
onClick={() => setSidebarOpen(true)}
|
|
className="p-2 rounded-lg hover:bg-gray-100 transition-colors"
|
|
>
|
|
<svg className="w-6 h-6 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
</button>
|
|
<h1 className="ml-3 text-lg font-bold text-gray-900">🏆 Hackathon</h1>
|
|
</div>
|
|
|
|
<main className="flex-1 overflow-auto">
|
|
<Outlet />
|
|
</main>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default DashboardLayout;
|