menu: let sidebar elements behave the same for default and user config #1059

assets/css/theme.css

@@ -350,6 +350,41 @@ a:focus,
   margin-top: 0;
 }
 
+/* visibility for sidebarheader is tricky; first and last divider may have different colors
+than the ones in between, so they need to have privileged visibility; order is:
+- last
+- first
+- in between
+*/
+#R-sidebar .R-sidebarmenu:not(:has(> ul > *)) {
+  /* hide all empty menus */
+  display: none;
+}
+#R-sidebar .R-menu-divider:not(:has(+ .R-sidebarmenu > ul > *)) hr {
+  /* hide all upper hrs if the following menu has no entries,
+  this is common for all menu regardless of header, body or footer */
+  display: none;
+}
+#R-homelinks .R-menu-divider:first-child:not(:has(+ .R-sidebarmenu > ul > *)):has(~ .R-sidebarmenu > ul > *) hr {
+  /* in case if the first menu is empty and we have some other menus to follow, we have
+  to show the first divider because of different coloring */
+  display: revert;
+}
+#R-homelinks .R-menu-divider:first-child + .R-sidebarmenu:not(:has(> ul > *)) ~ .R-menu-divider:has(+ .R-sidebarmenu > ul > *) hr {
+  /* in case if the first menu is empty and we have some other menus to follow, we have
+  to hide the first following menus divider because of different coloring;
+  this selector selects all following menus, so we have to write a follow up
+  rule to remove that effect on all but the first */
+  display: none;
+}
+#R-sidebar #R-homelinks .R-menu-divider:has(+ .R-sidebarmenu > ul > *) ~ .R-menu-divider:has(+ .R-sidebarmenu > ul > *) hr {
+  /* the mentioned follow up rule from above */
+  display: revert;
+}
+#R-sidebar #R-homelinks .R-menu-divider:last-child hr {
+  display: revert;
+}
+
 #R-content-wrapper hr {
   border-color: var(--INTERNAL-MENU-SECTION-SEPARATOR-color);
 }

docs/content/configuration/sidebar/menus/_index.en.md

@@ -226,9 +226,10 @@ As these options are arrays, you can define as many menus, as you like in each a
 If you don't set these options in your `hugo.toml`, the theme defaults as follows:
 
 - `sidebarheadermenus`:
+  - a divider to separate from the logo (depending on the color configuration of the theme variant) if any of the following is configured
   - a home button if [configured](configuration/sidebar/headerfooter#home-button-configuration), if you redefine this, use a Hugo menu and a `type=menu` to replicate this
   - the version switcher if versioning is [configured](configuration/sitemanagement/versioning)
-  - a divider to separate from the `sidebarmenus` (depending on the configuration of the theme variant)
+  - a divider to separate from the `sidebarmenus` (depending on the color configuration of the theme variant)
 - `sidebarmenus`:
   - the main page menu based on your [content structure](authoring/structure)
   - the `shortcuts` menu including the title if [configured](#predefined-shortcuts-menu)
@@ -238,8 +239,6 @@ If you don't set these options in your `hugo.toml`, the theme defaults as follow
   - the variant switcher if multiple variants are [configured](configuration/branding/colors/#multiple-variants)
   - the history clearer if you [configured](configuration/sidebar/headerfooter#history) to mark visited pages
 
-However, if you decide to overwrite these options, the configuration for those features will not be taken into account anymore. For example, if you want to reorder the `sidebarfootermenus` by setting
-
 {{< multiconfig section=params >}}
 sidebarfootermenus = [
   { type = 'divider' },

layouts/partials/_relearn/defaultSidebar.gotmpl

@@ -1,9 +1,11 @@
-{{- $defaultmenuconfigs := slice
+{{- $defaultmenuconfigs := slice }}
+
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append
   (dict "type" "page" "identifier" "home")
 }}
-{{- if index site.Menus "shortcuts" }}
+
-  {{- $defaultmenuconfigs = $defaultmenuconfigs | append
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append
   (dict "type" "menu" "identifier" "shortcuts" "disableTitle" site.Params.disableShortcutsTitle)
-  }}
+}}
-{{- end }}
+
 {{- return $defaultmenuconfigs }}

layouts/partials/_relearn/defaultSidebarFooter.gotmpl

@@ -1,27 +1,13 @@
 {{- $defaultmenuconfigs := slice }}
 {{- $defaultconfigelements := slice }}
 
-{{- $siteLanguages := site.Languages }}
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append (dict "type" "divider") }}
-{{- $showlangswitch := and hugo.IsMultilingual (not site.Params.disableLanguageSwitchingButton) (gt (int (len $siteLanguages)) 1) }}
-{{- if $showlangswitch }}
-  {{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "languageswitcher") }}
-{{- end }}
 
-{{- $themevariants := partialCached "_relearn/themeVariants.gotmpl" . }}
+{{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "languageswitcher") }}
-{{- $showvariantswitch := gt (int (len $themevariants)) 1 }}
+{{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "variantswitcher") }}
-{{- if $showvariantswitch }}
+{{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "historyclearer") }}
-  {{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "variantswitcher") }}
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append
-{{- end }}
-
-{{- $showvisitedlinks := site.Params.showVisitedLinks }}
-{{- if $showvisitedlinks }}
-  {{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "historyclearer") }}
-{{- end }}
-
-{{- if $defaultconfigelements }}
-  {{- $defaultmenuconfigs = $defaultmenuconfigs | append (dict "type" "divider") }}
-  {{- $defaultmenuconfigs = $defaultmenuconfigs | append
   (dict "type" "custom" "identifier" "controls" "disableTitle" true "elements" $defaultconfigelements)
-  }}
+}}
-{{- end }}
+
 {{- return $defaultmenuconfigs }}

layouts/partials/_relearn/defaultSidebarHeader.gotmpl

@@ -1,6 +1,9 @@
 {{- $defaultmenuconfigs := slice }}
+{{- $defaultconfigentries := slice }}
 {{- $defaultconfigelements := slice }}
 
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append (dict "type" "divider") }}
+
 {{- if not site.Params.disableLandingPageButton }}
   {{- if (ne site.Params.landingPageURL nil) }}
     {{- warnf "UNSUPPORTED usage of 'landingPageURL' config parameter found, remove it and optionally overwrite the `logo.html` partial to provide a link if it should not point to the project's home page; see https://mcshelby.github.io/hugo-theme-relearn/introduction/releasenotes/4/#4-2-0" }}
@@ -16,26 +19,23 @@
     {{- $title = T "home-button" }}
     {{- $pre = `<i class="fa-fw fas fa-home"></i> ` | safeHTML }}
   {{- end }}
-  {{- $defaultmenuconfigs = $defaultmenuconfigs | append (dict "type" "divider") }}
+  {{- $defaultconfigentries = $defaultconfigentries | append
-  {{- $defaultmenuconfigs = $defaultmenuconfigs | append
-    (dict "type" "menu" "identifier" "homelinks" "disableTitle" true "entries" (slice
-      (dict "Menu" "" "Children" (slice
     (dict "Menu" "" "Pre" $pre "Post" $post "Title" $title "PageRef" "/" )
-      ))
-    ))
-  }}
-{{- end }}
-
-{{- $versions := partialCached "_relearn/siteVersions.gotmpl" . }}
-{{- if $versions }}
-  {{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "versionswitcher") }}
-{{- end }}
-
-{{- if $defaultconfigelements }}
-  {{- $defaultmenuconfigs = $defaultmenuconfigs | append
-    (dict "type" "custom" "identifier" "controls" "disableTitle" true "elements" $defaultconfigelements)
   }}
 {{- end }}
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append
+  (dict "type" "menu" "identifier" "homelinks" "disableTitle" true "entries" (slice
+    (dict "Menu" "" "Children" $defaultconfigentries)
+  ))
+}}
 
 {{- $defaultmenuconfigs = $defaultmenuconfigs | append (dict "type" "divider") }}
+
+{{- $defaultconfigelements = $defaultconfigelements | append (dict "type" "versionswitcher") }}
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append
+  (dict "type" "custom" "identifier" "controls" "disableTitle" true "elements" $defaultconfigelements)
+}}
+
+{{- $defaultmenuconfigs = $defaultmenuconfigs | append (dict "type" "divider") }}
+
 {{- return $defaultmenuconfigs }}

layouts/partials/menu.html

@@ -78,7 +78,7 @@
   {{- $currentNode := .currentnode }}
   {{- $config := .config }}
   {{- $showvisitedlinks := .showvisitedlinks }}
-        <div id="R-shortcutmenu-{{ $config.identifier }}" class="R-sidebarmenu">
+        <div class="R-sidebarmenu R-shortcutmenu-{{ $config.identifier }}">
   {{- $rootObject := site.Home }}
   {{- if $config.pageRef }}
     {{- $rootObject = partial "_relearn/refObject.gotmpl" (dict "page" $currentNode "objectRef" $config.pageRef) }}
@@ -87,14 +87,15 @@
       {{- partial "_relearn/urlErrorReport.gotmpl" (dict "url" $config.pageRef "page" $currentNode "param" "link" "msg" $msg) }}
     {{- end }}
   {{- end }}
-  {{- with $rootObject }}
-    {{- $entry := . }}
-    {{- $entries := partialCached "_relearn/pages.gotmpl" (dict "page" $entry) $entry.Path }}
   {{- $title := "" }}
-    {{- if not ($config.disableTitle | default true) }}
+  {{- if and $rootObject (not ($config.disableTitle | default true)) }}
-      {{- $title = $entry.Params.menuTitle | default (T (print $config.identifier "-menuTitle")) }}
+    {{- $title = $rootObject.Params.menuTitle | default (T (print $config.identifier "-menuTitle")) }}
   {{- end }}
-    {{- with $title }}
+  {{- $entries := "" }}
+  {{- with $rootObject }}
+    {{- $entries = partialCached "_relearn/pages.gotmpl" (dict "page" .) .Path }}
+  {{- end }}
+  {{- with and $entries $title }}
           <div class="nav-title padding">{{ . }}</div>
   {{- end }}
   {{- $classes := "space " }}
@@ -102,6 +103,8 @@
     {{- $classes = "enlarge morespace " }}
   {{- end }}
           <ul class="{{ $classes }}collapsible-menu">
+  {{- with $rootObject }}
+    {{- $entry := . }}
     {{- $defaultAlwaysopen := site.Params.alwaysopen | default false }}
     {{- range $entries }}
       {{- $isSubSelf := eq . $currentNode }}
@@ -114,10 +117,10 @@
         {{- $id := md5 .Path }}
         {{- partialCached "partials/inline/page-walker" (dict "sect" . "currentnode" $currentNode "showvisitedlinks" $showvisitedlinks "alwaysopen" $defaultAlwaysopen "isSelf" $isSubSelf "isAncestor" $isSubAncestor "isHidden" $isSubHidden) $id }}
       {{- end }}
+    {{- end }}
   {{- end }}
           </ul>
         </div>
-  {{- end }}
 {{- end }}
 {{- define "partials/inline/page-walker" }}
   {{- $currentNode := .currentnode }}
@@ -223,12 +226,11 @@
   {{- $currentNode := .currentnode }}
   {{- $config := .config }}
   {{- $showvisitedlinks := .showvisitedlinks }}
-  {{- with .entries }}
+        <div class="R-sidebarmenu R-shortcutmenu-{{ $config.identifier }}">
-        <div id="R-shortcutmenu-{{ $config.identifier }}" class="R-sidebarmenu">
   {{- $topLevelMenu := "" }}
   {{- $topLevelObject := "" }}
-    {{- $entries := . }}
+  {{- $entries := .entries | default "" }}
-    {{- with and (eq (len $entries) 1) (index $entries 0) }}
+  {{- with and $entries (eq (len $entries) 1) (index $entries 0) }}
     {{- if and (not .PageRef) (not .URL) }}
       {{- /* because in Hugo menus can not have parameter but menu entries can,
         we can flag a single top level menu entry as a container; this container
@@ -247,7 +249,7 @@
       {{- $title = T (print $config.identifier "-menuTitle") }}
     {{- end }}
   {{- end }}
-    {{- with $title }}
+  {{- with and $entries $title }}
           <div class="nav-title padding">{{ . }}</div>
   {{- end }}
   {{- $classes := "space " }}
@@ -255,6 +257,8 @@
     {{- $classes = "enlarge morespace " }}
   {{- end }}
           <ul class="{{ $classes }}collapsible-menu">
+  {{- with $entries }}
+    {{- $entries := . }}
     {{- $root := or $topLevelMenu site }}
     {{- $defaultAlwaysopen := site.Params.alwaysopen | default false }}
     {{- range $entries }}
@@ -270,14 +274,14 @@
         {{- partialCached "partials/inline/menu-walker" (dict "menu" . "currentnode" $currentNode "showvisitedlinks" $showvisitedlinks "alwaysopen" $defaultAlwaysopen "isSelf" $isSubSelf "isAncestor" $isSubAncestor "isHidden" $isSubHidden "root" $root) $id }}
       {{- end }}
     {{- end }}
-          </ul>
-        </div>
   {{- else }}
-    {{- if not (isset $config "entries") }}
+    {{- if and (not (isset $config "entries")) (ne $config.identifier "shortcuts") }}
       {{- $msg := printf "config option 'identifier' for 'sidebarmenus' %q is not a menu" $config.identifier }}
       {{- partial "_relearn/urlErrorReport.gotmpl" (dict "url" $config.pageRef "page" $currentNode "param" "link" "msg" $msg "applyErrorIgnore" false) }}
     {{- end }}
   {{- end }}
+          </ul>
+        </div>
 {{- end }}
 {{- define "partials/inline/menu-walker" }}
   {{- $currentNode := .currentnode }}
@@ -378,19 +382,17 @@
 {{- define "partials/inline/custom-list" }}
   {{- $currentNode := .currentnode }}
   {{- $config := .config }}
-  {{- with .elements }}
+        <div class="R-sidebarmenu R-shortcutmenu-{{ $config.identifier }}">
-        <div id="R-shortcutmenu-{{ $config.identifier }}" class="R-sidebarmenu">
   {{- $classes := "" }}
   {{- if ($config.main | default false) }}
     {{- $classes = "space" }}
   {{- end }}
           <ul class="{{ $classes }}">
-    {{- range . }}
+  {{- range .elements }}
     {{- partial (printf "sidebar/element/%s.html" .type) (dict "page" $currentNode "config" $config "element" .) }}
   {{- end }}
           </ul>
         </div>
-  {{- end }}
 {{- end }}
 
 {{- define "partials/inline/divider" }}

layouts/partials/sidebar/element/historyclearer.html

@@ -1,7 +1,9 @@
-{{- $icon := .element.icon | default "history" }}
+{{- $showvisitedlinks := site.Params.showVisitedLinks }}
-{{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
+{{- if $showvisitedlinks }}
+  {{- $icon := .element.icon | default "history" }}
+  {{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
     {{- $icon = printf "fa-fw fas fa-%s" $icon }}
-{{- end }}
+  {{- end }}
             <li class="R-historyclearer">
               <div class="padding menu-control">
                 <i class="{{ $icon }}"></i>
@@ -12,3 +14,4 @@
                 <div class="clear"></div>
               </div>
             </li>
+{{- end }}

layouts/partials/sidebar/element/languageswitcher.html

@@ -1,7 +1,10 @@
-{{- $icon := .element.icon | default "language" }}
+{{- $siteLanguages := site.Languages }}
-{{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
+{{- $showlangswitch := and hugo.IsMultilingual (not site.Params.disableLanguageSwitchingButton) (gt (int (len $siteLanguages)) 1) }}
+{{- if $showlangswitch }}
+  {{- $icon := .element.icon | default "language" }}
+  {{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
     {{- $icon = printf "fa-fw fas fa-%s" $icon }}
-{{- end }}
+  {{- end }}
 			<li class="R-languageswitcher">
               <div class="padding menu-control">
                 <i class="{{ $icon }}"></i>
@@ -18,3 +21,4 @@
                 <div class="clear"></div>
               </div>
             </li>
+{{- end }}

layouts/partials/sidebar/element/variantswitcher.html

@@ -1,8 +1,10 @@
-{{- $themevariants := partialCached "_relearn/themeVariants.gotmpl" .page }}
+{{- $themevariants := partialCached "_relearn/themeVariants.gotmpl" . }}
-{{- $icon := .element.icon | default "paint-brush" }}
+{{- $showvariantswitch := gt (int (len $themevariants)) 1 }}
-{{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
+{{- if $showvariantswitch }}
+  {{- $icon := .element.icon | default "paint-brush" }}
+  {{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
     {{- $icon = printf "fa-fw fas fa-%s" $icon }}
-{{- end }}
+  {{- end }}
             <li class="R-variantswitcher">
               <div class="padding menu-control">
                 <i class="{{ $icon }}"></i>
@@ -22,3 +24,4 @@
               </div>
               <script>window.relearn.markVariant();</script>
             </li>
+{{- end }}

layouts/partials/sidebar/element/versionswitcher.html

@@ -1,9 +1,10 @@
 {{- $versions := partialCached "_relearn/siteVersions.gotmpl" .page }}
-{{- $pageVersion := site.Params.version | default "" }}
+{{- if $versions }}
-{{- $icon := .element.icon | default "code-branch" }}
+  {{- $pageVersion := site.Params.version | default "" }}
-{{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
+  {{- $icon := .element.icon | default "code-branch" }}
+  {{- if and $icon (not (findRE ".*?\\bfa-\\w.*?" $icon)) }}
     {{- $icon = printf "fa-fw fas fa-%s" $icon }}
-{{- end }}
+  {{- end }}
             <li class="R-versionswitcher">
               <div class="padding menu-control">
                 <i class="{{ $icon }}"></i>
@@ -19,3 +20,4 @@
                 <div class="clear"></div>
               </div>
             </li>
+{{- end }}

layouts/partials/version.txt

@@ -1 +1 @@
-7.5.0+e2a1704c3c230050d3777be3bae36285a7fa0d8e
+7.5.0+fae610dae90549aaac0ba396bd6f2a884ba65702