feat(ui): implement v2 three-panel layout
- Collapsible sidebar (68px icons / 230px expanded, toggle via logo) - LibraryPanel: sessions expand inline to show tracks, search + filter chips - PlayerPanel: extracted from SongPage, used as embeddable panel - BandPage: Library + Player side by side; song selection via ?song= URL param - SongPage: thin wrapper around PlayerPanel (kept for direct deep-links) - CSS palette updated to v2 violet/cyan/emerald scheme - Mobile (<900px): BandPage shows library or player, never both Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -16,23 +16,30 @@ input, textarea, button, select {
|
||||
|
||||
/* ── Design system (dark only — no light mode in v1) ─────────────────────── */
|
||||
:root {
|
||||
--bg: #0f0f12;
|
||||
/* v2 dark-space palette */
|
||||
--bg: #0c0e1a;
|
||||
--bg-card: #10131f;
|
||||
--bg-raised: #151828;
|
||||
--bg-hover: #1a1e30;
|
||||
--bg-subtle: rgba(255,255,255,0.025);
|
||||
--bg-inset: rgba(255,255,255,0.04);
|
||||
--border: rgba(255,255,255,0.08);
|
||||
--border-subtle: rgba(255,255,255,0.05);
|
||||
--text: #eeeef2;
|
||||
--text-muted: rgba(255,255,255,0.35);
|
||||
--text-subtle: rgba(255,255,255,0.22);
|
||||
--accent: #e8a22a;
|
||||
--accent-hover: #f0b740;
|
||||
--accent-bg: rgba(232,162,42,0.1);
|
||||
--accent-border: rgba(232,162,42,0.28);
|
||||
--accent-fg: #0f0f12;
|
||||
--teal: #4dba85;
|
||||
--teal-bg: rgba(61,200,120,0.1);
|
||||
--danger: #e07070;
|
||||
--danger-bg: rgba(220,80,80,0.1);
|
||||
--border: rgba(255,255,255,0.06);
|
||||
--border-bright: rgba(255,255,255,0.12);
|
||||
--border-subtle: rgba(255,255,255,0.04);
|
||||
--text: #e8e9f0;
|
||||
--text-muted: rgba(232,233,240,0.55);
|
||||
--text-subtle: rgba(232,233,240,0.28);
|
||||
/* Violet accent */
|
||||
--accent: #8b5cf6;
|
||||
--accent-light: #a78bfa;
|
||||
--accent-hover: #9f70f8;
|
||||
--accent-bg: rgba(139,92,246,0.12);
|
||||
--accent-border: rgba(139,92,246,0.3);
|
||||
--accent-fg: #ffffff;
|
||||
--teal: #34d399;
|
||||
--teal-bg: rgba(52,211,153,0.1);
|
||||
--danger: #f43f5e;
|
||||
--danger-bg: rgba(244,63,94,0.1);
|
||||
}
|
||||
|
||||
/* ── Responsive Layout ──────────────────────────────────────────────────── */
|
||||
|
||||
Reference in New Issue
Block a user