Add a table of contents to the single template

Pages can show the table of contents by setting the renderTableOfContents parameter.

assets/css/099_table_of_contents.css

@@ -0,0 +1,34 @@
+details:has(#TableOfContents) {
+  grid-column: main-start / main-end;
+
+  summary {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-m);
+
+    &::before {
+        content: "+ ";
+        font-weight: bold;
+    }
+
+    &::-webkit-details-marker {
+        display: none;
+    }
+  }
+
+  &[open] {
+    summary::before {
+      content: "- ";
+    }
+  }
+
+  #TableOfContents {
+    > ul {
+      padding-inline-start: 2ch; /*var(--space-m);*/
+      margin-block: 0;
+    }
+
+    ul {
+        list-style-type: none;
+    }
+  }
+}

i18n/en.yaml

@@ -1 +1,2 @@
 home: Home
+tableOfContents: Table of Contents

layouts/_default/single.html

@@ -3,6 +3,13 @@
     <header class="page-header">
       {{ partial "page_header.html" (dict "page" .) }}
     </header>
+
+    {{ if .Params.renderTableofContents | default false }}
+      <details>
+        <summary>{{ i18n "tableOfContents" }}</summary>
+        {{ .TableOfContents }}
+      </details>
+    {{ end }}
     <footer class="page-footer">
       {{ partial "page/footer.html" . }}
     </footer>