Skip to content

Redesign readings page: two-column layout, compact reading list, toggle widgets - #167

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

Redesign readings page: two-column layout, compact reading list, toggle widgets#167
brianglass merged 1 commit into
mainfrom
readings-page-layout-redesign

Conversation

@brianglass

Copy link
Copy Markdown
Owner

Summary

  • Split the readings page into two columns (Scripture Readings left, Commemorations right) instead of letting each passage's text flow into its own internal multi-column layout. Collapses to a single stacked column below 800px.
  • Fixed the header/content divider line, which was drawing as two separate segments with a gap between them once the columns were introduced -- now one continuous line across the .readings-columns wrapper.
  • Added a compact Scripture Readings list to the header (above Commemorations, same styling) -- each entry links down to its full passage via a new per-reading anchor.
  • Replaced the stacked Slavic/Greek and Gregorian/Julian radio rows with two compact segmented-control widgets side by side (pure CSS, :has(input:checked) for the active state, no JS changes) -- applied to both readings.html and calendar.html, which shared the old markup.

Test plan

  • 142/142 tests pass
  • Verified live: two-column layout, continuous divider, scripture-list anchors jump to the correct passage, tradition/calendar toggles switch and navigate correctly on both the daily readings page and the monthly calendar grid
  • Verified narrow-viewport stacking behavior

🤖 Generated with Claude Code

https://claude.ai/code/session_01Hf6j2xXQXywHVh3HAVRxB3

…le widgets

- Split the readings page into two columns (Scripture Readings left,
  Commemorations right) instead of letting each passage's text flow
  into its own internal multi-column layout. Collapses to a single
  stacked column below 800px.
- Fixed the header/content divider line: it was drawing as two
  separate border-top segments (one per column) with a gap between
  them; moved the border onto the shared .readings-columns wrapper so
  it's one continuous line.
- Added a compact Scripture Readings list to the header, above
  Commemorations, styled the same way -- each entry links to its full
  passage in the left column via a new per-reading anchor id.
- Replaced the stacked Slavic/Greek and Gregorian/Julian radio button
  rows with two compact segmented-control widgets side by side (same
  markup change applied to calendar.html, which shared the old
  layout). Pure CSS: the radio inputs stay real and functional, just
  visually hidden, with :has(input:checked) styling the active
  segment -- no JS changes needed. Removed the now-dead
  .tradition-label-with-badge and radio accent-color rules.

142/142 tests pass (no test touches this template's HTML structure).

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 d4dbcf8 to b1fa78e Compare August 10, 2026 16:06
@brianglass
brianglass merged commit 690244a 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