feat: add support for breadcrumb navigation (#2009)

Adds support for breadcrumb navigation on Book pages.

Consider this feature experimental for now as it may still change. Add the following to bottom of `params.toml` to use:

```
[breadcrumb]
  page_types = {book = true}
```

Future work: prefix link title with page icon when set in order to be consistent with Book menu links (https://github.com/wowchemy/wowchemy-hugo-modules/pull/2009#discussion_r549530364)

wowchemy/assets/scss/wowchemy/_breadcrumb.scss

@@ -0,0 +1,15 @@
+.breadcrumb {
+  font-size: 14px;
+  padding: 0rem;
+  background-color: transparent;
+  border-radius: 0rem;
+  margin-bottom: 0rem;
+}
+
+.breadcrumb-item.active {
+  color: rgba(0, 0, 0, 0.54);
+}
+
+.dark .breadcrumb-item.active {
+  color: rgba(255, 255, 255, 0.54);
+}

wowchemy/assets/scss/wowchemy/wowchemy.scss

@@ -20,3 +20,4 @@
 @import "dark";
 @import "integrations";
 @import "rtl";
+@import "breadcrumb";

wowchemy/i18n/da.yaml

@@ -6,6 +6,8 @@
   translation: På denne side
 - id: back_to_top
   translation: Til toppen
+- id: home
+  translation: Hjem
 - id: related
   translation: Relaterede
 - id: minute_read

wowchemy/i18n/en.yaml

@@ -12,6 +12,9 @@
 - id: back_to_top
   translation: Back to top
 
+- id: home
+  translation: Home
+
 # General
 
 - id: related

wowchemy/i18n/es.yaml

@@ -8,6 +8,8 @@
   translation: En esta página
 - id: back_to_top
   translation: Regreso al inicio
+- id: home
+  translation: Inicio
 
 # General
 

wowchemy/layouts/partials/book_layout.html

@@ -1,5 +1,9 @@
 {{ $current_page := . }}
 
+{{/* Check whether to show breadcrumb navigation. */}}
+{{ $breadcrumb_page_types := site.Params.breadcrumb.page_types | default dict }}
+{{ $show_breadcrumb := index $breadcrumb_page_types .Type | default false }}
+
 <div class="container-fluid docs">
   <div class="row flex-xl-nowrap">
     <div class="col-12 col-md-3 col-xl-2 docs-sidebar">
@@ -24,6 +28,10 @@
       <article class="article">
 
         <div class="docs-article-container">
+          {{ if $show_breadcrumb }}
+            {{ partial "breadcrumb" $current_page }}
+          {{ end }}
+
           <h1>{{ .Title }}</h1>
 
           <div class="article-style">

wowchemy/layouts/partials/breadcrumb.html

@@ -0,0 +1,10 @@
+{{ if not .IsHome }}
+  <nav aria-label="breadcrumb">
+    <ol class="breadcrumb">
+      {{ partial "breadcrumb_helper" . }}
+      <li class="breadcrumb-item active" aria-current="page">
+        {{ (.LinkTitle | default .Title) | emojify }}
+      </li>
+    </ol>
+  </nav>
+{{ end }}

wowchemy/layouts/partials/breadcrumb_helper.html

@@ -0,0 +1,12 @@
+{{ with .Parent }}
+  {{ partial "breadcrumb_helper" . }}
+  <li class="breadcrumb-item">
+    <a href="{{ .RelPermalink }}">
+      {{ if .IsHome }}
+        {{ i18n "home" | default "Home" }}
+      {{ else }}
+        {{ (.LinkTitle | default .Title) | emojify }}
+      {{ end }}
+    </a>
+  </li>
+{{ end }}