UI changes #13

Merged

arne merged 7 commits from ui-changes into main 2026-06-28 22:32:08 +02:00

Conversation 0 Commits 7 Files changed 23 +2992 -304

arne commented 2026-06-28 22:32:01 +02:00

Owner

Copy link

Catalog admin UI pass — supersedes #10 (folds in the original ui-tweaks commits plus the status/cover work).

UI tweaks (original)

• Show-page styling fixes, /program promotion, landing widget, navbar pills, denser credits, iOS-safe copy.

Status-forward show page

• Cover header + at-a-glance status line; episodes become a tappable status list with a derived per-episode state (kladd → trenger render → klar); compact feed rows. Fixes a latent bug where an ungenerated feed showed "Generert 0001-01-01".

Episode page redesign

• Status header + Metadata/Master/Renderinger pipeline strip + inline section status; tightened spacing; profile name no longer monospace.

Per-episode cover art (ADR-0019)

• POST /program/{slug}/episode/{id}/image sharing one validate-and-store helper with show art (square 1400–3000px JPEG/PNG); item-level itunes:image/podcast:images in the feed with fallback to channel art; cover thumbnails in show rows. No show banner (no podcast app consumes one via RSS).

Testing

• go build, go vet, full go test ./... green in the dev shell. Cover upload, feed projection, and validation rejection verified over HTTP.

🤖 Generated with Claude Code

Catalog admin UI pass — supersedes #10 (folds in the original ui-tweaks commits plus the status/cover work). ## UI tweaks (original) - Show-page styling fixes, `/program` promotion, landing widget, navbar pills, denser credits, iOS-safe copy. ## Status-forward show page - Cover header + at-a-glance status line; episodes become a tappable status list with a derived per-episode state (kladd → trenger render → klar); compact feed rows. Fixes a latent bug where an ungenerated feed showed "Generert 0001-01-01". ## Episode page redesign - Status header + Metadata/Master/Renderinger pipeline strip + inline section status; tightened spacing; profile name no longer monospace. ## Per-episode cover art (ADR-0019) - `POST /program/{slug}/episode/{id}/image` sharing one validate-and-store helper with show art (square 1400–3000px JPEG/PNG); item-level `itunes:image`/`podcast:images` in the feed with fallback to channel art; cover thumbnails in show rows. No show banner (no podcast app consumes one via RSS). ## Testing - `go build`, `go vet`, full `go test ./...` green in the dev shell. Cover upload, feed projection, and validation rejection verified over HTTP. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

arne added 7 commits 2026-06-28 22:32:01 +02:00

katalog: UI tweaks on the show page (styling fixes) ... 164cf56b65

Four small fixes to the feed-generation show page, matching the
established design system:

- Explicit-content checkbox used class="row", but `label` is
  flex-direction:column and `.row` doesn't override it, so the box stacked
  above its text. Use the purpose-built `.check` class (row + centered).
- Feed cards set `--accent:var(--sky)` on a plain `.card`, which never
  reads `--accent` — the sky tint never rendered. Add `card--wash` to
  match the rendition-card pattern (partials.html), so the accent shows.
- Feed cards sat in a column-less `.grid` (one per row). Give the grid an
  auto-fit minmax template so platforms lay out side by side, stacking on
  narrow viewports.
- Cover-art thumbnail used a spacing token (`--s2`) for border-radius;
  switch to the radius token `--r-sm`.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

katalog: promote /program, landing widget, navbar pills, denser credits ... d9b3536812

URL structure:
- Move the program/episode admin from /katalog/program/* to top-level
  /program/* (routes, redirects, templates, tests). Auth unchanged:
  selectiveAuth already gates any non-public prefix.

Landing:
- Add a "Programmer" widget listing all shows, linking to each directly
  (best-effort; a store error just hides the list).

Navbar (global, via the head partial):
- Show the current show's title as a clickable pill (links back to the
  show); add a distinct grape pill for the episode title when in scope.
- Drop the now-redundant per-handler Tag wiring for show-scoped pages.

Templates:
- Drop heroes/breadcrumbs on show, episode, and "ny episode" pages; the
  navbar pills carry that context now.
- Move cover-art upload from the show page to the (edit-mode) program
  form; the show page now opens on the action buttons.
- Episode sections: drop the "N · " prefixes; rename "Renditioner" ->
  "Renderinger" (display text only).

Credits:
- Translate roles to Norwegian (display-only map; DB keys/feeds unchanged).
- Add a reusable credit_line component; render credits as dense pills.
- Collapse the work/edition split (level is derived from role server-side)
  and put add/remove behind a no-JS "Rediger" <details> disclosure.

Forms:
- Auto-grow textareas via CSS field-sizing, with a tiny JS fallback for
  browsers without it (e.g. Firefox).
- Apply input styling to email/url/date fields that were missed.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

katalog: refine credits edit flow; full-width feed cards; iOS-safe copy ... decafa2f4a

Credits:
- Make the whole person pill a link (was just the name) with a single
  hover state across the pill.
- Replace the read-only credit view in place when the "Rediger" disclosure
  opens (CSS :has), and order the toggle below its panel so the credits
  stay above the edit button.

Feeds:
- Feed cards span the full line (single-column grid) instead of two-up.

Copy-to-clipboard:
- navigator.clipboard only exists in a secure context, so it failed over
  plain HTTP on iOS. Fall back to a hidden-textarea + execCommand with the
  selection dance iOS needs; keep the async API on HTTPS.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

katalog: drop the iOS clipboard fallback ... 1eb196db09

navigator.clipboard works on iPad over HTTPS, which is how production is
served, so the hidden-textarea/execCommand fallback isn't needed.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

katalog: status-forward show page (cover header, episode state, compact feeds) ... 76a878375e

Reshape /program/{slug} around production status, mobile-first, keeping the
Golten Stories identity:

- Show header: cover thumb + title + tagline + at-a-glance status line
  ("2 episoder · alle klare" / "1 trenger render"), dot reflects worst case.
- Episodes become a tappable status list (whole row links to the editor) with
  a derived state pill per episode: kladd (no master) → render (master, missing
  a feed-platform rendition) → klar (rendition for every feed platform).
- Feeds compacted into rows; fix a latent bug where an ungenerated platform
  showed "Generert 0001-01-01" because {{if $feed}} is always true for a
  zero Feed struct — now tests GeneratedAt.IsZero.
- Credits collapsed into a disclosure to tighten the page.

New CSS components (status dot/label, show-head, ep-list, feed-list, disc) are
additive and reuse existing tokens. Backend adds episodeStatusRows deriving each
episode's state from its master + renditions.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

katalog: fix episode-page spacing above Renderinger; drop monospace on profile name ... ee3197ac0c

- Give the master-upload card a margin-bottom:var(--s6) so the Renderinger
  heading gets the same section gap as Metadata/Krediteringer (it carried none).
- Profile name in the renditions table is a label, not a path/hash — render it
  as normal text with a muted version suffix instead of <code> monospace.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

katalog: per-episode cover art + status/pipeline redesign of the episode page ... 2d8552538b

Episode covers (ADR-0019):
- POST /program/{slug}/episode/{id}/image — validates a square 1400-3000px
  JPEG/PNG (same spec as show art) via a shared storeUploadedCover helper,
  stores at images/episodes/{id}/cover.{ext}, sets Episode.ImagePath.
- Factor the show-image upload onto the same helper; it also prunes a stale
  cover in the other format on re-upload.
- feed.Item gains itunes:image + podcast:images; feed generation emits an
  episode's own cover when set, else omits it so apps fall back to channel art.
- No show banner: no podcast app consumes one via RSS (see ADR-0019).

Episode page redesign (mobile-first, same Golten Stories identity):
- Status header (cover + title + state pill), a Metadata/Master/Renderinger
  pipeline strip, and inline section status — state derived in loadEpisodeView.
- Cover upload/preview section; falls back to the show cover (dimmed) until set.
- Show episode rows gain a cover thumbnail (own cover, else dimmed show cover).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

arne merged commit b3eefc078c into main 2026-06-28 22:32:08 +02:00

arne deleted branch ui-changes 2026-06-28 22:32:08 +02:00

arne referenced this pull request from a commit 2026-06-28 22:32:09 +02:00

UI changes (#13)

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

tjue/kokosbananas!13

No description provided.