danielandClaude Sonnet 5
071ee344a3
A `main` menu entry with child entries (others with `parent:` set) is now rendered as a Bootstrap dropdown; flat entries are unchanged. Active-state highlighting is trailing-slash tolerant and marks the dropdown parent active when one of its children is the current page. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
55 lines
2.4 KiB
HTML
55 lines
2.4 KiB
HTML
<nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
|
|
<div class="container"> <!-- Changed from container-fluid to container -->
|
|
<a class="navbar-brand fw-bold" href="{{ .Site.BaseURL }}">
|
|
{{- $logo := "img/favicon.svg" -}}
|
|
{{- if os.FileExists "static/img/logo.svg" -}}{{- $logo = "img/logo.svg" -}}{{- end -}}
|
|
<img src="{{ $logo | relURL }}" alt="{{ .Site.Title }}" title="{{ .Site.Title }}">
|
|
</a>
|
|
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false"
|
|
aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ms-auto">
|
|
{{- /* Current page, without a trailing slash, for menu-item highlighting. */ -}}
|
|
{{- $current := strings.TrimSuffix "/" .RelPermalink -}}
|
|
{{- range .Site.Menus.main -}}
|
|
{{- $isActive := and .URL (eq (strings.TrimSuffix "/" .URL) $current) -}}
|
|
{{- if .HasChildren -}}
|
|
{{- /* A menu entry with sub-entries (set `parent:` on them) becomes a dropdown. */ -}}
|
|
{{- range .Children -}}
|
|
{{- if and .URL (eq (strings.TrimSuffix "/" .URL) $current) }}{{ $isActive = true }}{{ end -}}
|
|
{{- end -}}
|
|
{{- $id := printf "navbar-%s" (.Identifier | default (.Name | urlize)) -}}
|
|
<li class="nav-item dropdown">
|
|
<a class="nav-link dropdown-toggle{{ if $isActive }} active{{ end }}" href="#"
|
|
id="{{ $id }}" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
|
{{ .Name }}
|
|
</a>
|
|
<ul class="dropdown-menu" aria-labelledby="{{ $id }}">
|
|
{{- range .Children }}
|
|
<li>
|
|
<a class="dropdown-item{{ if and .URL (eq (strings.TrimSuffix "/" .URL) $current) }} active{{ end }}"
|
|
href="{{ .URL }}">
|
|
{{ .Name }}
|
|
</a>
|
|
</li>
|
|
{{- end }}
|
|
</ul>
|
|
</li>
|
|
{{- else -}}
|
|
<li class="nav-item">
|
|
<a class="nav-link{{ if $isActive }} active{{ end }}" href="{{ .URL }}">
|
|
{{ .Name }}
|
|
</a>
|
|
</li>
|
|
{{- end -}}
|
|
{{- end }}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|