WI-093: The game page, at the width it is read on
WI-093: The game page, at the width it is read on
Problem
WI-092 gave the web a scale. Nothing used it: the game
page was still a single .card holding a stack of blocks, unchanged since
WI-061 except in colour.
What the page actually contains, measured
Before designing a layout it was worth asking what there is to lay out. Against the live catalogue:
| Games | 333 |
| With a description | 0 |
| With an image | 0 — and 0 in the harvested corpus of 3973 either |
| Facts per game | 4, for all 333 — designers, year, players, time |
So a game page is a name, a one-line byline, three numbers and about six tags. That is the whole of it.
This retires a plan rather than fulfilling one. The obvious desktop design for a Letterboxd-alike is a cover rail beside the content, and it was what this item was expected to build. There is no cover, and there will not be one until the harvest fetches Wikidata’s P18 — which WI-046 already recorded as out of scope and nothing has scheduled since. A rail for an image that does not exist is a design for a screenshot.
What shipped instead
The facts are the substance, so they get a column. On a wide viewport the page is two columns — content, and a sticky rail carrying the three facts at display size with their units set quietly beside them. On a phone the rail falls underneath and the facts sit side by side, which is the only sane shape in one column.
Prose is bounded by --measure for the day a description exists. At
--content width with 17px type, an unbounded paragraph runs past 100
characters a line.
The call to action looks like one. It was a text link that read like the credits beside it.
The index is two columns above 56rem. A single column of short rows left half the page empty and made a 333-game catalogue feel like a list of four.
The cover is kept and corrected rather than deleted. It rendered
object-fit: cover under a max-height, which crops box art — portrait
artwork in a landscape box. It is now natural-aspect within the rail. It
renders for nobody today; the licence plumbing behind it (WI-047, WI-048) is
what must not be re-derived when an image finally arrives.
Out of scope
- Dark mode. Possible since WI-092; its own judgement and its own diff.
- Making the chips links. They are the obvious discovery surface and that is WI-041’s, not a layout item’s.
- Fetching cover images. A harvest change, and the reason there is no rail.
- Anything about the thinness itself. See below — it is not a CSS problem.
Definition of done
- The game page is two columns on a wide viewport and one on a phone.
- The facts read as the substance of the page, not as small print.
- Prose is bounded by the measure.
- The primary action looks like an action.
- The index uses the width available to it.
- A cover, if one ever arrives, is not cropped.
- No raw colour or size — the widened check from WI-092 still passes.
- Gate green.
Verification
Served locally and read the way a visitor gets it:
/games/catan 200title <h1 class="display">Catan</h1>byline 1995 · Klaus Teuber · Kosmosrail presentfacts Players 3–4 · Time 75 · Weight 2.30chips 6action Log a play in the appcover 0 (expected: nothing in the catalogue has an image)
/games 24 links.game two-column rule present.results two-column rule presentsticky rail presentpnpm --filter @tabletop/web test # 37pnpm gateThe finding this item could not fix
Every game page is thin, and no layout changes that.
ADR-0009 stakes the entire web
stack on these pages ranking. A page with a title, a byline, three numbers and
six tags — and no prose at all, on any of 333 — is thin content in the sense
search engines use the word. metaDescription already builds the snippet from
facts, with a comment saying why: “Most of the catalogue has no prose.”
It is not a CSS problem and it is not an agent’s to solve:
- Wikidata carries no prose and no mechanics — WI-076 measured that.
- The mechanics currently shown are the fixture’s hand-authored tags, which ADR-0017 has already ruled are not the controlled vocabulary. They disappear the moment the harvested corpus is loaded.
- Filling it needs either Wikipedia extracts (CC BY-SA, attribution obligations already built) or LLM enrichment, which is WI-H05 — a human approving spend.
Worth stating plainly because the crawlability work in WI-091 makes it reachable: the site is now findable, and what a crawler finds is four facts.