43 lines
1.5 KiB
TypeScript
43 lines
1.5 KiB
TypeScript
import Sidebar from "@/components/Home/Sidebar";
|
|
import TopBar from "@/components/Home/TopBar";
|
|
import { Card, CardContent } from "@/components/ui/card";
|
|
import { type FC } from "react";
|
|
import { Outlet } from "react-router";
|
|
|
|
const DashboardLayout: FC = () => {
|
|
return (
|
|
<div className="relative z-10 flex items-center justify-center min-h-screen">
|
|
<Card className="overflow-y-auto min-h-screen w-full min-w-full shadow-lg bg-white/85 dark:bg-black/85 backdrop-blur-md sm:rounded-none">
|
|
<div className="flex flex-col w-full h-full flex-1 items-center sm:pt-0 relative">
|
|
<div className="flex flex-row items-center absolute left-4 top-4">
|
|
<img src="/icon.png" alt="icon" className="w-6 h-6" />
|
|
|
|
<div className="ml-2">
|
|
<p className="text-sm text-gray-600 text-left dark:text-gray-500">
|
|
Home Guard
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<CardContent
|
|
className="w-full h-full max-h-full space-y-4 flex-1 bg-black/5 dark:bg-white/5"
|
|
spacing={false}
|
|
>
|
|
<div className="flex flex-row">
|
|
<Sidebar />
|
|
<div className="max-w-full flex-1 sm:max-h-screen overflow-y-auto">
|
|
<div className="flex flex-col w-full items-center gap-2">
|
|
<TopBar />
|
|
</div>
|
|
<Outlet />
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</div>
|
|
</Card>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default DashboardLayout;
|