Fix jersey page images: correct MinIO URLs and division-conditional rendering

### Type Feature ### Lineage Follow-up to #236. PR #240 deployed with broken relative playground image paths. PR #238/#239 were stale/conflicted. This issue replaces all prior image fix attempts with the correct mapping. ### Repo `forgejo_admin/westside-landing` ### User Story As a parent clicking a jersey link from email I want to see the correct product images for my child's division — jersey-only for the reversible option, full package for the warmup option So that I know exactly what I'm buying ### Context The jersey page at `src/routes/(public)/jersey/+page.svelte` currently has broken image paths (`assets/images/gear/...`) that don't exist on the production site. Images must come from MinIO with division-conditional rendering. Image mapping (verified on MinIO, all return 200): | Card | Girls (Queens) | Boys (Kings) | |------|---------------|-------------| | Reversible $90 | `queens-home.jpeg` (jersey+shorts, NO warmup) | `kings-home.jpeg` (jersey+shorts, NO warmup) | | Warmup $130 | `queens-away-new.jpeg` (full package WITH warmup) | `kings-away-new.jpeg` (full package WITH warmup) | Base URL: `https://minio-api.tail5b443a.ts.net/assets/westside/jerseys/` The `division` variable already exists in the script block (from `GET /jersey/player-info`). Values: `'girls'` or `'boys'`. Playground source approved at: `https://playground.tail5b443a.ts.net/westside/jersey.html?v=9` ### File Targets Files the agent should modify: - `src/routes/(public)/jersey/+page.svelte` — replace the two `<img>` src attributes with MinIO URLs conditional on `division` Files the agent should NOT touch: - `src/app.css` — no CSS changes needed - `<script>` block — do not modify - Any other routes ### Acceptance Criteria - [ ] Reversible card image: `{division === 'girls' ? 'queens-home.jpeg' : 'kings-home.jpeg'}` — shows jersey+shorts, NO warmup - [ ] Warmup card image: `{division === 'girls' ? 'queens-away-new.jpeg' : 'kings-away-new.jpeg'}` — shows full package WITH warmup - [ ] Both images load on mobile at 390px — full width, natural aspect ratio, no cropping - [ ] No relative playground paths remain in the file - [ ] Existing tokenized links still work ### Test Expectations - [ ] Playwright: open girls token link at 390px, screenshot, verify queens-home on reversible, queens-away-new on warmup - [ ] Playwright: open boys token link at 390px, screenshot, verify kings-home on reversible, kings-away-new on warmup - [ ] No console errors on either page - Run command: Playwright validation via screenshots ### Constraints - Do NOT modify the `<script>` block - Do NOT add inline `<style>` blocks - Do NOT crop or constrain images — `width: 100%; display: block;` only - Close stale PR #239 if still open ### Checklist - [ ] PR opened - [ ] Playwright mobile screenshots for both divisions attached - [ ] No unrelated changes - [ ] Stale PR #239 closed ### Related Closes #236

forgejo_admin commented

2026-04-09 13:20:02 +00:00

Contributor

Type

Feature

Lineage

Follow-up to #236. PR #240 deployed with broken relative playground image paths. PR #238/#239 were stale/conflicted. This issue replaces all prior image fix attempts with the correct mapping.

Repo

forgejo_admin/westside-landing

User Story

As a parent clicking a jersey link from email
I want to see the correct product images for my child's division — jersey-only for the reversible option, full package for the warmup option
So that I know exactly what I'm buying

Context

The jersey page at src/routes/(public)/jersey/+page.svelte currently has broken image paths (assets/images/gear/...) that don't exist on the production site. Images must come from MinIO with division-conditional rendering.

Image mapping (verified on MinIO, all return 200):

Card	Girls (Queens)	Boys (Kings)
Reversible $90	`queens-home.jpeg` (jersey+shorts, NO warmup)	`kings-home.jpeg` (jersey+shorts, NO warmup)
Warmup $130	`queens-away-new.jpeg` (full package WITH warmup)	`kings-away-new.jpeg` (full package WITH warmup)

Base URL: https://minio-api.tail5b443a.ts.net/assets/westside/jerseys/

The division variable already exists in the script block (from GET /jersey/player-info). Values: 'girls' or 'boys'.

Playground source approved at: https://playground.tail5b443a.ts.net/westside/jersey.html?v=9

File Targets

Files the agent should modify:

src/routes/(public)/jersey/+page.svelte — replace the two <img> src attributes with MinIO URLs conditional on division

Files the agent should NOT touch:

src/app.css — no CSS changes needed
<script> block — do not modify
Any other routes

Acceptance Criteria

Reversible card image: {division === 'girls' ? 'queens-home.jpeg' : 'kings-home.jpeg'} — shows jersey+shorts, NO warmup
Warmup card image: {division === 'girls' ? 'queens-away-new.jpeg' : 'kings-away-new.jpeg'} — shows full package WITH warmup
Both images load on mobile at 390px — full width, natural aspect ratio, no cropping
No relative playground paths remain in the file
Existing tokenized links still work

Test Expectations

Playwright: open girls token link at 390px, screenshot, verify queens-home on reversible, queens-away-new on warmup
Playwright: open boys token link at 390px, screenshot, verify kings-home on reversible, kings-away-new on warmup
No console errors on either page
Run command: Playwright validation via screenshots