From 70bf4bc580ce984c042dcfd9eeb0637cfe63cc59 Mon Sep 17 00:00:00 2001
From: Franz Steininger <narrenfrei@gmail.com>
Date: Wed, 10 Mar 2021 23:20:08 +0100
Subject: [PATCH 1/3] rebuilt sidebar menu structure Corrected markup of nested
 menu lists best possible support of the existing CSS additional classes to
 simplify project-specific layout changes

---
 layouts/partials/sidebar-tree.html | 65 +++++++++++++++++-------------
 layouts/partials/sidebar.html      | 28 ++++++++-----
 2 files changed, 54 insertions(+), 39 deletions(-)

diff --git a/layouts/partials/sidebar-tree.html b/layouts/partials/sidebar-tree.html
index 5455b7782b..66babfc0bc 100644
--- a/layouts/partials/sidebar-tree.html
+++ b/layouts/partials/sidebar-tree.html
@@ -1,5 +1,6 @@
 {{/* We cache this partial for bigger sites and set the active class client side. */}}
-{{ $shouldDelayActive := ge (len .Site.Pages) 2000 }}
+{{ $sidebarCacheLimit := cond (isset .Site.Params.ui "sidebar_cache_limit") .Site.Params.ui.sidebar_cache_limit 2000 }}
+{{ $shouldDelayActive := ge (len .Site.Pages) $sidebarCacheLimit }}
 <div id="td-sidebar-menu" class="td-sidebar__inner{{ if $shouldDelayActive }} d-none{{ end }}">
   {{ if not .Site.Params.ui.sidebar_search_disable }}
   <form class="td-sidebar__search d-flex align-items-center">
@@ -24,36 +25,42 @@
     </div>
     {{ end }}
     {{ $navRoot := cond (and (ne .Params.toc_root true) (eq .Site.Home.Type "docs")) .Site.Home .FirstSection }}
-    {{ template "section-tree-nav-section" (dict "page" . "section" $navRoot "delayActive" $shouldDelayActive)  }}
+    {{ $ulNr := 0 }}
+    {{ $ulShow := cond (isset .Site.Params.ui "ul_show") .Site.Params.ui.ul_show 1 }}
+    {{ $sidebarMenuTruncate := cond (isset .Site.Params.ui "sidebar_menu_truncate") .Site.Params.ui.sidebar_menu_truncate 50 }}
+    <ul class="td-sidebar-nav__section pr-md-3 ul-{{ $ulNr }}">
+      {{ template "section-tree-nav-section" (dict "page" . "section" $navRoot "shouldDelayActive" $shouldDelayActive "sidebarMenuTruncate" $sidebarMenuTruncate "ulNr" $ulNr "ulShow" (add $ulShow 1)) }}
+    </ul>
   </nav>
 </div>
 {{ define "section-tree-nav-section" }}
-{{ $s := .section }}
-{{ $p := .page }}
-{{ $shouldDelayActive := .delayActive }}
-{{ $active := eq $p.CurrentSection $s }}
-{{ $show := or (and (not $p.Site.Params.ui.sidebar_menu_compact) ($p.IsAncestor $s)) ($p.IsDescendant $s) }}
-{{ $sid := $s.RelPermalink | anchorize }}
-<ul class="td-sidebar-nav__section pr-md-3">
-  <li class="td-sidebar-nav__section-title">
-    <a  href="{{ $s.RelPermalink }}" class="align-left pl-0 pr-2{{ if not $show }} collapsed{{ end }}{{ if $active}} active{{ end }} td-sidebar-link td-sidebar-link__section">{{ $s.LinkTitle }}</a>
-  </li>
-  <ul>
-    <li class="collapse {{ if $show }}show{{ end }}" id="{{ $sid }}">
-      {{ $pages := where (union $s.Pages $s.Sections).ByWeight ".Params.toc_hide" "!=" true }}
-      {{ $pages := $pages | first 50 }}
-      {{ range $pages }}
-      {{ if (not (and (eq $s $p.Site.Home) (eq .Params.toc_root true))) }}
-        {{ if .IsPage }}
-          {{ $mid := printf "m-%s" (.RelPermalink | anchorize) }}
-          {{ $active := eq . $p }}
-          <a class="td-sidebar-link td-sidebar-link__page {{ if and (not $shouldDelayActive) $active }} active{{ end }}" id="{{ $mid }}" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
-        {{ else }}
-          {{ template "section-tree-nav-section" (dict "page" $p "section" .) }}
+  {{ $s := .section }}
+  {{ $p := .page }}
+  {{ $shouldDelayActive := .shouldDelayActive }}
+  {{ $sidebarMenuTruncate := .sidebarMenuTruncate }}
+  {{ $treeRoot := cond (eq .ulNr 0) true false }}
+  {{ $ulNr := .ulNr }}
+  {{ $ulShow := .ulShow }}
+  {{ $active := and (not $shouldDelayActive) (eq $s $p) }}
+  {{ $activePath := and (not $shouldDelayActive) ($p.IsDescendant $s) }}
+  {{ $show := cond (or (lt $ulNr $ulShow) $activePath (and (not $shouldDelayActive) (eq $s.Parent $p.Parent)) (and (not $shouldDelayActive) (eq $s.Parent $p)) (not $p.Site.Params.ui.sidebar_menu_compact)) true false }}
+  {{ $mid := printf "m-%s" ($s.RelPermalink | anchorize) }}
+  {{ $pages_tmp := where (union $s.Pages $s.Sections).ByWeight ".Params.toc_hide" "!=" true }}
+  {{ $pages := $pages_tmp | first $sidebarMenuTruncate }}
+  {{ $withChild := gt (len $pages) 0 }}
+  <li class="td-sidebar-nav__section-title td-sidebar-nav__section{{ if $withChild }} with-child{{ else }} without-child{{ end }}{{ if $activePath }} active-path{{ end }}{{ if not $show }} collapse{{ end }}" id="{{ $mid }}-li">
+    <span class="{{ if $active }}td-sidebar-nav-active-item{{ end }}{{ if $treeRoot }} tree-root{{ end }}">
+      <a  href="{{ $s.RelPermalink }}" class="align-left pl-0 pr-2{{ if $active}} active{{ end }} td-sidebar-link{{ if $s.IsPage }} td-sidebar-link__page{{ else }} td-sidebar-link__section{{ end }}" id="{{ $mid }}">{{ $s.LinkTitle }}</a>
+    </span>
+    {{if $withChild }}
+      {{ $ulNr := add $ulNr 1 }}
+      <ul class="pr-md-3 ul-{{ $ulNr }}">
+        {{ range $pages }}
+          {{ if (not (and (eq $s $p.Site.Home) (eq .Params.toc_root true))) }}
+            {{ template "section-tree-nav-section" (dict "page" $p "section" . "shouldDelayActive" $shouldDelayActive "sidebarMenuTruncate" $sidebarMenuTruncate "ulNr" $ulNr "ulShow" $ulShow) }}
+          {{ end }}
         {{ end }}
-      {{ end }}
-      {{ end }}
-    </li>
-  </ul>
-</ul>
+      </ul>
+    {{ end }}
+  </li>
 {{ end }}
diff --git a/layouts/partials/sidebar.html b/layouts/partials/sidebar.html
index bf568e2100..e2d113ffc6 100644
--- a/layouts/partials/sidebar.html
+++ b/layouts/partials/sidebar.html
@@ -1,14 +1,22 @@
 {{/* The "active" toggle here may delay rendering, so we only cache this side bar menu for bigger sites. */}}
-{{ $shouldCache := ge (len .Site.Pages) 2000 }}
+{{ $sidebarCacheLimit := cond (isset .Site.Params.ui "sidebar_cache_limit") .Site.Params.ui.sidebar_cache_limit 2000 }}
+{{ $shouldCache := ge (len .Site.Pages) $sidebarCacheLimit }}
+{{ $sidebarCacheTypeRoot := cond (isset .Site.Params.ui "sidebar_cache_type_root") .Site.Params.ui.sidebar_cache_type_root false }}
 {{ if $shouldCache }}
-{{ $mid := printf "m-%s" (.RelPermalink | anchorize) }}
-<script>
- $(function() {
- $("#td-sidebar-menu #{{ $mid }}").toggleClass("active"); 
- $("#td-sidebar-menu").toggleClass("d-none"); 
-});
-</script>
-{{ partialCached "sidebar-tree.html" . .CurrentSection.RelPermalink }}
+  {{ $mid := printf "m-%s" (.RelPermalink | anchorize) }}
+  <script>
+    $(function() {
+    $("#td-sidebar-menu a").removeClass("active");
+    $("#td-sidebar-menu #{{ $mid }}").addClass("active"); 
+    $("#td-sidebar-menu #{{ $mid }}-li span").addClass("td-sidebar-nav-active-item"); 
+    $("#td-sidebar-menu #{{ $mid }}").parents("li").addClass("active-path"); 
+    $("#td-sidebar-menu li.active-path").addClass("show"); 
+    $("#td-sidebar-menu #{{ $mid }}-li").siblings("li").addClass("show");  
+    $("#td-sidebar-menu #{{ $mid }}-li").children("ul").children("li").addClass("show");  
+    $("#td-sidebar-menu").toggleClass("d-none"); 
+    });
+  </script>
+  {{ partialCached "sidebar-tree.html" . .FirstSection.RelPermalink }}
 {{ else }}
-{{ partial "sidebar-tree.html" . }}
+  {{ partial "sidebar-tree.html" . }}
 {{ end }}

From 2a76db7b0052cbe8d66a943261415de9ed5d07f8 Mon Sep 17 00:00:00 2001
From: Franz Steininger <narrenfrei@gmail.com>
Date: Sun, 14 Mar 2021 22:22:27 +0100
Subject: [PATCH 2/3] Docs explanation for restructured section menu

---
 userguide/content/en/docs/Adding content/navigation.md | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/userguide/content/en/docs/Adding content/navigation.md b/userguide/content/en/docs/Adding content/navigation.md
index a63bdfd35c..6127630136 100644
--- a/userguide/content/en/docs/Adding content/navigation.md	
+++ b/userguide/content/en/docs/Adding content/navigation.md	
@@ -66,6 +66,10 @@ To hide a page or section from the menu, set `toc_hide: true` in front matter.
 
 By default, the section menu will show the current section fully expanded all the way down. This may make the left nav too long and difficult to scan for bigger sites. Try setting site param `ui.sidebar_menu_compact = true` in `config.toml`.
 
+With the compact menu (`.ui.sidebar_menu_compact = true`) only all ancestors, siblings and direct descendants are shown. In addition, the optional parameter `.ui.ul_show` can be used to set a desired menu depth to always be visible. For example, with `.ui.ul_show = 1` the 1st menu level can always be displayed.
+
+On large sites (default: > 2000 pages) the section menu will not get generated for each page, but cached for the whole scection. The HTML classes for marking the active menu item (and menu path) are then set using JS. The limit for activating the cached section menu can be adjusted with the optional parameter `.ui.sidebar_cache_limit`.
+
 ## Breadcrumb navigation
 
 Breadcrumb navigation is enabled by default. To disable breadcrumb navigation, set site param `ui.breadcrumb_disable = true` in `config.toml`.

From dedd546d25ccb30acf74c499637da91095ff1c51 Mon Sep 17 00:00:00 2001
From: LisaFC <lcarey@google.com>
Date: Mon, 15 Mar 2021 15:54:26 +0000
Subject: [PATCH 3/3] Few tweaks to text

---
 userguide/content/en/docs/Adding content/navigation.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/userguide/content/en/docs/Adding content/navigation.md b/userguide/content/en/docs/Adding content/navigation.md
index 6127630136..a1aa559b67 100644
--- a/userguide/content/en/docs/Adding content/navigation.md	
+++ b/userguide/content/en/docs/Adding content/navigation.md	
@@ -64,11 +64,11 @@ description: >
 
 To hide a page or section from the menu, set `toc_hide: true` in front matter.
 
-By default, the section menu will show the current section fully expanded all the way down. This may make the left nav too long and difficult to scan for bigger sites. Try setting site param `ui.sidebar_menu_compact = true` in `config.toml`.
+By default, the section menu shows the current section fully expanded all the way down. This may make the left nav too long and difficult to scan for bigger sites. Try setting site param `ui.sidebar_menu_compact = true` in `config.toml`.
 
-With the compact menu (`.ui.sidebar_menu_compact = true`) only all ancestors, siblings and direct descendants are shown. In addition, the optional parameter `.ui.ul_show` can be used to set a desired menu depth to always be visible. For example, with `.ui.ul_show = 1` the 1st menu level can always be displayed.
+With the compact menu (`.ui.sidebar_menu_compact = true`), only the current page's ancestors, siblings and direct descendants are shown. You can use the optional parameter `.ui.ul_show` to set a desired menu depth to always be visible. For example, with `.ui.ul_show = 1` the first menu level is always displayed.
 
-On large sites (default: > 2000 pages) the section menu will not get generated for each page, but cached for the whole scection. The HTML classes for marking the active menu item (and menu path) are then set using JS. The limit for activating the cached section menu can be adjusted with the optional parameter `.ui.sidebar_cache_limit`.
+On large sites (default: > 2000 pages) the section menu is not generated for each page, but cached for the whole section. The HTML classes for marking the active menu item (and menu path) are then set using JS. You can adjust the limit for activating the cached section menu with the optional parameter `.ui.sidebar_cache_limit`.
 
 ## Breadcrumb navigation