Design polish from feedback:
- Playlist cards are now a "stack of clips" cover: the first video's thumbnail
fills a 16:9 tile with two offset/rotated layers peeking behind it (::before/
::after). A themed gradient scrim (accent-strong→accent→clear, via color-mix)
darkens the base so the title sits BOLD and WHITE over the cover instead of
small grey text underneath. Video count moved to a pill in the top-right.
channelPlaylists.js resolves the cover from the app's active videos
(buildVideoAddressPointer → video.thumbnail), falling back to playlist.image.
- Back button on the playlist view: was a bare "← Back to channel" text link, now
a proper .btn-ghost (sm) pill with a chevron icon — matches the site's buttons
and is theme-aware.
- tokens.css: added --size-4px/--size-5px for the stack offsets (token lint).
Scrim/title use --color-white (always light — the scrim is always dark
regardless of theme). Lint + build clean.
Co-Authored-By: Claude Opus 4.8 <[email protected]>
Fixes two rough edges from first use:
- The "Add to playlist" dialog blocked on the relay publish before closing, so it
felt stuck / "didn't close, just reset". Now it closes IMMEDIATELY on Save and
publishes in the background; the result comes back as a toast (optimistic, like
the feed insert). No more waiting on the relay round-trip with the modal open.
- After adding/creating a playlist you had to hard-refresh to see it. The picker
now dispatches `bitvid:playlists-changed`, and channelPlaylists.js listens for
it (matching the current channel) and re-fetches — immediately and again after
~2s to cover relay propagation lag — so the section updates on its own.
Syntax + lint + build clean.
Co-Authored-By: Claude Opus 4.8 <[email protected]>
- constants.js: FEATURE_PLAYLISTS (default OFF) so nothing is user-visible until
the whole playlist UI ships; flip to preview on unstable.
- js/channelPlaylists.js: wireChannelPlaylists(pubkey) fetches the creator's
playlists (facade) and renders a responsive row of cards (thumbnail + video
count + title) linking to `#view=playlist&pubkey=…&id=…`. Hidden when the flag
is off, no playlists, or the container is missing; a nav-token guards against a
stale fetch resolving after a channel switch. DOM built with textContent (no
innerHTML). Kept out of the 5729-line-capped channelProfile.js.
- channelProfile.js: one-line wireChannelPlaylists(currentChannelHex) hook next
to wireChannelZapTotal (no-op while the flag is off).
- views/channel-profile.html: #channelPlaylistsSection above the video grid.
- tailwind.source.css: .playlist-grid / .playlist-card* (token-only; responsive
via @apply like .bv-grid-video).
Lint + build clean. The playlist view the cards link to lands next.
Co-Authored-By: Claude Opus 4.8 <[email protected]>
