use details to only open current section in docs menu

This commit is contained in:
a 2022-12-11 18:29:48 -06:00
parent 89c0a4dca9
commit 317e9651c9
1 changed files with 37 additions and 33 deletions

View File

@ -9,53 +9,44 @@
<a id="menu" href="#top">Skip menu</a>
{{ $currentPage := . }}
{{ range .Site.Menus.docs }}
{{ if .HasChildren}}
<li
class='section-title{{ if or ($currentPage.IsMenuCurrent "docs" .) (eq $currentPage.Section .Identifier) }} active{{ end }}'>
<a href="{{ .URL | relLangURL }}">
{{ $active := or ($currentPage.IsMenuCurrent "docs" .) (eq $currentPage.Section .Identifier)}}
{{ if .HasChildren }}
<details
class='section-title
{{- if $active }} active{{ end -}}
'
{{- if $active }} open{{ end -}}>
<summary href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
{{ .Post }}
</a>
</summary>
<ul class="sub-menu">
{{ range .Children }}
{{ if .HasChildren}}
<li
class='{{ if or ($currentPage.IsMenuCurrent "docs" .) (eq $currentPage.Section .Identifier) }} active{{ end }}'>
<a href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
{{ .Post }}
</a>
<ul class="sub-menu">
{{ range .Children }}
<li
class='{{ if or ($currentPage.IsMenuCurrent "docs" .) (eq $currentPage.Section .Identifier) }}active{{ end }}'>
class='{{- if $active }} active{{ end -}}'>
<a href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
{{ .Post }}
</a>
</li>
{{ end }}
</ul>
</li>
<ul class="sub-menu">
{{ range .Children }}
<li
class='{{- if $active }} active{{ end -}}'>
<a href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
{{ .Post }}
</a>
</li>
{{ end }}
</ul>
</details>
{{ else }}
<li
class='{{ if or ($currentPage.IsMenuCurrent "docs" .) (eq $currentPage.Section .Identifier) }}active{{ end }}'>
<a href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
{{ .Post }}
</a>
</li>
{{ end }}
{{ end }}
</ul>
</li>
{{ else }}
<li
class='{{ if or ($currentPage.IsMenuCurrent "docs" .) (eq $currentPage.Section .Identifier) }}active{{ end }}'>
class='{{- if $active }} active{{ end -}}'>
<a href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
@ -65,5 +56,18 @@
{{ end }}
{{ end }}
</ul>
</li>
{{ else }}
<li
class='{{- if $active }} active{{ end -}}'>
<a href="{{ .URL | relLangURL }}">
{{ .Pre }}
<span>{{ .Name }}</span>
{{ .Post }}
</a>
</li>
{{ end }}
{{ end }}
</ul>
</div>
</nav>