Skip to content

site: the chapter nav takes the full row on a phone - #105

Merged
h0ffmann merged 1 commit into
mainfrom
claude/site-phone-nav
Oct 12, 2026
Merged

h0ffmann merged 1 commit into
mainfrom
claude/site-phone-nav

Conversation

@h0ffmann

Copy link
Copy Markdown
Owner

Requested by Hoffmann · project thread

Before: on a phone (390 px) the web edition's Up / Top / Next / Previous links each got half the row, so "Without Changing the Answer" broke one word per line and the root page's lone "Next:" link was squeezed into half the width.

After: under 40em each link sizes to its content and they stack one per row; the desktop layout is unchanged.

pandoc's chunked HTML template sets span.navlink { flex: 1 } inline; one rule in pubs/site/style.css overrides it inside a media query.

How: checked by injecting the rule into the live pages with Playwright: / and 1-ch-orientation.html at 390 px (no horizontal overflow, one link per row) and at 1280 px (same layout as today). marola.dev's new "pesquisa" nav link (marola-dev/marola-site#120) opens this site's root, which is why its phone view was checked.

Tested: Playwright, live pages with the rule injected, 390 and 1280 px.
Cost: none

🤖 Generated with Claude Code

https://claude.ai/code/session_01WJ4cgMpWJg7XzpyMyGFodN


Generated by Claude Code

pandoc's chunked HTML gives each Up/Top/Next/Previous link half the
row (flex: 1). At 390 px that leaves about 150 px per link, so "Without
Changing the Answer" broke one word per line and the root page's lone
"Next:" link sat squeezed in half the width. Under 40em each link now
sizes to its content and the four stack one per row; desktop is
unchanged.

Tested: the rule injected into the live pages with Playwright: root and 1-ch-orientation.html at 390 px (no horizontal overflow, one link per row) and 1280 px (unchanged layout)
Cost: none
Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WJ4cgMpWJg7XzpyMyGFodN
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants