docs: add sanctum-web layout redesign spec
This commit is contained in:
parent
a2a7eb6cd7
commit
da3e655ffd
1 changed files with 62 additions and 0 deletions
|
|
@ -0,0 +1,62 @@
|
|||
# sanctum-web Layout Redesign
|
||||
|
||||
**Date:** 2026-04-22
|
||||
**Repo:** git.mithraic.cloud/ad3laid3/sanctum-web
|
||||
**Base:** stoatchat/for-web (Solid.js + Vite + TypeScript)
|
||||
|
||||
---
|
||||
|
||||
## Goal
|
||||
|
||||
Fork the Stoat web frontend and fix its layout proportions so the app feels native on desktop and works properly as a PWA. The message area should dominate the screen. Nothing in the API, auth, or business logic layer is changed.
|
||||
|
||||
---
|
||||
|
||||
## Layout
|
||||
|
||||
The root shell is rebuilt as a four-column CSS Grid:
|
||||
|
||||
```
|
||||
[server icons 65px] [channels 240px] [messages 1fr] [members 240px]
|
||||
```
|
||||
|
||||
| Panel | Width | Behaviour |
|
||||
|---|---|---|
|
||||
| Server icon sidebar | 65px fixed | Icon-only, scrollable, always visible |
|
||||
| Channel list | 240px default | User-resizable, collapsible |
|
||||
| Message area | fills remaining space (1fr) | Message list + pinned input at bottom |
|
||||
| Member list | 240px | Collapsible, hidden by default on narrow viewports |
|
||||
|
||||
---
|
||||
|
||||
## Scope
|
||||
|
||||
**Changed:**
|
||||
- Root layout shell component — CSS replaced with proper grid
|
||||
- Global CSS spacing/sizing tokens that cause proportion issues
|
||||
|
||||
**Not changed:**
|
||||
- API client
|
||||
- WebSocket layer
|
||||
- Auth flow
|
||||
- Message rendering components
|
||||
- Channel/server/member components
|
||||
- Any business logic
|
||||
|
||||
---
|
||||
|
||||
## Build & Deployment
|
||||
|
||||
- Repo: `git.mithraic.cloud/ad3laid3/sanctum-web`
|
||||
- CI: Forgejo Actions — `pnpm build` on push to `main`, rsync `dist/` to VPS
|
||||
- Serves at: `mithraic.space/app` (replaces current for-web output, no Caddy changes)
|
||||
- Sanctum desktop app picks up the new frontend automatically on next launch
|
||||
|
||||
---
|
||||
|
||||
## Out of Scope
|
||||
|
||||
- Tauri desktop wrapper (separate project, builds on this frontend)
|
||||
- Feature additions beyond layout fixes
|
||||
- Mobile/responsive breakpoints beyond basic collapse behaviour
|
||||
- Rebranding (keep existing Stoat/Revolt dark aesthetic)
|
||||
Loading…
Add table
Reference in a new issue