From 0f3377478ba4a6b6018a3fd73f4826e66d373e1a Mon Sep 17 00:00:00 2001 From: AlexMikhalev Date: Wed, 12 Aug 2026 11:58:34 +0100 Subject: [PATCH] fix: restore the index layout, and navigate with cards not a sidebar MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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. --- docs/plans/mdbook-parity-validation-report.md | 3 ++- src/templates/index.html.tera | 24 +++++++++---------- tests/integration/build_test.rs | 6 ++++- 3 files changed, 19 insertions(+), 14 deletions(-) diff --git a/docs/plans/mdbook-parity-validation-report.md b/docs/plans/mdbook-parity-validation-report.md index 98d6cd9..cfd48d2 100644 --- a/docs/plans/mdbook-parity-validation-report.md +++ b/docs/plans/mdbook-parity-validation-report.md @@ -57,7 +57,8 @@ fixed. Measuring also removed one avoidable cost (a duplicate mdast parse per pa | ID | Description | Origin | Severity | Resolution | |----|-------------|--------|----------|------------| -| V-001 | Index page had no navigation: one link (the logo) versus 30 on a chapter page. A README-backed index skips the card grid, and the template never included the sidebar | **Phase 2 (design omission)** | High | `3704b0d` | +| V-001 | Index page had no navigation: one link (the logo) versus 30 on a chapter page. A README-backed index skips the card grid | **Phase 2 (design omission)** | High | `3704b0d`, corrected in `fix/index-layout-regression` | +| V-005 | The V-001 fix injected the chapter `.sidebar` into `.index-container`, which is `display: block !important; max-width: 1400px`. With `grid-area` meaningless outside a grid, the sidebar became a `height: 100vh; overflow-y: auto` block inside the capped-width landing page — a fixed-width column with its own scrollbar. Reported by the user, not by any test | **Phase 3 (my fix ignored the target layout)** | High | Card grid now renders alongside index content; no sidebar on the landing page | | V-002 | Sidebar's deprecated branch read `page.sections`, absent from the index context — an empty book failed to render | Phase 2 (context asymmetry) | Medium | `3704b0d` | | V-003 | Logo link had no accessible name (`alt=""` on the image left the anchor unnamed) | Phase 3 | **Serious (WCAG 2.4.4, 4.1.2)** | `8bcc6b7` | | V-004 | On-this-page component emitted bare `div`s, leaving content outside any landmark | Phase 2 (component markup unspecified) | Moderate | `8bcc6b7` | diff --git a/src/templates/index.html.tera b/src/templates/index.html.tera index a6ad6e4..8040766 100644 --- a/src/templates/index.html.tera +++ b/src/templates/index.html.tera @@ -35,22 +35,23 @@
{% include "header.html" %} - {# The landing page needs the same navigation as any chapter: with a - README-backed index the card grid is skipped, which used to leave the - page with no way to reach the book at all. #} -
- {% include "sidebar.html" %} -
{% if has_index %}
{{ content | safe }}
- {% else %} + {% endif %} + {% if not has_index %}

Documentation

-
+ {% endif %} + {# The card grid is this page's navigation, and the reason the + layout is a full-width block rather than the chapter grid. It + used to render only when there was no index page of its own, + which left a README-backed book with no route into its + chapters at all. #} +
{% for section in sections %}

{{ section.title }}

@@ -58,7 +59,7 @@ {% for page in section.pages %}

{{ page.title }}

- + Read More @@ -67,8 +68,7 @@
{% endfor %} -
- {% endif %} +
@@ -79,4 +79,4 @@ - \ No newline at end of file + diff --git a/tests/integration/build_test.rs b/tests/integration/build_test.rs index 11c3752..d50c8fd 100644 --- a/tests/integration/build_test.rs +++ b/tests/integration/build_test.rs @@ -1323,7 +1323,11 @@ async fn test_index_page_is_navigable() -> Result<()> { let index = book.read_output("index.html")?; assert_contains!(index, "one.html"); assert_contains!(index, "sub/two.html"); - assert_contains!(index, "sidebar-nav"); + // Navigation here is the card grid, not the chapter sidebar: the landing + // page is a full-width block layout by design, and dropping a grid-area + // sidebar into it produced a fixed-width column with its own scrollbar. + assert_contains!(index, "card-grid"); + assert_not_contains!(index, "class=\"sidebar\""); Ok(()) }