syntaxbullet/AuroraBot-discord
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(dash): Revamp dashboard UI with glassmorphism and real bot data

Browse Source
This commit is contained in:
syntaxbullet
2026-01-08 20:58:57 +01:00
parent 8ebaf7b4ee
commit fff90804c0
14 changed files with 376 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
web/src/layouts/DashboardLayout.tsx
View File

@@ -7,21 +7,28 @@ import { Separator } from "../components/ui/separator";
export function DashboardLayout() {
return (
<SidebarProvider>
<div className="fixed inset-0 -z-10 overflow-hidden pointer-events-none">
<div className="absolute top-[-10%] left-[-10%] w-[40%] h-[40%] bg-primary/20 blur-[120px] rounded-full animate-pulse" />
<div className="absolute bottom-[-10%] right-[-10%] w-[30%] h-[30%] bg-purple-500/10 blur-[100px] rounded-full" />
</div>
<AppSidebar />
<SidebarInset>
<header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
<SidebarTrigger className="-ml-1" />
<Separator orientation="vertical" className="mr-2 h-4" />
<div className="flex items-center gap-2 px-4">
{/* Breadcrumbs could go here */}
<h1 className="text-lg font-semibold">Dashboard</h1>
<SidebarInset className="bg-transparent">
<header className="flex h-16 shrink-0 items-center gap-2 px-6 backdrop-blur-md bg-background/30 border-b border-white/5 sticky top-0 z-10">
<SidebarTrigger className="-ml-1 hover:bg-white/5 transition-colors" />
<Separator orientation="vertical" className="mx-4 h-4 bg-white/10" />
<div className="flex items-center gap-2">
<h1 className="text-lg font-semibold tracking-tight text-glow">Dashboard</h1>
</div>
<div className="ml-auto flex items-center gap-4">
<div className="h-2 w-2 rounded-full bg-emerald-500 shadow-[0_0_10px_rgba(16,185,129,0.5)]" />
</div>
</header>
<div className="flex flex-1 flex-col gap-4 p-4 pt-0">
<div className="min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min p-4">
<main className="flex flex-1 flex-col gap-6 p-6">
<div className="flex-1 rounded-2xl md:min-h-min">
<Outlet />
</div>
</div>
</main>
</SidebarInset>
</SidebarProvider>
);