fix: make sticky TOC work for full scroll height and fix heading anchor links

app/public/assets/css/apropos.css

@@ -3,15 +3,14 @@
    Root class: .page-content
    ============================================================ */
 
-/* Override body overflow:hidden — these pages use the viewport scrollbar
-   so that anchor navigation (#fragment) works natively. */
-.apropos-body {
-    overflow: auto;
-}
+/* Keep the base flex layout (no html/body overrides) —
+   main scrolls internally so the body gradient stays at viewport bottom. */
 
 .page-content {
     flex: 1;
     min-height: 0;
+    overflow-y: auto;
+    overflow-x: hidden;
     scroll-behavior: smooth;
     padding: var(--space-xl) var(--space-l) var(--space-2xl);
     display: grid;
@@ -21,7 +20,7 @@
 }
 
 /* ------------------------------------------------------------------ */
-/* Left — sticky table of contents                                    */
+/* Left — sticky table of contents                                     */
 /* ------------------------------------------------------------------ */
 
 .apropos-toc {
@@ -173,7 +172,7 @@
     word-break: normal;
     font-family: "Courier New", Courier, monospace;
     font-size: 0.88em;
-    background: var(--bg-tertiary);
+    background: color-mix(in srgb, var(--bg-tertiary) 50%, transparent);
     padding: 0.5em 0.75em;
     border-radius: var(--radius);
     white-space: pre-wrap;
@@ -198,7 +197,7 @@
 .page-content > .content-section:last-child {
     border-bottom: none;
     margin-bottom: 0;
-    padding-bottom: 0;
+    padding-bottom: var(--space-xl);
 }
 
 /* ------------------------------------------------------------------ */
@@ -214,7 +213,13 @@
     line-height: 1.1;
 }
 
-/* Hide CommonMark heading permalink anchors (needed only for their id attr) */
+/* Scroll margin so anchor links account for the sticky header */
+.content :where(h1, h2, h3),
+.content-section :where(h1, h2, h3) {
+    scroll-margin-top: var(--space-l);
+}
+
+/* Hide CommonMark heading permalink anchors (id now lives on the heading itself) */
 .heading-permalink {
     display: none;
 }
@@ -324,6 +329,7 @@
     .page-content {
         grid-template-columns: 1fr;
         gap: var(--space-l);
+        padding: var(--space-m) var(--space-s) var(--space-xl);
     }
 
     .apropos-toc {

app/public/assets/css/components/header.css

@@ -56,6 +56,9 @@ header nav ul a:hover {
 
 header nav ul a[aria-current="page"] {
   color: var(--accent-primary);
+  text-shadow:
+    0 0 4px white,
+    0 0 8px white;
   border-radius: 0;
   border-bottom: 2px solid currentColor;
   padding-bottom: 1px;

app/src/Controllers/CharteController.php

@@ -31,6 +31,7 @@ class CharteController
         $converter = new CommonMarkConverter([
             'html_input' => 'strip',
             'heading_permalink' => [
+                'apply_id_to_heading' => true,
                 'id_prefix' => '',
                 'insert' => 'before',
                 'aria_hidden' => true,

app/src/Controllers/LicenceController.php

@@ -31,6 +31,7 @@ class LicenceController
         $converter = new CommonMarkConverter([
             'html_input' => 'strip',
             'heading_permalink' => [
+                'apply_id_to_heading' => true,
                 'id_prefix' => '',
                 'insert' => 'before',
                 'aria_hidden' => true,