- Replace monolithic React SPA (App.tsx) with 7 Astro pages (+ routing) - Implement full design system from design/ (OKLCH tokens, Tailwind 4 @theme) - Add 12 Astro components (Button, Badge, Card, Sidebar, Header, states) - Add 11 React islands (AuthGuard, MessageFeed, VoiceControls, AudioVisualizer, etc.) - Add 3 Zustand stores (UI, voice, message state) - Add CSS architecture: dark/light themes, glassmorphism, fluid typography, animations - Add 404, login, settings, recordings pages - Remove 40+ legacy React SPA files - Add Particles background and MascotChat deferred islands - Wire WebSocket bridge for real-time messages and voice events Build: 7 pages in ~900ms Typecheck: clean (0 errors) Lint: clean (0 errors)
28 lines
1.1 KiB
Plaintext
28 lines
1.1 KiB
Plaintext
---
|
|
// ─── settings.astro — Dashboard Settings page ─────────────────────────────
|
|
// Appearance settings: theme selection (dark/light/system).
|
|
// ────────────────────────────────────────────────────────────────────────────
|
|
import BaseLayout from "../layouts/BaseLayout.astro";
|
|
import Sidebar from "../components/sidebar/Sidebar.astro";
|
|
import Header from "../components/header/Header.astro";
|
|
import Card from "../components/ui/Card.astro";
|
|
import ThemeToggle from "../islands/ThemeToggle";
|
|
import SettingsForm from "../islands/SettingsForm";
|
|
---
|
|
|
|
<BaseLayout>
|
|
<div class="flex min-h-screen">
|
|
<Sidebar currentPath={Astro.url.pathname} />
|
|
<div class="ml-64 flex flex-1 flex-col">
|
|
<Header title="Settings">
|
|
<ThemeToggle slot="actions" client:load />
|
|
</Header>
|
|
<main class="flex-1 p-6">
|
|
<Card class="max-w-2xl">
|
|
<SettingsForm client:idle />
|
|
</Card>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</BaseLayout>
|