Skip to content

Add responsive hamburger nav and warm up the parchment color scheme - #169

Merged
brianglass merged 1 commit into
mainfrom
readings-page-layout-redesign
Aug 10, 2026
Merged

Add responsive hamburger nav and warm up the parchment color scheme#169
brianglass merged 1 commit into
mainfrom
readings-page-layout-redesign

Conversation

@brianglass

Copy link
Copy Markdown
Owner

Summary

  • Restructures the top bar (title/hamburger row + page-nav row) so the site nav collapses into a hamburger menu instead of wrapping under the title on narrow screens; the mobile menu now drops down as an overlay from the hamburger rather than displacing page content.
  • The site title scales down fluidly via a CSS container query as the topbar narrows, so it shrinks before wrapping, and stays on one line down to a much smaller width than before.
  • Re-tunes several grays/whites that were designed for a plain white background to fit the parchment page background better, most visibly on the monthly calendar grid (blank cells, fast-day cells, weekday header text, borders, hover states).
  • Adds a thin border to the API page's embedded code gists and the feeds page's Google Calendar iframe for visual consistency with the rest of the page.

Test plan

  • docker compose run --rm tests — 142 tests pass
  • Manually verified responsive nav/title behavior in Chrome and Firefox across a range of widths (including DevTools device toolbar for widths narrower than the OS's minimum window size)
  • Manually verified calendar grid colors, gist border, and iframe border on the calendar, api, and feeds pages

🤖 Generated with Claude Code

https://claude.ai/code/session_01Hf6j2xXQXywHVh3HAVRxB3

Restructures the top bar into a title/hamburger row plus a page-nav row
(day/month nav, tradition/calendar toggles), so the site nav collapses
into a hamburger menu on narrow screens instead of wrapping awkwardly.
The site title now scales down fluidly via a container query as the
topbar narrows, staying on one line until the smallest readable size
before wrapping. The mobile menu drops down as an overlay panel from
the hamburger rather than displacing page content.

Also re-tunes several colors that were designed for a white background
to better suit the parchment page background: the calendar grid's
grays are shifted to the same warm hue used elsewhere on the site, and
the blank/fast-day cells now reuse established site colors instead of
plain white/gray. Adds a thin border to the API page's embedded code
gists and the feeds page's Google Calendar iframe for consistency with
the rest of the page.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Hf6j2xXQXywHVh3HAVRxB3
@brianglass
brianglass force-pushed the readings-page-layout-redesign branch from beb3d13 to 319c3b8 Compare August 10, 2026 22:21
@brianglass
brianglass merged commit c83345a into main Aug 10, 2026
4 checks passed
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.

1 participant