fix: restore the index layout broken by the V-001 navigation fix

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` |

src/templates/index.html.tera

@@ -35,30 +35,31 @@
     <a class="skip-link" href="#main-content">Skip to main content</a>
     <div class="container index-container">
         {% 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. #}
-        <div class="sidebar">
-            {% include "sidebar.html" %}
-        </div>
         <main class="content index-content" id="main-content">
             {% if has_index %}
                 <article class="main-article">
                     {{ content | safe }}
                 </article>
-            {% else %}
+            {% endif %}
+            {% if not has_index %}
                 <div class="index-header">
                     <h1>Documentation</h1>
                 </div>
-                <div class="card-grid">
+            {% 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. #}
+            <div class="card-grid">
                     {% for section in sections %}
                         <div class="section-group">
                             <h2>{{ section.title }}</h2>
                             <div class="card-group">
                                 {% for page in section.pages %}
                                     <sl-card class="doc-card">
                                         <h3 slot="header">{{ page.title }}</h3>
-                                        <sl-button href="{{ path_to_root | safe }}{{ page.path }}" variant="default">
+                                        <sl-button href="{{ path_to_root | safe }}{{ page.path | safe }}" variant="default">
                                             Read More
                                             <sl-icon slot="suffix" name="arrow-right"></sl-icon>
                                         </sl-button>
@@ -67,8 +68,7 @@
                             </div>
                         </div>
                     {% endfor %}
-                </div>
-            {% endif %}
+            </div>
         </main>
     </div>
 
@@ -79,4 +79,4 @@
     <script src="{{ path_to_root | safe }}js/fold.js"></script>
     <script src="{{ path_to_root | safe }}js/code-copy.js"></script>
 </body>
-</html> 
+</html> 

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(())
 }