From 626365668508790dee70ab192a7d6c6f14725bf4 Mon Sep 17 00:00:00 2001 From: Christophe Besson Date: Mon, 24 Aug 2026 21:51:18 +0200 Subject: fix(hub): give the Music flat list its own look instead of Videos' reskin MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Two complaints against real use: the artist -> album -> track hierarchy was invisible (every depth sat flush left, distinguishable only by which chevron happened to be open — Videos' own flat list never needed more than one level, so there was nothing to reuse for this), and a filled-in album unfolded into a wall of identical little icon-box squares, one per track, carrying no information a track row can actually use (unlike Videos' per-episode thumbnail). Track rows now reuse Mode A's own numbered tracklist style (.music-track-row: number, title, duration, no icon box) instead of Videos' boxy thumb-slot row. A folder's expanded contents get wrapped in a new .music-flat-children indent + rule line, so nesting reads as visible steps into the tree rather than same-level siblings. Folder rows (artist/album headers) still reuse Videos' flat-row style, which fits them fine — this is not a wholesale rewrite, only what didn't actually work. --- .../meshbay-hub/src/meshbay_hub/static/style.css | 31 +++++++++++++++++++--- 1 file changed, 28 insertions(+), 3 deletions(-) (limited to 'packages/meshbay-hub/src/meshbay_hub/static/style.css') diff --git a/packages/meshbay-hub/src/meshbay_hub/static/style.css b/packages/meshbay-hub/src/meshbay_hub/static/style.css index 42cfcf9..38c38c8 100644 --- a/packages/meshbay-hub/src/meshbay_hub/static/style.css +++ b/packages/meshbay-hub/src/meshbay_hub/static/style.css @@ -2690,9 +2690,13 @@ a.transfer-name { Reuses .video-overlay/.video-top-bar/.video-title/.video-close, .tb-btn/ .tb-search, .video-flat-list/.video-flat-row/.video-flat-info/ .video-flat-title/.video-flat-sub/.video-flat-folder/.video-flat-chevron - and .video-thumb-empty as-is — only what's genuinely different from - Videos (album art is square, not 2:3; there is a persistent player bar; - grouping is artist -> album, not movie/show) gets its own rule below. */ + and .video-thumb-empty as-is for a *folder* row (artist/album headers) — + that part of Videos' flat list genuinely fits. A *track* row does not: + it reuses .music-track-row (Mode A's own tracklist style) instead, and + the tree gets its own .music-flat-children for indent/nesting, which + Videos' single-level flat list never needed. Also genuinely different + from Videos: album art is square, not 2:3; there is a persistent player + bar; grouping is artist -> album, not movie/show. */ .music-artist-section { margin-bottom: 22px; } .music-artist-heading { @@ -2846,6 +2850,27 @@ a.transfer-name { border-radius: 4px; border: 1px solid var(--border); } +/* A folder's expanded contents — artist -> album -> track. Videos' own flat + list never needed this (one level, folders of episodes, no further + nesting) so there was nothing to reuse: every depth used to sit flush + left, indistinguishable from its parent except by which chevron happened + to be open. The rule line gives the eye a rail to follow down the tree; + it nests for free (each level wraps its own children in one more of + these), so an artist with a real album inside it reads as two visible + steps in, not one. */ +.music-flat-children { + margin-left: 12px; + padding-left: 12px; + border-left: 2px solid var(--border); + display: flex; + flex-direction: column; + gap: 2px; +} +/* A touch tighter vertically than Mode A's tracklist rows + (.music-track-row, reused as the base) — this one already sits behind + up to two levels of indent, so it gives a little of its own padding + back rather than compounding with the rail. */ +.music-flat-track { padding: 5px 8px; } /* ── Persistent player bar (docs/musicbay.md §2.3) ──────────────────────── `position: sticky`, not `fixed` — deliberately: CLAUDE.md's own history -- cgit v1.2.3