feat: global navigation progress bar

Most data routes run their load with ssr = false, so SvelteKit holds the
previous page on screen while the next one's data resolves — with no
feedback. NavProgress, mounted once in the root layout and driven by the
$navigating store, shows a thin top bar that trickles while a navigation is
pending and fades out on completion. Degrades to a static visible bar under
prefers-reduced-motion. New --z-nav-progress token sits above the fixed
header but below modals/toasts.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
MechaCat02
2026-07-06 19:38:14 +02:00
parent 34c1122e4e
commit 09f12c8959
8 changed files with 278 additions and 3 deletions

View File

@@ -95,6 +95,9 @@
--z-dropdown: 10;
--z-sticky: 50;
/* Above the fixed header/app-bar (--z-sticky) so the nav progress bar
is never occluded, but below modals and toasts. */
--z-nav-progress: 60;
--z-modal: 100;
--z-toast: 1000;
}