feat: add optional breadcrumb trail

thuliteio · Mar 5, 2021 · 9c67aca · 9c67aca
1 parent 7eeba78
commit 9c67aca
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 1 deletion.
diff --git a/assets/scss/layouts/_pages.scss b/assets/scss/layouts/_pages.scss
@@ -38,3 +38,8 @@ p.meta {
   margin-top: 0.5rem;
   font-size: $font-size-base;
 }
+
+.breadcrumb {
+  margin-top: 2.25rem;
+  font-size: $font-size-base;
+}
diff --git a/config/_default/params.toml b/config/_default/params.toml
@@ -53,3 +53,4 @@ editPage = false
   flexSearch = true
   darkMode = true
   bootStrapJs = false
+  breadCrumb = false
diff --git a/layouts/docs/single.html b/layouts/docs/single.html
@@ -3,7 +3,7 @@
 		<div class="col-lg-5 col-xl-4 docs-sidebar">
 			<nav class="docs-links" aria-label="Main navigation">
 				{{ partial "sidebar/docs-menu.html" . }}
-			</nav>        
+			</nav>
 		</div>
 		{{ if ne .Params.toc false -}}
 		<nav class="docs-toc d-none d-xl-block col-xl-3" aria-label="Secondary navigation">
@@ -15,6 +15,15 @@
 		{{ else -}}
 		<main class="docs-content col-lg-11 col-xl-9 mx-xl-auto">
 		{{ end -}}
+			{{ if .Site.Params.options.breadCrumb -}}
+				<!-- https://discourse.gohugo.io/t/breadcrumb-navigation-for-highly-nested-content/27359/6 -->
+				<nav aria-label="breadcrumb">
+					<ol class="breadcrumb">
+						{{ partial "main/breadcrumb" . -}}
+						<li class="breadcrumb-item active" aria-current="page">{{ .Title }}</li>
+					</ol>
+				</nav>
+			{{ end }}
 			<h1>{{ .Title }}</h1>
 			<p class="lead">{{ .Params.lead | safeHTML }}</p>
 			{{ partial "main/headline-hash.html" .Content }}

diff --git a/layouts/partials/main/breadcrumb.html b/layouts/partials/main/breadcrumb.html
@@ -0,0 +1,4 @@
+{{ with .Parent -}}
+  {{ partial "main/breadcrumb.html" . -}}
+  <li class="breadcrumb-item"><a href="{{ .Permalink }}">{{ if .IsHome }}Home{{ else }}{{ .Title }}{{ end }}</a></li>
+{{ end -}}