fix: restore the index layout broken by the V-001 navigation fix - #29
Merged
Conversation
Reported by the user: the index page had become fixed-width with its own scrollbar, breaking the wide-monitor layout. Cause was my own V-001 fix. `.index-container` is `display: block !important; max-width: 1400px` — deliberately a full-width, centred landing page with no sidebar. I dropped the chapter `.sidebar` into it, and since `grid-area: sidebar` means nothing outside a grid, it rendered as a `height: 100vh; overflow-y: auto` block inside the capped container: a fixed-width column with a scrollbar, exactly as described. The underlying problem was real — a README-backed index reached no chapter — but the fix should have used the mechanism the page already has. The card grid is the landing page's navigation, and it rendered only when the book had no index page of its own. It now renders in both cases, so the README content and the routes into the book appear together. Also marks the card links `| safe`: they are escaped at construction, and Tera was escaping them again into `individual/index.html`. The multi-column article flow (`column-width: 40ch`) is untouched and predates this branch; verified identical to the pre-branch stylesheet. Verified at 1280px: block layout, no `.sidebar` element, no horizontal scrollbar, 30 card links, README content intact.
📊 Performance Benchmark Results
Raw Results{
"timestamp": "2026-08-12T11:00:18+00:00",
"benchmarks": [
{
"benchmark_name": "pagefind_init/pages/50",
"mean": {
"estimate": 2387900
},
"unit": "ns"
},
{
"benchmark_name": "pagefind_init/pages/100",
"mean": {
"estimate": 4518300
},
"unit": "ns"
},
{
"benchmark_name": "pagefind_init/pages/500",
"mean": {
"estimate": 25435000
},
"unit": "ns"
}
]
}
|
🚀 Deployment PreviewYour changes have been deployed to Cloudflare Pages! 🔗 Preview URL: https://preview-29.md-book.pages.dev The deployment will be updated automatically when you push new changes to this PR. |
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.
Reported by the user: the index page became fixed-width with its own scrollbar, breaking the wide-monitor layout.
Cause — mine
.index-containerisdisplay: block !important; max-width: 1400px: deliberately a full-width, centred landing page with no sidebar. My V-001 fix dropped the chapter.sidebarinto it.grid-area: sidebarmeans nothing outside a grid, so it rendered as aheight: 100vh; overflow-y: autoblock inside the capped container — a fixed-width column with a scrollbar.The problem V-001 identified was real (a README-backed index reached no chapter), but the fix ignored the layout it was editing. No test caught it because every test asserted link presence, never layout.
Fix
The card grid is the landing page's navigation, and the reason the layout is a full-width block. It rendered only when the book had no index page of its own; it now renders in both cases, so README content and the routes into the book appear together.
Card links also get
| safe— they are escaped at construction, and Tera was escaping them again intoindividual/index.html.Not touched
The multi-column article flow (
column-width: 40ch; column-gap: 4rem; column-rule) is byte-identical to the pre-branch stylesheet. That wide-monitor design is intact.Verified at 1280px
block.sidebarelementsFull suite green; the test that asserted the wrong fix now asserts the card grid and the absence of a sidebar.