Say what codecity is on the page that covers everything else - #155
Merged
Conversation
The landing is fixed over the whole viewport, so it hides the header and footer: on a cold boot nobody saw the version, the repo link or the credit until they had already loaded a repo. The three now sit under the wordmark, where attribution belongs on a landing page, in both landing modes since the switcher covers the chrome either way. That made a third surface showing the same three things, so they move to components/AppMeta as one definition each and the wording, URLs and link targets can no longer drift. Colour stays with each surface: the header holds its link at icon weight, the footer lifts it above the prose, the landing sits it between the two. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
A word doesn't read as clickable the way an icon button does, so the three text links stopped borrowing the icons' resting colour. The house classes already drew this line: .link for prose (accent, always underlined) on the landing, .link--chrome for chrome (accent, underline on hover) in the header and footer. AppMeta takes which one as a prop rather than inventing a fourth treatment. The project chip goes accent for the same reason, and it's the main control in the header besides. The landing's line also grows two steps. It had the footer's 10px, which suits a 24px status bar and not a full-screen hero under a 28px wordmark: the size was copied without being re-decided for the context. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Extracting the meta atoms renamed .app-footer-credit to the shared .meta-credit but left its rules where they were, so a narrow-viewport rule meant for the footer hid the credit on the landing too, leaving its line ending on a dangling separator. The footer rule itself was also stale. It dates from the credit being centred in a three-track grid, where a narrow viewport genuinely squeezed it; direction C gave the credit its own track and dropped the footer to two, which removed the crowding, and the rule outlived the reason for it. The status timestamp goes the same way: the bar holds two short items per side and each section already clips with an ellipsis, so hiding either traded real information for space that wasn't needed. The hero's identity block also regroups. The meta line sat inside the brand row, so it inherited the wordmark's indent past the gem while the tagline and cues started at the hero's left edge: one offset line reads as the gem's partner, two read as a mistake. Brand and meta now share a block at a tighter gap than the hero's own, and the gem gets more room before the wordmark. 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.
The project switcher is
position: fixed; inset: 0; z-index: 1000, so it covers the app header and footer. On a cold boot nobody saw the version, the repo link or the credit until they had already loaded a repo. All three now sit under the wordmark, in both landing modes since the switcher covers the chrome either way.One definition each
That made a third surface showing the same three things, so they moved to
components/AppMeta: the version, the about link, and the credit, once each. The wording, the URLs and the link targets can no longer drift between the header, the footer and the landing.FooterMeta.tsxis gone.Link treatment is the surface's call via a
linkClassprop, using the classesstyles/text.cssalready defines rather than a fourth bespoke one:.linkon the landing: prose, so accent and always underlined.link--chromein the header and footer: accent, underline on hoverThat distinction is the point. An icon button reads as clickable by being an icon; a bare word doesn't, so the text links stopped borrowing the icons' resting muted colour. The project chip goes to
--cc-text-strongfor the same reason, and it's the header's main control besides — its hover colour was then a no-op, so the background lift is the whole hover signal now.Fixes found while looking at it
--cc-font-smnow. The size had been copied without being re-decided for the context..app-footer-creditto the shared.meta-creditleft the footer's narrow-viewport rule matching the landing too, ending its line on a dangling separator. Scoped, then deleted: that rule dated from the credit being centred in a three-track grid, and direction C gave it its own track and dropped the footer to two. It outlived its reason.Verification
just test-app(2903) andjust lintgreen; the pre-push gate passed. Four new tests cover the landing's identity line in both modes, including both link targets and theirrel. Breaking the credit URL fails three tests across the landing and the footer, so they bite.Verified in a browser at desktop and narrow widths, since jsdom computes neither layout nor colour.
🤖 Generated with Claude Code