5f88c56113
Phase 1:
- S0: Fix open redirect (safeNavigate), delete AuthContext/legacy auth, encrypt API keys, gitignore .env files
- S1: Split client.ts god object into 5 modules, unify toast system, delete unused Sidebar
- S2: Add glass button variant, migrate 32 z-index to SUMI tokens, fix card dark mode
- S3: Skip nav link, aria-hidden on icons, focus-visible ring fixes, alt attrs, aria-live regions
- S4: React.memo on list items, fix key={index}, loading=lazy on images
- S5: Branded loading screen, page transitions respect reduced-motion, LikeButton micro-interaction, i18n sidebar/header
Phase 2 Sprint 6:
- Wire Tailwind shadow utilities to SUMI tokens in @theme block (fixes 50+ files)
- Define shadow-card/shadow-card-hover tokens
- Remove dark:shadow-none workarounds from card.tsx (SUMI handles per-theme shadows)
Co-authored-by: Cursor <cursoragent@cursor.com>
58 lines
1.8 KiB
TypeScript
58 lines
1.8 KiB
TypeScript
import { ReactNode, useEffect } from 'react';
|
|
import { AnimatePresence } from 'framer-motion';
|
|
import { useLocation } from 'react-router-dom';
|
|
import { Header } from './Header';
|
|
import { Sidebar } from './Sidebar';
|
|
import { MobileBottomNav } from './MobileBottomNav';
|
|
import { PageTransition } from './PageTransition';
|
|
import { useUIStore } from '@/stores/ui';
|
|
import { cn } from '@/lib/utils';
|
|
import { AstralBackground } from '../ui/AstralBackground';
|
|
import { NavigationProgress } from '../ui/NavigationProgress';
|
|
import { ScrollToTop } from '../ui/ScrollToTop';
|
|
|
|
interface LayoutProps {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export function Layout({ children }: LayoutProps) {
|
|
const { sidebarOpen } = useUIStore();
|
|
const { pathname } = useLocation();
|
|
|
|
// Scroll to top on route change
|
|
useEffect(() => {
|
|
window.scrollTo(0, 0);
|
|
}, [pathname]);
|
|
|
|
return (
|
|
<div className="min-h-screen bg-background text-foreground relative overflow-x-hidden">
|
|
<NavigationProgress />
|
|
<AstralBackground />
|
|
|
|
<Header />
|
|
|
|
<div className="flex relative z-10 transition-all duration-[var(--sumi-duration-slow)]">
|
|
<Sidebar />
|
|
|
|
<main
|
|
id="main-content"
|
|
className={cn(
|
|
'flex-1 min-h-layout-main transition-all duration-[var(--sumi-duration-normal)] ease-[var(--sumi-ease-in-out)] pb-20 lg:pb-0',
|
|
sidebarOpen ? 'lg:ml-main-expanded' : 'lg:ml-main-collapsed max-lg:ml-0',
|
|
)}
|
|
>
|
|
<div className="max-w-layout-content mx-auto p-4 sm:p-6 lg:p-8">
|
|
<AnimatePresence mode="wait">
|
|
<PageTransition>
|
|
{children}
|
|
</PageTransition>
|
|
</AnimatePresence>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
|
|
<MobileBottomNav />
|
|
<ScrollToTop />
|
|
</div>
|
|
);
|
|
}
|