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"
|
||||
url = "/docs/help/"
|
||||
|
||||
[[docs]]
|
||||
name = "Lorem"
|
||||
weight = 70
|
||||
identifier = "lorem"
|
||||
url = "/docs/lorem/"
|
||||
|
||||
[[main]]
|
||||
name = "Docs"
|
||||
url = "/docs/prologue/introduction/"
|
||||
|
|
|
@ -84,6 +84,11 @@ lastMod = false
|
|||
breadCrumb = false
|
||||
highLight = true
|
||||
kaTex = false
|
||||
collapsibleSidebar = true
|
||||
multilingualMode = 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 -}}
|
||||
<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 -}}
|
||||
{{- $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 -}}
|
||||
{{ if and .Site.Params.menu.section.auto .Site.Params.menu.section.collapsibleSidebar -}}
|
||||
{{ partial "sidebar/auto-collapsible-menu.html" . -}}
|
||||
{{ else if and .Site.Params.menu.section.auto (not .Site.Params.menu.section.collapsibleSidebar) -}}
|
||||
{{ partial "sidebar/auto-default-menu.html" . -}}
|
||||
{{ else if and (not .Site.Params.menu.section.auto) .Site.Params.menu.section.collapsibleSidebar -}}
|
||||
{{ partial "sidebar/manual-collapsible-menu.html" . -}}
|
||||
{{ else if and (not .Site.Params.menu.section.auto) (not .Site.Params.menu.section.collapsibleSidebar) -}}
|
||||
{{ partial "sidebar/manual-default-menu.html" . -}}
|
||||
{{ 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