Files
blog-admin/src/layout/index.tsx
2026-07-22 17:50:30 +08:00

33 lines
1.0 KiB
TypeScript

import { Outlet } from '@tanstack/react-router'
import { SidebarInset, SidebarProvider } from '@/components/ui/sidebar'
import { useNavigationProgress } from '@/hooks/use-navigation-progress'
import { AppHeader } from './components/app-header.tsx'
import { AppSidebar } from './components/app-sidebar'
export default function Layout({ children }: { children?: React.ReactNode }) {
useNavigationProgress()
return (
<SidebarProvider
style={
{
'--sidebar-width': '14rem',
'--sidebar': '#ffffff',
} as React.CSSProperties
}
>
<AppSidebar />
<SidebarInset className='h-svh h-screen min-w-0'>
<AppHeader />
<div className='flex-1 overflow-y-auto min-h-0 p-4 bg-[#f5f5f5] flex flex-col'>
<div className='bg-white rounded-md p-6 flex-1 shadow-[0_1px_2px_0_rgba(0,0,0,0.03),0_1px_6px_-1px_rgba(0,0,0,0.02),0_2px_4px_0_rgba(0,0,0,0.02)]'>
{children ?? <Outlet />}
</div>
</div>
</SidebarInset>
</SidebarProvider>
)
}