Repository navigation
fix(footer): 1.2.1 — legal nav wraps on phones - #12
Merged
Merged
Conversation
ControlPanelFooter's legal nav is seven links in one non-wrapping flex row = 469 px. On a 390 px phone that stretches the whole page to 430 px on every page of every consuming site (measured 2026-09-17 on adellion.com, endsights.com and simplified.media), so the browser zooms the page out. Let the row wrap and centre. Only classes already present in all three sites' production CSS are used (flex-wrap, justify-center, gap-6); the row gap is an inline style because adellion and endsights do not scan this package for Tailwind classes. Desktop stays one row. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_012uoKLxwsDgGibussFbZKXW
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.
Problem
ControlPanelFooterrenders its seven legal links in one non-wrapping flex row = 469 px. On a 390 px phone that stretches the whole page to 430 px — on every page of every site that uses the footer — so the browser zooms the page out.Measured 2026-09-17 with Playwright (iPhone 14 emulation,
window.innerWidthshould be 390):nav.flex.gap-6(this nav)Fix
<nav className="flex flex-wrap justify-center gap-6" style={{ rowGap: '0.5rem' }}>— wraps to two centred rows on a phone; still one row on desktop.Only classes already present in all three sites' production CSS are used (
flex-wrap,justify-center,gap-6— checked against the live stylesheets). The row gap is inline on purpose: adellion and endsights point Tailwind's@sourceat a dead monorepo path (../../../../packages/ui/src), so classes that only this package uses are never generated there (md:flex-row,pt-6,border-[#292524]are all missing from adellion's live CSS). That is a separate site-side fix.Version 1.2.0 → 1.2.1.
Verification
innerWidth390.After merge
Publishing is tag-driven (
v*→ GitHub Packages): tagv1.2.1when ready. Sites are on^1.0.5with lockfiles, so each needs a bump to pick this up; adellion#45 carries an equivalent local rule in the meantime.🤖 Generated with Claude Code
https://claude.ai/code/session_012uoKLxwsDgGibussFbZKXW