#231, Allow open collapsed menu without changing page

assets/_main.scss

@@ -107,8 +107,10 @@ ul.pagination {
     @include fixed;
   }
 
-  a {
+  a,
+  label {
     color: inherit;
+    cursor: pointer;
     word-wrap: break-word;
   }
 
@@ -116,13 +118,12 @@ ul.pagination {
     color: var(--color-link);
   }
 
-  a.collapsed {
-    display: flex;
-    justify-content: space-between;
-
-    &::after {
-      content: "▸";
+  input.toggle + label + ul {
+    display: none;
   }
+
+  input.toggle:checked + label + ul {
+    display: block;
   }
 }
 

exampleSite/assets/_variables.scss

@@ -1,3 +1 @@
 /* You can override SASS variables here. */
-
-// @import "plugins/dark";

exampleSite/content/docs/example/collapsed/_index.md

@@ -2,22 +2,3 @@
 bookCollapseSection: true
 weight: 20
 ---
-
-# Collapsed Level of Menu
-
-## Cognita laeva illo fracta
-
-Lorem markdownum pavent auras, surgit nunc cingentibus libet **Laomedonque que**
-est. Pastor [An](http://est.org/ire.aspx) arbor filia foedat, ne [fugit
-aliter](http://www.indiciumturbam.org/moramquid.php), per. Helicona illas et
-callida neptem est *Oresitrophos* caput, dentibus est venit. Tenet reddite
-[famuli](http://www.antro-et.net/) praesentem fortibus, quaeque vis foret si
-frondes *gelidos* gravidae circumtulit [inpulit armenta
-nativum](http://incurvasustulit.io/illi-virtute.html).
-
-1. Te at cruciabere vides rubentis manebo
-2. Maturuit in praetemptat ruborem ignara postquam habitasse
-3. Subitarum supplevit quoque fontesque venabula spretis modo
-4. Montis tot est mali quasque gravis
-5. Quinquennem domus arsit ipse
-6. Pellem turis pugnabant locavit

exampleSite/resources/_gen/assets/scss/book.scss_50fc8c04e12a2f59027287995557ceff.json

@@ -1 +1 @@
-{"Target":"book.min.4194921b4c7ff04cd7c5b17f3ac51f141158e219fa9deb989de5e50f624ca88f.css","MediaType":"text/css","Data":{"Integrity":"sha256-QZSSG0x/8EzXxbF/OsUfFBFY4hn6neuYneXlD2JMqI8="}}
+{"Target":"book.min.891c5b58a7a694942d519238f3c4138504c9ad2e207c0fd6541f9cd4f8d6220a.css","MediaType":"text/css","Data":{"Integrity":"sha256-iRxbWKemlJQtUZI488QThQTJrS4gfA/WVB+c1PjWIgo="}}

layouts/partials/docs/menu-filetree.html

@@ -8,11 +8,6 @@
 {{ end }}
 
 {{ define "book-section-children" }}{{/* (dict "Section" .Section "CurrentPage" .CurrentPage) */}}
-  {{ $self := eq .CurrentPage .Section }}
-  {{ $ancestor := .Section.IsAncestor .CurrentPage }}
-  {{ $collapsed := .Section.Params.bookCollapseSection }}
-
-  {{ if or $self $ancestor (not $collapsed) }}
   <ul>
     {{ range (where .Section.Pages "Params.bookhidden" "ne" true) }}
       {{ if .IsSection }}
@@ -28,13 +23,21 @@
     {{ end }}
   </ul>
 {{ end }}
-{{ end }}
 
 {{ define "book-page-link" }}{{/* (dict "Page" .Page "CurrentPage" .CurrentPage) */}}
-  {{ if .Page.Content }}
-    <a href="{{ .Page.RelPermalink }}" class="
-        {{- if and .Page.Params.bookCollapseSection .Page.IsSection }}collapsed {{ end }}
-        {{- if eq .CurrentPage .Page }}active{{ end }}">
+  {{ $current := eq .CurrentPage .Page }}
+  {{ $ancestor := .Page.IsAncestor .CurrentPage }}
+
+  {{ if .Page.Params.bookCollapseSection }}
+    <input type="checkbox" id="section-{{ md5 .Page }}" class="toggle" {{ if or $current $ancestor }}checked{{ end }} />
+    <label for="section-{{ md5 .Page }}" class="flex justify-between">
+      <a {{ if .Page.Content }}href="{{ .Page.Permalink }}"{{ end }} class="{{ if $current }}active{{ end }}">
+        {{- partial "docs/title" .Page -}}
+      </a>
+      <span>▾</span>
+    </label>
+  {{ else if .Page.Content }}
+    <a href="{{ .Page.Permalink }}" class="{{ if $current }} active{{ end }}">
       {{- partial "docs/title" .Page -}}
     </a>
   {{ else }}