Web: Most Played horizontal tiles + nav centering + Library link + Search refinements #67

2026-06-01T21:05:57-04:00

bvandeusen commented

2026-06-01 21:05:57 -04:00

Iteration on top of the prior Home polish, all operator-driven.

CompactTrackCard rewritten as a horizontal row — cover thumb left, title + artist right. w-72 matches Android's CompactTrackTile at 176 dp. Most Played's chunked-rows-in-shared-scroller layout now reads identically across the two clients.
Rediscover reverted to w-40 albums / w-36 artists — the prior session shrunk these mistakenly; the operator's "compact like the app" intent was for Most Played, not Rediscover.
Shell header → 3-column grid. The previous flex justify-center nav drifted off page-center whenever the right side (search + user menu) was wider than the left (wordmark). grid-cols-3 pins each column to a fixed lane so the nav is truly window-centered.
Library nav link → /library/artists directly. Linking to /library (which 308-redirects via +page.server.ts) reportedly didn't navigate; the direct link skips the redirect roundtrip. matchPrefix='/library' keeps isActive matching every Library tab so the active state still covers all sub-pages.
SearchInput refresh — placeholder shortened from "Search artists, albums, tracks…" to "Search", with a Lucide Search icon inset on the left of the input. pl-7 to clear the icon.

Test updates: Shell asserts on the new Library href; AlbumCard year-line assertions were already updated earlier this session.

CI green on 185b8fa9 (run 161).

Iteration on top of the prior Home polish, all operator-driven. - **CompactTrackCard rewritten as a horizontal row** — cover thumb left, title + artist right. `w-72` matches Android's `CompactTrackTile` at 176 dp. Most Played's chunked-rows-in-shared-scroller layout now reads identically across the two clients. - **Rediscover reverted** to `w-40` albums / `w-36` artists — the prior session shrunk these mistakenly; the operator's "compact like the app" intent was for Most Played, not Rediscover. - **Shell header → 3-column grid.** The previous `flex justify-center` nav drifted off page-center whenever the right side (search + user menu) was wider than the left (wordmark). `grid-cols-3` pins each column to a fixed lane so the nav is truly window-centered. - **Library nav link → `/library/artists`** directly. Linking to `/library` (which 308-redirects via `+page.server.ts`) reportedly didn't navigate; the direct link skips the redirect roundtrip. `matchPrefix='/library'` keeps `isActive` matching every Library tab so the active state still covers all sub-pages. - **SearchInput refresh** — placeholder shortened from "Search artists, albums, tracks…" to "Search", with a Lucide `Search` icon inset on the left of the input. `pl-7` to clear the icon. Test updates: Shell asserts on the new Library href; AlbumCard year-line assertions were already updated earlier this session. CI green on `185b8fa9` (run 161).

bvandeusen added 3 commits 2026-06-01 21:05:57 -04:00

feat(web): Most Played horizontal compact tiles + revert Rediscover

test-web / test (push) Successful in 32s

Details

c0d5d6aebf

Operator clarification: the 'compact like the app' request was for
Most Played, not Rediscover.

- CompactTrackCard rewritten as a horizontal Row: cover thumbnail
  left, title + artist column right. w-72 (~288 px) matches the
  Android CompactTrackTile's 176 dp visual weight. Most Played's
  existing chunked-rows-in-shared-scroller layout now reads like
  the Android multi-row LazyHorizontalGrid.
- Rediscover steps back from the compact w-32/w-28 widths to w-40/
  w-36 (the pre-PR-#66 sizes) — the size hierarchy still works
  with the regular AlbumCard treatment.

fix(web): center nav in window + Library link + Search placeholder

test-web / test (push) Failing after 31s

Details

27f1cefd55

Three operator-reported issues:

- Header was flex with the nav inside a flex-1 span — when the
  right side (search + user menu) grew wider than the left
  (wordmark), the nav's centered position drifted off page-center.
  Switched to grid-cols-3 with justify-self-{start,center,end} so
  the middle column pins to true window-center regardless of side
  widths.
- Library nav link pointed to /library, which 308-redirects via
  +page.server.ts. Operator reported it didn't navigate. Linked the
  nav button directly to /library/artists so SPA navigation skips
  the redirect roundtrip. matchPrefix='/library' keeps isActive
  matching every Library tab.
- SearchInput placeholder was 'Search artists, albums, tracks…' —
  shortened to 'Search' and added a Lucide Search icon inside the
  input on the left. Padding adjusted (pl-7) so the input text
  clears the icon.

test(web): Shell Library link asserts /library/artists

test-web / test (push) Successful in 33s

Details

185b8fa9b5

bvandeusen merged commit 09471a8f5c into main

2026-06-01 21:06:03 -04:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: bvandeusen/minstrel#67