Merge pull request #617 from h-enk/section-menu
feat: add multi level section menu
This commit is contained in:
commit
54d04d58fc
|
@ -10,6 +10,12 @@
|
||||||
identifier = "help"
|
identifier = "help"
|
||||||
url = "/docs/help/"
|
url = "/docs/help/"
|
||||||
|
|
||||||
|
[[docs]]
|
||||||
|
name = "Lorem"
|
||||||
|
weight = 70
|
||||||
|
identifier = "lorem"
|
||||||
|
url = "/docs/lorem/"
|
||||||
|
|
||||||
[[main]]
|
[[main]]
|
||||||
name = "Docs"
|
name = "Docs"
|
||||||
url = "/docs/prologue/introduction/"
|
url = "/docs/prologue/introduction/"
|
||||||
|
|
|
@ -84,6 +84,11 @@ lastMod = false
|
||||||
breadCrumb = false
|
breadCrumb = false
|
||||||
highLight = true
|
highLight = true
|
||||||
kaTex = false
|
kaTex = false
|
||||||
collapsibleSidebar = true
|
|
||||||
multilingualMode = false
|
multilingualMode = false
|
||||||
docsVersioning = false
|
docsVersioning = false
|
||||||
|
|
||||||
|
[menu]
|
||||||
|
[menu.section]
|
||||||
|
auto = true
|
||||||
|
collapsibleSidebar = true
|
||||||
|
mainSections = ["docs"]
|
||||||
|
|
|
@ -0,0 +1,10 @@
|
||||||
|
---
|
||||||
|
title: "Lorem"
|
||||||
|
description: ""
|
||||||
|
lead: ""
|
||||||
|
date: 2022-01-18T19:58:14+01:00
|
||||||
|
lastmod: 2022-01-18T19:58:14+01:00
|
||||||
|
draft: true
|
||||||
|
images: []
|
||||||
|
toc: true
|
||||||
|
---
|
|
@ -0,0 +1,15 @@
|
||||||
|
---
|
||||||
|
title: "Ipsum"
|
||||||
|
description: ""
|
||||||
|
lead: ""
|
||||||
|
date: 2022-01-18T20:00:32+01:00
|
||||||
|
lastmod: 2022-01-18T20:00:32+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
menu:
|
||||||
|
docs:
|
||||||
|
parent: "lorem"
|
||||||
|
identifier: "ipsum"
|
||||||
|
weight: 999
|
||||||
|
toc: true
|
||||||
|
---
|
|
@ -0,0 +1,15 @@
|
||||||
|
---
|
||||||
|
title: "Amet"
|
||||||
|
description: ""
|
||||||
|
lead: ""
|
||||||
|
date: 2022-01-18T20:07:56+01:00
|
||||||
|
lastmod: 2022-01-18T20:07:56+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
menu:
|
||||||
|
docs:
|
||||||
|
parent: "ipsum"
|
||||||
|
identifier: "amet"
|
||||||
|
weight: 999
|
||||||
|
toc: true
|
||||||
|
---
|
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
title: "Consectetur"
|
||||||
|
description: ""
|
||||||
|
lead: ""
|
||||||
|
date: 2022-01-18T20:17:32+01:00
|
||||||
|
lastmod: 2022-01-18T20:17:32+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
menu:
|
||||||
|
docs:
|
||||||
|
parent: "amet"
|
||||||
|
weight: 730
|
||||||
|
toc: true
|
||||||
|
---
|
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
title: "Dolor"
|
||||||
|
description: ""
|
||||||
|
lead: ""
|
||||||
|
date: 2022-01-18T20:01:45+01:00
|
||||||
|
lastmod: 2022-01-18T20:01:45+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
menu:
|
||||||
|
docs:
|
||||||
|
parent: "ipsum"
|
||||||
|
weight: 700
|
||||||
|
toc: true
|
||||||
|
---
|
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
title: "Sit"
|
||||||
|
description: ""
|
||||||
|
lead: ""
|
||||||
|
date: 2022-01-18T20:05:19+01:00
|
||||||
|
lastmod: 2022-01-18T20:05:19+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
menu:
|
||||||
|
docs:
|
||||||
|
parent: "ipsum"
|
||||||
|
weight: 710
|
||||||
|
toc: true
|
||||||
|
---
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
title: "Tutorial"
|
||||||
|
description: ""
|
||||||
|
date: 2022-01-25T14:40:56+01:00
|
||||||
|
lastmod: 2022-01-25T14:40:56+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
---
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
title: "Lorem"
|
||||||
|
description: ""
|
||||||
|
date: 2022-01-25T14:41:21+01:00
|
||||||
|
lastmod: 2022-01-25T14:41:21+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
---
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
title: "Ipsum"
|
||||||
|
description: ""
|
||||||
|
date: 2022-01-25T14:41:39+01:00
|
||||||
|
lastmod: 2022-01-25T14:41:39+01:00
|
||||||
|
draft: false
|
||||||
|
images: []
|
||||||
|
---
|
|
@ -0,0 +1,56 @@
|
||||||
|
<!-- Auto collapsible section menu -->
|
||||||
|
<ul class="list-unstyled collapsible-sidebar">
|
||||||
|
{{ $currentPage := . -}}
|
||||||
|
{{ range (where .Site.Sections "Section" "in" site.Params.menu.section.mainSections) }}
|
||||||
|
{{ range .Sections.Reverse }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li class="mb-1">
|
||||||
|
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
||||||
|
{{ .Title }}
|
||||||
|
</button>
|
||||||
|
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
|
||||||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{ if .IsNode }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li class="my-1 ms-3">
|
||||||
|
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
||||||
|
{{ .Title }}
|
||||||
|
</button>
|
||||||
|
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
|
||||||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{ if .IsNode }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li class="my-1 ms-3">
|
||||||
|
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
||||||
|
{{ .Title }}
|
||||||
|
</button>
|
||||||
|
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
|
||||||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{ else }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{ else }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
|
@ -0,0 +1,36 @@
|
||||||
|
<!-- Auto default section menu -->
|
||||||
|
{{ $currentPage := . -}}
|
||||||
|
{{ range (where .Site.Sections "Section" "in" site.Params.menu.section.mainSections) }}
|
||||||
|
{{ range .Sections.Reverse }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<h3 class="h6 text-uppercase mb-2">{{ .Title }}</h3>
|
||||||
|
<ul class="list-unstyled">
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{ if .IsNode }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<h4 class="h6 text-uppercase ms-3 mt-3 mb-2">{{ .Title }}</h4>
|
||||||
|
<ul class="list-unstyled ms-3">
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{ if .IsNode }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<h5 class="h6 text-uppercase mt-2 mb-2">{{ .Title }}</h5>
|
||||||
|
<ul class="list-unstyled ms-3">
|
||||||
|
{{ range .Pages }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
{{ else }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
{{ else }}
|
||||||
|
{{ $active := in $currentPage.RelPermalink .RelPermalink }}
|
||||||
|
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
|
@ -1,39 +1,9 @@
|
||||||
{{ if .Site.Params.options.collapsibleSidebar -}}
|
{{ if and .Site.Params.menu.section.auto .Site.Params.menu.section.collapsibleSidebar -}}
|
||||||
<ul class="list-unstyled collapsible-sidebar">
|
{{ partial "sidebar/auto-collapsible-menu.html" . -}}
|
||||||
{{ $currentPage := . -}}
|
{{ else if and .Site.Params.menu.section.auto (not .Site.Params.menu.section.collapsibleSidebar) -}}
|
||||||
{{ range $index, $element := .Site.Menus.docs -}}
|
{{ partial "sidebar/auto-default-menu.html" . -}}
|
||||||
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
{{ else if and (not .Site.Params.menu.section.auto) .Site.Params.menu.section.collapsibleSidebar -}}
|
||||||
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
{{ partial "sidebar/manual-collapsible-menu.html" . -}}
|
||||||
<li class="mb-1">
|
{{ else if and (not .Site.Params.menu.section.auto) (not .Site.Params.menu.section.collapsibleSidebar) -}}
|
||||||
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
{{ partial "sidebar/manual-default-menu.html" . -}}
|
||||||
{{ .Name }}
|
|
||||||
</button>
|
|
||||||
{{ if .HasChildren -}}
|
|
||||||
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
|
|
||||||
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
|
||||||
{{ range .Children -}}
|
|
||||||
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
|
||||||
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
|
||||||
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
|
||||||
{{ end -}}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
{{ end -}}
|
|
||||||
</li>
|
|
||||||
{{ end -}}
|
|
||||||
</ul>
|
|
||||||
{{ else -}}
|
|
||||||
{{ $currentPage := . -}}
|
|
||||||
{{ range .Site.Menus.docs -}}
|
|
||||||
<h3 class="h6 text-uppercase">{{ .Name }}</h3>
|
|
||||||
{{ if .HasChildren -}}
|
|
||||||
<ul class="list-unstyled">
|
|
||||||
{{ range .Children -}}
|
|
||||||
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
|
||||||
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
|
||||||
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
|
||||||
{{ end -}}
|
|
||||||
</ul>
|
|
||||||
{{ end -}}
|
|
||||||
{{ end -}}
|
|
||||||
{{ end -}}
|
{{ end -}}
|
|
@ -0,0 +1,62 @@
|
||||||
|
<!-- Manual collapsible section menu -->
|
||||||
|
<ul class="list-unstyled collapsible-sidebar">
|
||||||
|
{{ $currentPage := . -}}
|
||||||
|
{{ range $index, $element := .Site.Menus.docs -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li class="mb-1">
|
||||||
|
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
||||||
|
{{ .Name }}
|
||||||
|
</button>
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
|
||||||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
||||||
|
{{ range .Children -}}
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<li class="my-1 ms-3">
|
||||||
|
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
||||||
|
{{ .Name }}
|
||||||
|
</button>
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
|
||||||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
||||||
|
{{ range .Children -}}
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<li class="my-1 ms-3">
|
||||||
|
<button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
|
||||||
|
{{ .Name }}
|
||||||
|
</button>
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
|
||||||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
|
||||||
|
{{ range .Children -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{{ end -}}
|
||||||
|
</li>
|
||||||
|
{{ else -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end -}}
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{{ end -}}
|
||||||
|
</li>
|
||||||
|
{{ else -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end -}}
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{{ end -}}
|
||||||
|
</li>
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
|
@ -0,0 +1,40 @@
|
||||||
|
<!-- Manual default section menu -->
|
||||||
|
{{ $currentPage := . -}}
|
||||||
|
{{ range .Site.Menus.docs -}}
|
||||||
|
<h3 class="h6 text-uppercase mb-2">{{ .Name }}</h3>
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<ul class="list-unstyled">
|
||||||
|
{{ range .Children -}}
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<h4 class="h6 text-uppercase ms-3 mt-3 mb-2">{{ .Name }}</h4>
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<ul class="list-unstyled ms-3">
|
||||||
|
{{ range .Children -}}
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<h5 class="h6 text-uppercase mt-2 mb-2">{{ .Name }}</h5>
|
||||||
|
{{ if .HasChildren -}}
|
||||||
|
<ul class="list-unstyled ms-3">
|
||||||
|
{{ range .Children -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
||||||
|
{{ end -}}
|
||||||
|
{{ else -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end -}}
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
||||||
|
{{ end -}}
|
||||||
|
{{ else -}}
|
||||||
|
{{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
|
||||||
|
{{- $active = or $active (eq $currentPage.Section .Identifier) -}}
|
||||||
|
<li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
|
||||||
|
{{ end -}}
|
||||||
|
{{ end -}}
|
||||||
|
</ul>
|
||||||
|
{{ end -}}
|
||||||
|
{{ end -}}
|
Loading…
Reference in New Issue