Align the key/value notes properly, and drop the jobs paragraph - #192
Merged
Conversation
## The notes block had three constraints and no rule satisfied all of them Keys must align across lines; values must wrap as prose; inline markup inside a value (a link, a <code>) must stay inline. - display:flex on the line fails the third: every child becomes a flex item, which is how "working paper" ended up a 40px box broken across three lines mid-word. - The hanging indent from #189 fixes that but fails the first: a key wider than the indent -- "uk microdata" is 12ch against a 6.5ch indent -- shunts its own value out of line with every other row. That is the ragged column in the screenshot. Both attempts put the layout on the LINE, where it can only ever see one key. Moved to the container: .vmet-notes is the two-column grid and each line is display:contents, so every key and value becomes a direct item of one shared grid. Columns align across all lines whatever the longest key is, and each value is a single grid item whose contents flow inline. Two validation values were bare text rather than wrapped, which the grid needs; wrapped them. ## Removed the jobs paragraph The "Slow calls run as jobs" note is gone from /connect. Cache key v=5 -> v=6, template included. Site suite 1564 passed; contract and generator clean. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Lcj9DDqam9KmVCfhEdnJcJ
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
vahid-ahmadi
added a commit
that referenced
this pull request
Aug 26, 2026
Six models described in six paragraphs made the reader do the comparison themselves: to find out which model answers over which horizon, you had to read all six and hold them in your head. The information is two-dimensional, so it is now drawn that way. The map places each model on one shared time axis -- recent past, coming quarters, three to five years, decades -- and splits UK from US into lanes. Where a model sits IS the answer to "which one do I want": the recent past is boe-svar, a UK reform three to five years out is obr-macro, decades is psl-og, climate scenarios is define-uk, and the US pair sits in coming quarters. Evidence strength is in the shape rather than a label: a solid outline means the model is checked against an external published anchor, a dashed one means no independent outcome benchmark exists. That puts psl-og and define-uk visibly apart from the other four, which is the honest reading and the thing a table buried in a column. The six evidence statements are kept in full, in the key/value grid fixed in #192, so nothing that made this section worth reading is lost -- only the arrangement changed. Details: every pill is a link to its model page, with hover and focus-visible states. Fonts come from --body/--mono rather than a hardcoded family (the #187 lesson). Colours are all tokens, so it follows the theme. Below 720px the map is hidden and the evidence lines carry the section alone, because a two-dimensional layout stops being readable at that width. Verified geometrically: no pill overlaps another, all six sit inside the viewBox, every label falls within its own pill, and no font-family is hardcoded. The Vercel preview is SSO-protected so it could not be eyeballed before merge. Cache key v=6 -> v=7, template included. Site suite 1564 passed; contract and generator clean. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Lcj9DDqam9KmVCfhEdnJcJ
vahid-ahmadi
added a commit
that referenced
this pull request
Aug 26, 2026
Six models described in six paragraphs made the reader do the comparison themselves: to find out which model answers over which horizon, you had to read all six and hold them in your head. The information is two-dimensional, so it is now drawn that way. The map places each model on one shared time axis -- recent past, coming quarters, three to five years, decades -- and splits UK from US into lanes. Where a model sits IS the answer to "which one do I want": the recent past is boe-svar, a UK reform three to five years out is obr-macro, decades is psl-og, climate scenarios is define-uk, and the US pair sits in coming quarters. Evidence strength is in the shape rather than a label: a solid outline means the model is checked against an external published anchor, a dashed one means no independent outcome benchmark exists. That puts psl-og and define-uk visibly apart from the other four, which is the honest reading and the thing a table buried in a column. The six evidence statements are kept in full, in the key/value grid fixed in #192, so nothing that made this section worth reading is lost -- only the arrangement changed. Details: every pill is a link to its model page, with hover and focus-visible states. Fonts come from --body/--mono rather than a hardcoded family (the #187 lesson). Colours are all tokens, so it follows the theme. Below 720px the map is hidden and the evidence lines carry the section alone, because a two-dimensional layout stops being readable at that width. Verified geometrically: no pill overlaps another, all six sit inside the viewBox, every label falls within its own pill, and no font-family is hardcoded. The Vercel preview is SSO-protected so it could not be eyeballed before merge. Cache key v=6 -> v=7, template included. Site suite 1564 passed; contract and generator clean. Claude-Session: https://claude.ai/code/session_01Lcj9DDqam9KmVCfhEdnJcJ Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Three constraints, and no rule so far satisfied all of them
Keys must align across lines; values must wrap as prose; inline markup inside a value (a link, a
<code>) must stay inline.display: flexon the line fails the third — every child becomes a flex item, which is how "working paper" ended up a 40px box broken across three lines mid-word.uk microdatais 12ch against a 6.5ch indent — shunts its own value out of line with every other row. That's the ragged column in the screenshot.Both attempts put the layout on the line, where it can only ever see one key.
Moved it to the container:
.vmet-notesis the two-column grid and each line isdisplay: contents, so every key and value becomes a direct item of one shared grid. Columns align across all lines whatever the longest key is, and each value is a single grid item whose contents flow inline.Two validation values were bare text rather than wrapped, which the grid needs — wrapped them.
Also
Removed the "Slow calls run as jobs" note from
/connectas requested.Cache key
v=5→v=6, generator template included.Testing
Site suite 1564 passed; contract and topic-page generator clean.
🤖 Generated with Claude Code
https://claude.ai/code/session_01Lcj9DDqam9KmVCfhEdnJcJ