Files
ds-chat/frontend
ksmithandClaude Sonnet 5 f2046efeaf Fix --sp-5 references to a nonexistent spacing token (#46 follow-up)
The spacing scale (tokens.css) jumps from --sp-4 (1rem) to --sp-6
(1.5rem) -- there's no --sp-5. Three places referenced it anyway, so
those margin declarations were invalid at compute time and silently
resolved to 0:

- ThemeBuilderModal.css's .custom-theme-preview margin-bottom -- the bug
  the user actually noticed, as a ~0px gap between the preview mockup and
  the color fields below it that read as a visual overlap.
- Modal.css's .modal-divider -- a shorthand `margin: var(--sp-5) 0
  var(--sp-4)`, where one invalid value invalidates the whole
  declaration, so every <hr class="modal-divider"> (ProfileModal's
  section separators, etc.) has had zero margin on both sides.
- AdminPage.css's .admin-invite-list margin-bottom.

All three now use --sp-6, matching the spacing tier that was clearly
intended.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-08-17 13:20:32 -06:00
..

DS Chat frontend (Phase 1)

React + Vite PWA. Login, room list, and chat views wired to the backend's REST API and /ws/chat WebSocket endpoint. See ../README.md and ../backend/README.md for full local setup.

Dev

npm install
npm run dev

The dev server proxies /api and /ws to http://localhost:8000 (see vite.config.ts), so the backend must be running for anything beyond the login page to work.

Build

npm run build

Generates the PWA manifest and service worker via vite-plugin-pwa into dist/.

Layout

src/
  main.tsx, App.tsx        routes: /login, /rooms, /rooms/:roomId
  api/                       fetch wrappers (client, auth, rooms)
  ws/useChatSocket.ts          WebSocket hook (join/send/receive)
  context/AuthContext.tsx        current-user state, hydrated via GET /api/auth/me
  components/                      ProtectedRoute, RoomListItem, MessageList, MessageInput
  pages/                             LoginPage, RoomListPage, ChatRoomPage