Add animated glass background, breadcrumbs, and brand mark polish

Cards now sit on an animated signature-gradient background and use a
translucent, blurred bp-glass surface so it shines through; extended
bp-glass to every stat surface on the Stats page and to its tab switcher.
Adds a Breadcrumbs component below the header on all app pages.

Also: drop the gradient text fill from the wordmark/heading, animate the
BrandMark's heart and curve on the dashboard hero instead of a plain pulse
ring, recenter the heart/curve artwork in icon.svg and BrandMark, close the
mobile nav menu on link click, remove the redundant "back to recordings"
button, and match the "Start session"/"Scan for devices" button sizes.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-08-26 18:47:30 +02:00
co-authored by Claude Sonnet 5
parent 9e0380ec75
commit c46adf788f
14 changed files with 248 additions and 93 deletions
+5 -1
View File
@@ -1,10 +1,14 @@
import { NavBar } from "@/components/layout/NavBar";
import { Breadcrumbs } from "@/components/layout/Breadcrumbs";
export default function AppLayout({ children }: { children: React.ReactNode }) {
return (
<div className="min-h-dvh">
<NavBar />
<main className="mx-auto max-w-6xl px-4 py-8">{children}</main>
<main className="mx-auto max-w-6xl px-4 py-8">
<Breadcrumbs />
{children}
</main>
</div>
);
}