The rule after each shelf title used `after:bg-accent/60`. Tailwind 3
cannot put an opacity modifier on a `var()` colour, so it emitted nothing
for that class and the rule never showed. Tailwind 4 mixes the opacity
in with color-mix, so the rule appeared after the upgrade. Removed, so
the headers look as they did before.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Renovate's tailwindcss bump (PR #150) plus the migration it needs:
- Theme moves from tailwind.config.js into app.css as `@theme inline`,
mapping the same FabledSword tokens. tailwind.config.js is gone.
- PostCSS runs @tailwindcss/postcss; autoprefixer is dropped, since
Tailwind 4 prefixes through Lightning CSS.
- Class renames from @tailwindcss/upgrade 4.3.3, reviewed: outline-none
-> outline-hidden, focus-visible:outline -> outline-solid, shadow ->
shadow-sm, shadow-sm -> shadow-xs, flex-shrink-0 -> shrink-0. Bare
`rounded` stays: v4 keeps it at 0.25rem, as before.
- Three v3 preflight defaults kept in a base layer so nothing changes on
screen: gray-200 default border colour, gray-400 placeholder text and
the pointer cursor on buttons.
- The unused class-based dark variant is not carried over; no template
uses `dark:`.
Clears the five high and two moderate npm audit findings that came in
through Tailwind 3 (braces, chokidar, micromatch, fast-glob,
postcss-selector-parser).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
First wave of Home visual polish (UI tasks 78/79/81/85):
- CardActionCluster like/queue/menu cluster is now opacity-0 and fades
in on group-hover or focus-within. The group class moves from the
inner anchor to the outer card wrapper so the cluster (positioned
outside the anchor) participates in the same hover scope. PlaylistCard
refresh kebab gets the same treatment.
- AlbumCard drops the year line. Title plus artist is enough on Home
tiles; the album detail page still shows the year.
- HorizontalScrollRow h2 picks up a flex-baseline layout with a trailing
12-wide accent rule (after:bg-accent/60), so section headers read as
chapter breaks instead of identical plain text.
- AlbumCard art-wrap is shadow-sm by default and lifts to shadow-lg
plus ring-accent/40 on hover. Pairs with the existing
group-hover:scale-1.03 for a clean lift-on-mouseover feel.
- HorizontalScrollRow arrows bump 32px → 40px on coarse pointers
(touch screens) for finger-friendly hits; mouse pointers unchanged.
- AlphabeticalGrid divider letter is now <h3> so screen readers
announce it as a section heading. Margin reset to preserve layout.
- Modal overlay gets p-4 so max-w-md modals stay inside the safe
area at 375px viewport. Covers all routes that use the shared
<Modal> component (discover track-confirm, quarantine
typed-DELETE, users password-reset, etc.).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- AddToPlaylistMenu: anchor submenu bottom to parent bottom so it
grows upward (top-0 → bottom-0) — kebab row is usually near the
bottom of the track menu and the submenu kept extending off-screen.
- HorizontalScrollRow: scrollbar-width: none + ::-webkit-scrollbar
display:none. Page arrows already drive the scroll; the scrollbar
was just consuming vertical real estate.
Three coordinated polish changes:
1. PlayerBar cover bumps from h-20 (80px) to h-24 (96px) and the bar's
vertical padding tightens from py-4 to py-1.5. Bar height stays
~108px but the cover now fills ~89% of it (was ~74%) — reads as the
substantial primary content the operator wanted, not a thumbnail.
2. InfiniteScrollSentinel default rootMargin moves from 300px to 800px
so the next page fetches well before the user reaches the bottom of
the rendered set. Empirically that's ~3-4 rows of cards on a typical
library grid — loading feels seamless rather than catching up.
3. HorizontalScrollRow takes rows: T[][] instead of items: T[]. Multiple
rows of items now render inside one shared overflow-x-auto container,
so the rows scroll together as a single coupled section. Recently
added (2 album rows) and Most played (3 track rows) on the home page
now scroll as one unit. Rediscover keeps two separate scrollers
because its rows are different card types (square albums vs circular
artists) — coupling those would interleave shapes awkwardly. The
item snippet's second arg is now the global flat index so consumers
like CompactTrackCard (which needs sectionTracks + index for play
actions) work without per-row re-indexing.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Restructures HorizontalScrollRow so paired arrows sit in a flex header
beside an optional section title (instead of absolute-positioned at the
row's left/right edges). Adds margin-right: -1rem to the row so the
scroller's items extend to the viewport's right edge, escaping Shell's
p-4 padding. The header bar keeps its right gutter so titles align with
the rest of the page content.
Home page passes 'title' to the first row of each section; subsequent
rows in multi-row sections render arrow-only headers.
Reusable horizontally-scrolling row with left/right arrow buttons,
scroll-boundary disabling, snap scrolling, and hover-reveal arrows.
Used by M6a home page (Task 17).
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
bvandeusenandClaude Opus 5.5