89db580ca4
Covers: app layout, initiatives list, initiative detail (4 tabs), agents page, inbox, settings (health + projects), and all dialogs.
69 lines
3.4 KiB
Markdown
69 lines
3.4 KiB
Markdown
# App Layout
|
|
|
|
Global shell wrapping all pages. Fixed header with navigation, scrollable content area.
|
|
|
|
```
|
|
+============================================================================+
|
|
| CODEWALK DISTRICT |
|
|
|----------------------------------------------------------------------------|
|
|
| [ Initiatives ] [ Agents ] [ Inbox ] [ Settings ] |
|
|
+============================================================================+
|
|
| |
|
|
| max-w-7xl padded content |
|
|
| |
|
|
| <Page Outlet> |
|
|
| |
|
|
| |
|
|
| |
|
|
| |
|
|
| |
|
|
| |
|
|
| |
|
|
| |
|
|
+============================================================================+
|
|
```
|
|
|
|
## Header Bar (56px, sticky, backdrop-blur)
|
|
|
|
```
|
|
+============================================================================+
|
|
| [logo] Codewalk District |
|
|
| |
|
|
| [Initiatives] [Agents] [Inbox] [Settings] |
|
|
| ^^^^^^^^^^ |
|
|
| bg-muted when active |
|
|
+============================================================================+
|
|
```
|
|
|
|
- Logo links to `/initiatives`
|
|
- Active tab gets `bg-muted` highlight
|
|
- Tabs are horizontal links below the wordmark
|
|
|
|
## Error States
|
|
|
|
### 404 Page
|
|
```
|
|
+============================================================================+
|
|
| CODEWALK DISTRICT |
|
|
| [ Initiatives ] [ Agents ] [ Inbox ] [ Settings ] |
|
|
+============================================================================+
|
|
| |
|
|
| |
|
|
| (!) Page not found |
|
|
| |
|
|
| [ Back to Dashboard ] |
|
|
| |
|
|
| |
|
|
+============================================================================+
|
|
```
|
|
|
|
## Components
|
|
|
|
- `<Toaster>` (sonner) renders globally for toast notifications (bottom-right)
|
|
- `<ErrorBoundary>` wraps the outlet
|
|
|
|
## Source
|
|
|
|
- `packages/web/src/layouts/AppLayout.tsx`
|
|
- `packages/web/src/routes/__root.tsx`
|