style: align all pages with CLAUDE.md design system

- Inputs: uniform padding (8px 12px), borderRadius 7, bg-inset background
- List rows/cards: bg-subtle background, border-subtle border (bg-inset was input-only)
- Invite/admin badge borders: use accent-border var instead of raw accent
- Section headers: 11px, weight 500, uppercase, 0.7px letter-spacing
- Notification/status banners: borderRadius 8
- Remove debug console.log statements from SettingsPage avatar upload flow

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Mistral Vibe
2026-04-01 09:52:06 +02:00
parent 7677677e7b
commit 6dc191585c
6 changed files with 55 additions and 78 deletions

View File

@@ -104,14 +104,14 @@ export function SessionPage() {
value={labelInput}
onChange={(e) => setLabelInput(e.target.value)}
placeholder="e.g. pre-gig warmup"
style={{ width: "100%", padding: "7px 10px", background: "var(--bg-inset)", border: "1px solid var(--border)", borderRadius: 6, color: "var(--text)", fontSize: 13, boxSizing: "border-box", marginBottom: 10 }}
style={{ width: "100%", padding: "8px 12px", background: "var(--bg-inset)", border: "1px solid var(--border)", borderRadius: 7, color: "var(--text)", fontSize: 13, boxSizing: "border-box", marginBottom: 10 }}
/>
<label style={{ display: "block", color: "var(--text-muted)", fontSize: 11, marginBottom: 4 }}>NOTES</label>
<textarea
value={notesInput}
onChange={(e) => setNotesInput(e.target.value)}
rows={3}
style={{ width: "100%", padding: "7px 10px", background: "var(--bg-inset)", border: "1px solid var(--border)", borderRadius: 6, color: "var(--text)", fontSize: 13, boxSizing: "border-box", resize: "vertical", fontFamily: "inherit" }}
style={{ width: "100%", padding: "8px 12px", background: "var(--bg-inset)", border: "1px solid var(--border)", borderRadius: 7, color: "var(--text)", fontSize: 13, boxSizing: "border-box", resize: "vertical", fontFamily: "inherit" }}
/>
<div style={{ display: "flex", gap: 8, marginTop: 10 }}>
<button
@@ -139,8 +139,8 @@ export function SessionPage() {
key={song.id}
to={`/bands/${bandId}/songs/${song.id}`}
style={{
background: "var(--bg-inset)",
border: "1px solid var(--border)",
background: "var(--bg-subtle)",
border: "1px solid var(--border-subtle)",
borderRadius: 8,
padding: "14px 18px",
textDecoration: "none",