Merge pull request #390 from gethinode/refinement

Standardize shortcodes
Merge branch 'main' into refinement
2025-10-07 10:04:22 +00:00 · 2023-08-05 17:33:29 +02:00 · 2023-08-05 17:26:22 +02:00 · 2023-08-05 17:24:34 +02:00 · 2023-08-05 16:09:16 +02:00 · 2023-08-05 16:08:27 +02:00
42 changed files with 395 additions and 228 deletions
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,5 +1,6 @@
 assets/js/critical/color.js
 assets/js/analytics.js
 assets/js/flexsearch.js
+assets/js/sharing.js
 assets/js/vendor
 node_modules
--- a/.github/dependabot.yml
+++ b/.github/dependabot.yml
@@ -7,3 +7,4 @@ updates:
    directory: "/"
    schedule:
      interval: "daily"
+    versioning-strategy: increase
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -24,5 +24,6 @@ jobs:
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
+        cache-dependency-path: '**/package-lock.json'
    - run: npm ci
    - run: npm run build
--- a/.github/workflows/lint.yml
+++ b/.github/workflows/lint.yml
@@ -19,10 +19,13 @@ jobs:

    steps:
    - uses: actions/checkout@v3
+
    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v3
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
+        cache-dependency-path: '**/package-lock.json'
+  
    - run: npm ci --ignore-scripts
    - run: npm run lint
--- a/assets/js/critical/color.js
+++ b/assets/js/critical/color.js
@@ -33,7 +33,7 @@
    const activeSelectors = document.querySelectorAll('.theme-icon-active')
    const activeButtons = document.querySelectorAll(`[data-bs-theme-value="${theme}"]`)
    if (activeButtons.length > 0) {
-      const activeIcon = activeButtons[0].querySelector('i')
+      const activeIcon = activeButtons[0].querySelector('span')

      document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
        element.classList.remove('active')
--- a/assets/js/sharing.js
+++ b/assets/js/sharing.js
@@ -0,0 +1,36 @@
+{{- if site.Params.sharing.webshare -}}
+
+// Adapted from: https://dev.to/j471n/how-to-share-anything-from-your-website-by-web-share-api-1h5g
+
+// function for Web Share API
+function webShareAPI (title, description, link) {
+  navigator
+    .share({
+      title,
+      text: description,
+      url: link
+    })
+    .then(() => console.log('Successful share'))
+    .catch((error) => console.log('Error sharing', error))
+}
+
+const shareBtn = document.getElementById('btn-webshare')
+
+if (shareBtn !== null) {
+  if (navigator.share) {
+    const title = shareBtn.getAttribute('data-sharing-title')
+    const description = shareBtn.getAttribute('data-sharing-description')
+    const url = shareBtn.getAttribute('data-sharing-url')
+
+    // show button if it supports webShareAPI
+    shareBtn.style.display = 'block'
+    shareBtn.addEventListener('click', () =>
+      webShareAPI(title, description, url)
+    )
+  } else {
+    // hide button if host does not support Web Share API
+    shareBtn.style.display = 'none'
+  }
+}
+
+{{- end -}}
--- a/assets/scss/common/_icons.scss
+++ b/assets/scss/common/_icons.scss
@@ -23,19 +23,3 @@ $btn-toggle:                                    url("/icons/btn-toggle.svg") !de
 $btn-toggle-dark:                               url("/icons/btn-toggle-dark.svg") !default;

 // scss-docs-end icons
-
-.fa-wrapper {
-    container: wrapper / inline-size;
-}
-
-// define fallback size for browsers not supporting containers
-.fa-fluid {
-    font-size: 5rem;
-}
-
-// set size based on container width
-@container (min-width: 0) {
-    .fa-wrapper .fa-fluid {
-        font-size: 60cqi;
-    }
-}
--- a/config/_default/menus/menus.en.toml
+++ b/config/_default/menus/menus.en.toml
@@ -32,19 +32,19 @@

 [[social]]
  name = "LinkedIn"
-  pre = "<i class=\"fab fa-linkedin fa-2x\"></i>"
+  pre = "fab linkedin"
  url = "https://linkedin.com/"
  weight = 10

 [[social]]
  name = "GitHub"
-  pre = "<i class=\"fab fa-github fa-2x\"></i>"
+  pre = "fab fa-github"
  url = "https://github.com/"
  weight = 20

 [[social]]
  name = "Medium"
-  pre = "<i class=\"fab fa-medium fa-2x\"></i>"
+  pre = "fab medium"
  url = "https://medium.com/"
  weight = 30

--- a/config/_default/menus/menus.nl.toml
+++ b/config/_default/menus/menus.nl.toml
@@ -32,19 +32,19 @@

 [[social]]
  name = "LinkedIn"
-  pre = "<i class=\"fab fa-linkedin fa-2x\"></i>"
+  pre = "fab linkedin"
  url = "https://linkedin.com/"
  weight = 10

 [[social]]
  name = "GitHub"
-  pre = "<i class=\"fab fa-github fa-2x\"></i>"
+  pre = "fab github"
  url = "https://github.com/"
  weight = 20

 [[social]]
  name = "Medium"
-  pre = "<i class=\"fab fa-medium fa-2x\"></i>"
+  pre = "fab medium"
  url = "https://medium.com/"
  weight = 30

--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -16,6 +16,10 @@
    optional = ["leaflet", "katex"]
    excludeSCSS = ["bootstrap"]
    disableTemplate = ["katex"]
+    [modules.fontawesome]
+        inline = true
+        debug = true
+        skipMissing = false
 # toml-docs-end modules

 # toml-docs-start debugging
@@ -63,6 +67,7 @@
    enabled = true
    sort = "weight"
    reverse = false
+    webshare = true

 [[sharing.providers]]
    name = "LinkedIn"
@@ -73,7 +78,7 @@
 [[sharing.providers]]
    name = "Twitter"
    url = "https://twitter.com/home?status={url}"
-    icon = "fab twitter"
+    icon = "fab x-twitter"
    weight = 20

 [[sharing.providers]]
--- a/content/en/about.md
+++ b/content/en/about.md
@@ -2,7 +2,7 @@
 title: About
 description: Hinode is a clean documentation and blog theme for your Hugo site based on Bootstrap 5.
 date: 2022-04-11
-updated: 2023-06-26
+updated: 2023-08-02
 showComments: false
 ---

@@ -12,17 +12,17 @@ showComments: false
    <div class="container-fluid">
        <div class="row justify-content-center text-center">
            <div class="col-lg-4">
-                <i class="fa-brands fa-bootstrap fa-2xl"></i>
+                {{< icon fab bootstrap fa-2xl >}}
                <h2 class="h4">Bootstrap framework</h2>
                <p>Build fast, responsive sites with Bootstrap 5. Easily customize your site with the source Sass files.</p>
            </div>
            <div class="col-lg-4">
-                <i class="fa-solid fa-magnifying-glass fa-2xl"></i>
+                {{< icon fas magnifying-glass fa-2xl >}}
                <h2 class="h4">Full text search</h2>
                <p>Search your site with FlexSearch, a full-text search library with zero dependencies.</p>
            </div>
            <div class="col-lg-4">
-                <i class="fa-solid fa-code fa-2xl"></i>
+                {{< icon fas code fa-2xl >}}
                <h2 class="h4">Development tools</h2>
                <p>Use Node Package Manager to automate the build process and to keep track of dependencies.</p>
            </div>
--- a/content/en/blog/bootstrap-elements.md
+++ b/content/en/blog/bootstrap-elements.md
@@ -1,7 +1,7 @@
 ---
 author: Mark Dumay
 title: Bootstrap elements
-date: 2023-05-20
+date: 2023-08-05
 description: Use shortcodes to add common Bootstrap elements with ease.
 tags: ["bootstrap", "shortcode"]
 thumbnail: img/boots.jpg
@@ -170,6 +170,28 @@ Use the `docs` shortcode to display the content of a `js`, `scss` or `toml` file

 {{< docs name="theme-colors" file="config/_default/params.toml" >}}

+## Example
+
+Use the `example` shortcode to display a code example and to render a preview of the same input.
+
+<!-- markdownlint-disable MD037 -->
+{{< example lang="hugo" >}}
+{{</* command */>}}
+export MY_VAR=123
+{{</* /command */>}}
+{{< /example >}}
+<!-- markdownlint-enable MD037 -->
+
+## File
+
+Use the `file` shortcode to print and highlight the full content of a given input file.
+
+<!-- markdownlint-disable MD037 -->
+{{< example lang="hugo" >}}
+{{</* file path="./config/_default/languages.toml" id="file-collapse-1" */>}}
+{{< /example >}}
+<!-- markdownlint-enable MD037 -->
+
 ## Icon

 As an example, the following shortcodes show a square check, a brand logo, and a circle check.
--- a/content/nl/about.md
+++ b/content/nl/about.md
@@ -3,7 +3,7 @@ slug: over-mij
 title: Over mij
 description: Een blog en documentatie thema voor Hugo gebaseerd op Bootstrap 5.
 date: 2023-02-17
-updated: 2023-06-26
+updated: 2023-08-02
 showComments: false
 ---

@@ -14,17 +14,17 @@ showComments: false
    <div class="row justify-content-center text-center">
    <div class="row justify-content-center text-center">
      <div class="col-lg-4">
-        <i class="fa-brands fa-bootstrap fa-2xl"></i>
+        {{< icon fab bootstrap fa-2xl >}}
        <h2 class="h4">Bootstrap raamwerk</h2>
        <p>Bouw snelle websites geschikt voor mobiele en desktop schermen met Bootstrap 5. Pas de site eenvoudig aan met bronbestanden in Sass.</p>
      </div>
      <div class="col-lg-4">
-        <i class="fa-solid fa-magnifying-glass fa-2xl"></i>
+        {{< icon fas magnifying-glass fa-2xl >}}
        <h2 class="h4">Volledig doorzoekbaar</h2>
        <p>Doorzoek je site met FlexSearch, een software bibliotheek zonder afhankelijkheden.</p>
      </div>
      <div class="col-lg-4">
-      <i class="fa-solid fa-code fa-2xl"></i>
+        {{< icon fas code fa-2xl >}}
        <h2 class="h4">Ontwikkelgereedschap</h2>
        <p>Gebruik Node Package Manager om het bouwproces inclusief versiebeheer volledig te automatiseren.</p>
      </div>
--- a/content/nl/blog/bootstrap-elements.md
+++ b/content/nl/blog/bootstrap-elements.md
@@ -2,7 +2,7 @@
 author: Mark Dumay
 title: Bootstrap elementen
 slug: bootstrap-elementen
-date: 2023-02-17
+date: 2023-08-05
 description: Gebruik shortcodes om eenvoudig Bootstrap elementen toe te voegen.
 tags: ["bootstrap", "shortcode"]
 thumbnail: img/boots.jpg
@@ -171,6 +171,28 @@ Gebruik de volgende shortcode om de inhoud van een `toml` of `scss` bestand te t

 {{< docs name="theme-colors" file="config/_default/params.toml" >}}

+## Example
+
+Gebruik de `example` shortcode om zowel de input als een voorbeeld van code te tonen.
+
+<!-- markdownlint-disable MD037 -->
+{{< example lang="hugo" >}}
+{{</* command */>}}
+export MY_VAR=123
+{{</* /command */>}}
+{{< /example >}}
+<!-- markdownlint-enable MD037 -->
+
+## File
+
+Gebruik de `file` shortcode om de volledige inhoud van een bestand te tonen, inclusief taalafhankelijke opmaak.
+
+<!-- markdownlint-disable MD037 -->
+{{< example lang="hugo" >}}
+{{</* file path="./config/_default/languages.toml" id="file-collapse-1" */>}}
+{{< /example >}}
+<!-- markdownlint-enable MD037 -->
+
 ## Icon

 De volgende shortcodes tonen drie verschillende iconen:
--- a/go.mod
+++ b/go.mod
@@ -4,8 +4,8 @@ go 1.19

 require (
 	github.com/gethinode/mod-bootstrap v1.1.1 // indirect
-	github.com/gethinode/mod-flexsearch v1.1.4 // indirect
-	github.com/gethinode/mod-fontawesome v1.2.1 // indirect
+	github.com/gethinode/mod-flexsearch v1.2.0 // indirect
+	github.com/gethinode/mod-fontawesome v1.2.4 // indirect
 	github.com/gethinode/mod-katex v1.0.2 // indirect
-	github.com/gethinode/mod-leaflet v0.3.3 // indirect
+	github.com/gethinode/mod-leaflet v0.3.4 // indirect
 )
--- a/go.sum
+++ b/go.sum
@@ -16,6 +16,8 @@ github.com/gethinode/mod-flexsearch v1.1.3 h1:lzmSvnJL6ABjp03avYzSvJJ7hw01CpHap1
 github.com/gethinode/mod-flexsearch v1.1.3/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
 github.com/gethinode/mod-flexsearch v1.1.4 h1:dJvwBxYlLe/VGlctLn8k89STJ5toATIjNnXIlNeanOY=
 github.com/gethinode/mod-flexsearch v1.1.4/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
+github.com/gethinode/mod-flexsearch v1.2.0 h1:SSMpWzK9SMbi9QRYfil9PJZLLWWLHWzlTc69UxtSWAA=
+github.com/gethinode/mod-flexsearch v1.2.0/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
 github.com/gethinode/mod-fontawesome v1.0.2 h1:ZSK6D20/w4y5GnfYfTBB58uHD0ChIfkpKfRGwioS9rg=
 github.com/gethinode/mod-fontawesome v1.0.2/go.mod h1:Ki1qkWEOiF0hQpCgWeZRw+HkpL6nd1DxKFptU0O2feI=
 github.com/gethinode/mod-fontawesome v1.1.0 h1:rsDzUI+3ZlS/do2ff3ne8/z3KwHeysmuA+WsXlumXXk=
@@ -24,6 +26,12 @@ github.com/gethinode/mod-fontawesome v1.2.0 h1:2nWYEjpUKu6IJ6kOh2WDlDUqRQ/dUGw6m
 github.com/gethinode/mod-fontawesome v1.2.0/go.mod h1:Ki1qkWEOiF0hQpCgWeZRw+HkpL6nd1DxKFptU0O2feI=
 github.com/gethinode/mod-fontawesome v1.2.1 h1:k7z5ZRsNxCohZjlZm8jVAzmTPk17c6xMYBAjAXHs13I=
 github.com/gethinode/mod-fontawesome v1.2.1/go.mod h1:Ki1qkWEOiF0hQpCgWeZRw+HkpL6nd1DxKFptU0O2feI=
+github.com/gethinode/mod-fontawesome v1.2.2 h1:rA9EtuE/LeFQmKSA7ampfUknxsR1mu7hpi4wpA89gX8=
+github.com/gethinode/mod-fontawesome v1.2.2/go.mod h1:Ki1qkWEOiF0hQpCgWeZRw+HkpL6nd1DxKFptU0O2feI=
+github.com/gethinode/mod-fontawesome v1.2.3 h1:RHWd+E72+m29xaC45m/3CF35C201jehw0dcozVBdPrI=
+github.com/gethinode/mod-fontawesome v1.2.3/go.mod h1:Ki1qkWEOiF0hQpCgWeZRw+HkpL6nd1DxKFptU0O2feI=
+github.com/gethinode/mod-fontawesome v1.2.4 h1:SqE3CQ+boaBIhrVh3MPu4nz0uoHPfEH5t60nNY1CfsI=
+github.com/gethinode/mod-fontawesome v1.2.4/go.mod h1:Ki1qkWEOiF0hQpCgWeZRw+HkpL6nd1DxKFptU0O2feI=
 github.com/gethinode/mod-katex v1.0.0 h1:me/3dIIZBkfk1mRIFt8QiAGYwYDoSG5bc2hHRtIutFc=
 github.com/gethinode/mod-katex v1.0.0/go.mod h1:byAfpI3wuqNJIooTGVEGc1cjBhhCy4+CcK1H6495MYg=
 github.com/gethinode/mod-katex v1.0.1 h1:809QUztxmKgMNchU+v03iMO7Ma+ISc3ZzhXYauc21rs=
@@ -36,3 +44,5 @@ github.com/gethinode/mod-leaflet v0.3.1 h1:H5MaOa+BB1KuVw7abTqfIn/SNzzRsAyx/WQoS
 github.com/gethinode/mod-leaflet v0.3.1/go.mod h1:uGggt87x4Fw7wBoJpSiUvNkYg+s/Ujne7klAX2rxMRk=
 github.com/gethinode/mod-leaflet v0.3.3 h1:isnjja6VRFvVWBatYSouh46TXSJg2C4/E2BQTrQw+yI=
 github.com/gethinode/mod-leaflet v0.3.3/go.mod h1:uGggt87x4Fw7wBoJpSiUvNkYg+s/Ujne7klAX2rxMRk=
+github.com/gethinode/mod-leaflet v0.3.4 h1:oY+YQ0JiJuhFQNrk9XgFdg0NMsTUQPXNfnILp4ia4r4=
+github.com/gethinode/mod-leaflet v0.3.4/go.mod h1:uGggt87x4Fw7wBoJpSiUvNkYg+s/Ujne7klAX2rxMRk=
--- a/layouts/404.html
+++ b/layouts/404.html
@@ -2,7 +2,7 @@
    <div class="container-xxl flex-fill d-flex align-content-center flex-wrap">
        <div class="w-100 text-center">
            <span class="text-secondary fw-bold">
-                <i class="fa-regular fa-face-frown fa-10x"></i>
+                {{ partial "assets/icon.html" (dict "icon" "fa face-frown fa-10x") }}
                <p class="display-1 mt-3 fw-bold">404</p>
                <p class="fs-3">{{ T "pageNotFoundTitle" }}</p>
            </span>
--- a/layouts/_default/_markup/render-heading.html
+++ b/layouts/_default/_markup/render-heading.html
@@ -1,5 +1,5 @@
 {{ if site.Params.navigation.anchor }}
-<h{{ .Level }} id="{{ .Anchor | safeURL }}" class="heading">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}"><i class="fa-solid fa-link anchor"></i></a></h{{ .Level }}>
+<h{{ .Level }} id="{{ .Anchor | safeURL }}" class="heading">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}">{{- partial "assets/icon.html" (dict "icon" "fas link anchor") }}</a></h{{ .Level }}>
 {{ else }}
 <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }}</h{{ .Level }}>
 {{ end }}
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -67,7 +67,8 @@
                {{ with .NextInSection -}}
                    {{ $next := . -}}
                    {{ with .OutputFormats.Get "html" -}}
-                        <a class="next" href="{{ $next.RelPermalink }}"><i class="fas fa-arrow-left"></i> {{ $next.Title }}</a>
+                        <a class="next" href="{{ $next.RelPermalink }}">
+                            {{- partial "assets/icon.html" (dict "icon" "fas arrow-left") }}&nbsp;{{ $next.Title }}</a>
                    {{- end -}}
                {{ end -}}
            </div>
@@ -75,7 +76,7 @@
                {{ with .PrevInSection -}}
                    {{ $prev := . -}}
                    {{ with .OutputFormats.Get "html" -}}
-                        <a class="previous" href="{{ $prev.RelPermalink }}">{{ $prev.Title }} <i class="fas fa-arrow-right"></i></a>
+                        <a class="previous" href="{{ $prev.RelPermalink }}">{{ $prev.Title }}&nbsp;{{- partial "assets/icon.html" (dict "icon" "fas arrow-right") }}</a>
                    {{- end -}}
                {{ end -}}
            </div>
--- a/layouts/partials/assets/button.html
+++ b/layouts/partials/assets/button.html
@@ -26,6 +26,7 @@
                    "main.externalLinks.cue" in the site's parameters.
    "tab"           Optional flag to indicate if an external link should open in a new tab, defaults to setting
                    "main.externalLinks.tab" in the site's parameters.
+    "attributes"    Optional dictionary of key-value pairs added as custom attributes to the button element ('<a>').
 -->

 {{- $title := trim .title " \r\n" -}}
@@ -132,10 +133,12 @@

    {{- if and $title $cue -}}
        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
-        {{- $title = printf "%s %s" $title $suffix | safeHTML -}}
+        {{- $title = printf "%s&nbsp;%s" $title $suffix | safeHTML -}}
    {{- end -}}
 {{- end -}}

+{{- $attributes := .attributes -}}
+
 <a aria-label="{{ $title }}" {{ if ne $state "disabled" }}{{ with $href }}href="{{ . }}"{{ end }}{{ end }}
    {{ with $id }}id="{{ . }}"{{ end }}
    {{ with $target }}target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}
@@ -148,6 +151,9 @@
    {{ with $collapse }}data-bs-toggle="collapse" aria-expanded="false" aria-controls="{{ . }}"{{ end }}
    {{ if eq $state "active" }}data-bs-toggle="button" aria-pressed="true"{{ end }}
    {{ if eq $state "inactive" }}data-bs-toggle="button" aria-pressed="false"{{ end }}
+    {{ range $key, $val := $attributes }}
+        {{ print $key | safeHTMLAttr }}="{{ $val }}"
+    {{ end }}
    >

    <div class="d-flex justify-content-{{ $justify }}">
--- a/layouts/partials/assets/image.html
+++ b/layouts/partials/assets/image.html
@@ -103,7 +103,7 @@
            {{- if $absoluteURL -}}
                {{- $imgset = printf "%s, %s %sw" $imgset $scaled.Permalink (index $widths $index) -}}
            {{- else -}}
-            {{- $imgset = printf "%s, %s %sw" $imgset $scaled.RelPermalink (index $widths $index) -}}
+                {{- $imgset = printf "%s, %s %sw" $imgset $scaled.RelPermalink (index $widths $index) -}}
            {{- end -}}
        {{- end -}}
        {{- $imgset = strings.TrimPrefix ", " $imgset -}}
--- a/layouts/partials/assets/navbar-item.html
+++ b/layouts/partials/assets/navbar-item.html
@@ -52,9 +52,14 @@
    {{ if $isIcon }}aria-label="{{ $menu.Name }}"{{ end }}
    data-nav="main" data-nav-main="{{ $mainNav }}"{{ with $childNav }} data-nav-child="{{ . }}"{{ end }} 
    href="{{ $menuURL }}{{ $params | safeHTMLAttr }}"{{ with $externalHref }} {{ . | safeHTMLAttr }}{{ end }} {{ $button | safeHTMLAttr }}>
-    
-    {{- with $menu.Pre }}{{ . }}{{ end -}}
+    {{- with $menu.Pre }}
+        {{ if hasPrefix . "<i" }}
+            {{ . | safeHTML }}
+        {{ else }}
+            {{ partial "assets/icon.html" (dict "icon" . )}}
+        {{ end }}
+    {{ end -}}
    <span {{ if $isActive }} class="active"{{ end }}>{{ if not $isIcon }}{{ $menu.Name }}{{ end }}</span>
    {{- with $menu.Post }}{{ . }}{{ end -}}
-    {{- if not $isIcon }} {{ $suffix }}{{ end -}}
+    {{- if not $isIcon }}&nbsp;{{ $suffix }}{{ end -}}
 </a>
--- a/layouts/partials/assets/navbar.html
+++ b/layouts/partials/assets/navbar.html
@@ -13,6 +13,7 @@
    "logo"          Optional address of the logo image, defaults to the parameter "logo" set in the "main" section of
                    the site's parameter configuration. 
    "title"         Optional brand title, displayed when the logo is not set. Defaults to the site's title.
+    "class":        Optional class attribute of the navbar container.
 -->

 <!-- Inline partial to render the color mode switcher -->
@@ -22,25 +23,25 @@

    <li class="nav-item dropdown {{ if $collapsed }}d-{{ $size }}-none{{ else }}d-none d-{{ $size }}-block{{ end }}">
        <a class="nav-link dropdown-toggle" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false" id="navbar-color-theme{{ if $collapsed }}-collapsed{{ end }}">
-            {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon-active") }} {{ if $collapsed }} {{ T "colorMode" }} {{ end }}
+            <span class="theme-icon-active">{{- partial "assets/icon.html" (dict "icon" "fas sun fa-fw") }} {{ if $collapsed }} {{ T "colorMode" }} {{ end }}</span>
            <span class="d-md-none"></span>
        </a>
        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbar-color-theme{{ if $collapsed }}-collapsed{{ end }}">
            <li>
                <a class="dropdown-item{{ if $collapsed }} switch-mode-collapsed{{ end }}" data-bs-theme-value="light" href="#!">
-                    {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon") }}
+                    <span class="theme-icon">{{- partial "assets/icon.html" (dict "icon" "fas sun fa-fw") }}</span>&nbsp;
                    {{ T "colorLight" }}
                </a>
            </li>
            <li>
                <a class="dropdown-item{{ if $collapsed }} switch-mode-collapsed{{ end }}" data-bs-theme-value="dark" href="#!">
-                    {{- partial "assets/icon.html" (dict "icon" "fas moon theme-icon") }}
+                    <span class="theme-icon">{{- partial "assets/icon.html" (dict "icon" "fas moon fa-fw") }}</span>&nbsp;
                    {{ T "colorDark" }}
                </a>
            </li>
            <li>
                <a class="dropdown-item{{ if $collapsed }} switch-mode-collapsed{{ end }}" data-bs-theme-value="auto" href="#!">
-                    {{- partial "assets/icon.html" (dict "icon" "fas circle-half-stroke theme-icon" ) }}
+                    <span class="theme-icon">{{- partial "assets/icon.html" (dict "icon" "fas circle-half-stroke fa-fw" ) }}</span>&nbsp;
                    {{ T "colorAuto" }}
                </a>
            </li>
@@ -73,7 +74,7 @@
                        <a class="pe-5 dropdown-item{{ if $collapsed }} switch-mode-collapsed{{ end }}{{ if $active }} active{{ end }}{{ if $disabled }} disabled{{ end }}" href="{{ $url }}">{{ $item.label }}
                            {{ if $item.latest }} ({{ T "latest" }}){{ end }}
                            {{ if $active }}
-                                <span class="position-absolute end-0 me-3">{{- partial "assets/icon.html" (dict "icon" "fas check") }}</span>
+                                <span class="position-absolute end-0 me-3">{{- partial "assets/icon.html" (dict "icon" "fas check fa-fw") }}</span>
                            {{ end }}
                        </a>
                    </li>
@@ -185,7 +186,9 @@
 {{- if eq $color "black" }}{{ $theme = "dark" }}{{ end -}}
 {{- if eq $color "white" }}{{ $theme = "light" }}{{ end -}}

-<div class="container-fluid {{ if $fixed }}fixed-top{{ end }} p-0"{{ with $theme }} data-bs-theme="{{ . }}"{{ end }}>
+{{- $class := .class -}}
+
+<div class="container-fluid {{ if $fixed }}fixed-top{{ end }} p-0{{ with $class }} {{ . }}{{ end }}"{{ with $theme }} data-bs-theme="{{ . }}"{{ end }}>
    {{- partial "assets/page-alert.html" (dict "page" $page) -}}
    <nav class="navbar navbar-expand-{{ $size }} {{ with $color }}bg-{{ . }}{{ end }} p-4"{{ with $theme }} data-bs-theme="{{ . }}"{{ end }}>
        <div class="container-xxl p-0">
@@ -193,12 +196,12 @@
            <div class="d-flex">
                {{- if $page.Scratch.Get "sidebar" -}}
                    <button class="navbar-toggler fw-30 collapsed p-0 mx-auto" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvass-sidebar" aria-controls="offcanvass-sidebar" aria-label="{{ T "toggleSidebar" }}">
-                        {{- partial "assets/icon.html" (dict "icon" "fas ellipsis") -}}
+                        {{- partial "assets/icon.html" (dict "icon" "fas ellipsis fa-fw") -}}
                    </button>
                {{- else -}}
                    <!-- Insert invisible sidebar toggler to center logo correctly on smaller screens -->
                    <button class="navbar-toggler fw-30 collapsed p-0 mx-auto invisible" type="button">
-                        {{- partial "assets/icon.html" (dict "icon" "fas ellipsis") -}}
+                        {{- partial "assets/icon.html" (dict "icon" "fas ellipsis fa-fw") -}}
                    </button>
                {{- end -}}
            </div>
@@ -254,10 +257,10 @@
                        {{- $currentLang := $page.Language.Lang -}}
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle d-{{ $size }}-none" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
-                                {{- partial "assets/icon.html" (dict "icon" "fas globe") }} {{ T "languageSwitcherLabel" }}
+                                {{- partial "assets/icon.html" (dict "icon" "fas globe fa-fw") }} {{ T "languageSwitcherLabel" }}
                            </a>
                            <a class="nav-link dropdown-toggle d-none d-{{ $size }}-block" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
-                                {{- partial "assets/icon.html" (dict "icon" "fas globe") }}
+                                {{- partial "assets/icon.html" (dict "icon" "fas globe fa-fw") }}
                            </a>
                            <ul class="dropdown-menu dropdown-menu-end ">
                                {{- if $page.IsTranslated -}}
--- a/layouts/partials/assets/pagination.html
+++ b/layouts/partials/assets/pagination.html
@@ -41,22 +41,22 @@
    {{- with .First }}
      {{- if ne $currentPageNumber .PageNumber }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angles-left") }}</span></a>
      </li>
      {{- else }}
      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angles-left") }}</span></a>
      </li>
      {{- end }}
    {{- end }}

    {{- with .Prev }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-left"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angle-left") }}</span></a>
      </li>
    {{- else }}
      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-left"></i></span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angle-left") }}</span></a>
      </li>
    {{- end }}

@@ -81,22 +81,22 @@

    {{- with .Next }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationNext" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-right"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationNext" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angle-right") }}</span></a>
      </li>
    {{- else }}
      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="{{ T "paginationNext" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-right"></i></span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationNext" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angle-right") }}</span></a>
      </li>
    {{- end }}

    {{- with .Last }}
      {{- if ne $currentPageNumber .PageNumber }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationLast" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationLast" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angles-right") }}</span></a>
      </li>
      {{- else }}
      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="{{ T "paginationLast" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
+        <a aria-disabled="true" aria-label="{{ T "paginationLast" }}" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angles-right") }}</span></a>
      </li>
      {{- end }}
    {{- end }}
@@ -112,14 +112,14 @@
    {{- with .First }}
      {{- if ne $currentPageNumber .PageNumber }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-left"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationFirst" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angles-left") }}</span></a>
      </li>
      {{- end }}
    {{- end }}

    {{- with .Prev }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-left"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationPrevious" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angle-left") }}</span></a>
      </li>
    {{- end }}

@@ -144,14 +144,14 @@

    {{- with .Next }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationNext" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-right"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationNext" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angle-right") }}</span></a>
      </li>
    {{- end }}

    {{- with .Last }}
      {{- if ne $currentPageNumber .PageNumber }}
      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="{{ T "paginationLast" }}" class="page-link" role="button"><span aria-hidden="true"><i class="fas fa-angle-double-right"></i></span></a>
+        <a href="{{ .URL }}" aria-label="{{ T "paginationLast" }}" class="page-link" role="button"><span aria-hidden="true">{{ partial "assets/icon.html" (dict "icon" "fas angles-right") }}</span></a>
      </li>
      {{- end }}
    {{- end }}
--- a/layouts/partials/assets/sharing.html
+++ b/layouts/partials/assets/sharing.html
@@ -23,6 +23,10 @@
                {{- end -}}
                {{ partial "assets/button.html" (dict "toast" $target "clipboard" $clipboard "href" $url "icon" (printf "%s fa-fw" $item.icon) "class" "btn-social p-0" )}}
            {{- end -}}
+            {{ if .Site.Params.sharing.webshare }}
+                {{ $attr := dict "data-sharing-title" .Title "data-sharing-description" .Description "data-sharing-url" .Permalink }}
+                {{ partial "assets/button.html" (dict "href" "#!" "icon" "fas share-nodes fa-fw" "id" "btn-webshare" "class" "btn-social p-0" "attributes" $attr )}}
+            {{- end -}}
        </div>
    {{- end -}}
 {{- end -}}
--- a/layouts/partials/assets/toast.html
+++ b/layouts/partials/assets/toast.html
@@ -3,6 +3,7 @@
    "id"            Optional id of the toast message, defaults to "toast-message-0".
    "header":       Optional header of the toast message.
    "message":      Required toast message.
+    "class":        Optional class attribute of the toast element.
 -->

 {{- $id := printf "toast-message-%d" 0 -}}
@@ -19,7 +20,9 @@
    {{- errorf "partial [assets/toast.html] - Missing message text" -}}
 {{ end -}}

-<div id="{{ $id }}" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
+{{- $class := .class -}}
+
+<div id="{{ $id }}" class="toast{{ with $class }} {{ . }}{{ end }}" role="alert" aria-live="assertive" aria-atomic="true">
    <div class="toast-header">
        {{ with $header }}<strong class="me-auto">{{ . }}</strong>{{ end }}
        <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
--- a/layouts/partials/footer/social.html
+++ b/layouts/partials/footer/social.html
@@ -9,7 +9,11 @@
        <div class="col text-sm-start text-center col-sm-6 col-md-4">
            {{ range .Site.Menus.social -}}
                <a href="{{ .URL }}" {{ if $tab }} target="_blank" rel="noopener noreferrer"{{ end }} aria-label="{{ .Name | safeHTML }}" class="text-decoration-none link-secondary d-inline p-2">
-                    {{ .Pre | safeHTML }}
+                    {{ if hasPrefix .Pre "<i" }}
+                        {{ .Pre | safeHTML }}
+                    {{ else }}
+                        {{ partial "assets/icon.html" (dict "icon" (printf "%s fa-2x" .Pre) )}}
+                    {{ end }}
                </a>
            {{ end -}}
        </div>
--- a/layouts/partials/head/seo.html
+++ b/layouts/partials/head/seo.html
@@ -18,11 +18,12 @@
 {{ end -}}

 {{ with .Params.thumbnail -}}
-    {{ $source := partial "utilities/GetImage.html" (dict "url" .) -}}
-    {{ with $source -}}
+    {{ $img := partial "utilities/GetImage.html" (dict "url" .) -}}
+    {{ with $img -}}
        {{ $dim := "1280x640" -}}
-        {{ $img := (.Fill (printf "%s jpg" $dim)) -}}
-        {{ $.Scratch.Set "thumbnail" ($img.Permalink | absURL) -}}
+        {{ $scaled := (.Fill (printf "%s jpg" $dim)) -}}
+        {{- $scaled = $scaled | resources.Copy (replace $img.RelPermalink ".jpg" (printf "-%s.jpg" $dim)) -}}
+        {{ $.Scratch.Set "thumbnail" ($scaled.Permalink | absURL) -}}
    {{ end -}}
 {{ else -}}
    {{ with .Site.Params.schema.image.url -}}    
--- a/layouts/partials/utilities/link.html
+++ b/layouts/partials/utilities/link.html
@@ -34,10 +34,12 @@

    {{- if $cue -}}
        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
-        {{- $text = printf "%s %s" $text $suffix | safeHTML -}}
+        {{- $text = printf "%s&nbsp;%s" $text $suffix | safeHTML -}}
    {{- end -}}
 {{ else }}
    {{ $destination = relLangURL $destination }}
 {{- end -}}

-<a href="{{ $destination | safeURL }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>{{ $text }}</a>
+{{- $class := .class -}}
+
+<a {{ with $class }}class="{{ . }}" {{ end }}href="{{ $destination | safeURL }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>{{ $text }}</a>
--- a/layouts/shortcodes/alert.html
+++ b/layouts/shortcodes/alert.html
@@ -6,6 +6,7 @@
    "icon"          Optional class and name of a Font Awesome icon to include.
    "type"          Optional type of the alert, either "danger" or "info". Generates an alert with related color and
                    icon.
+    "class":        Optional class attribute of the alert element.
 -->

 {{- $error := false -}}
@@ -48,8 +49,10 @@
    {{ $error = true -}}
 {{ end -}}

+{{- $class := .Get "class" -}}
+
 {{- if not $error -}}
-    <div class="d-flex alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}" role="alert">
+    <div class="d-flex alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}{{ with $class }} {{ . }}{{ end }}" role="alert">
        {{ with $icon }}<div class="pt-1 pe-2">{{ . }}</div>{{ end }}
        <div class="flex-grow-1 my-auto">
            {{ trim .Inner " \r\n" | markdownify | safeHTML -}}
--- a/layouts/shortcodes/command.html
+++ b/layouts/shortcodes/command.html
@@ -1,3 +1,13 @@
+<!-- 
+    Generates terminal output for either `bash`, `powershell`, or `sql` shell languages. The shortcode supports the
+    following named arguments:
+    "user"          Optional user to add to the prompt, e.g. "user".
+    "host"          Optional host to add to the prompt, e.g. "localhost".
+    "prompt"        Optional prompt override, e.g. "PS C:\Users\User>".
+    "shell"         Type of shell, either "bash" (default), "powershell", or "sql".
+    "class"         Optional class attribute of the command element.
+-->
+
 {{- $host := .Get "host" -}}
 {{- $user := .Get "user" -}}
 {{- $prompt := .Get "prompt" -}}
@@ -60,6 +70,8 @@
    {{- $output = (replace $output "<span class=\"c\">#" "<span class=\"c\">" | safeHTML) -}}
 {{- end -}}

-<div class="mb-3 syntax-highlight">
+{{- $class := .Get "class" -}}
+
+<div class="mb-3 syntax-highlight{{ with $class }} {{ . }}{{ end }}">
    {{- $output -}}
 </div>
--- a/layouts/shortcodes/docs.html
+++ b/layouts/shortcodes/docs.html
@@ -1,11 +1,23 @@
-{{- /*
+<!-- 
    Source: https://github.com/twbs/bootstrap/blob/main/site/layouts/shortcodes/scss-docs.html

-    Usage: `docs name="name" file="path/filename.<toml|scss>"`
+    Capture a code snippet from a `toml` or `scss` input file. The shortcode scans for named markers in a local file:   
+    - For `.toml` files, use `# toml-docs-start` and `# toml-docs-end` followed by the snippet name
+    - For `.scss` files, use `// scss-docs-start` and `// scss-docs-end` followed by the snippet name
+    
+    The snippet between the two markers is then rendered using syntax highlighting. The shortcode supports the
+    following named arguments:

-    Prints everything between `# toml-docs-start "name"` and `# toml-docs-end "name"`
-    comments in the docs, or between `// scss-docs-start` and `// scss-docs-end`.
-*/ -}}
+    "name"          Name of the code snippet, used to identify the relevant section of the input file.
+    "file"          Path of the input file. The path is relative to the `basePath` defined in the `docs` section of the
+                    site's parameters. If the file starts with `./`, the path of the repository is used as base path instead.
+    "show"          If unset, shows the panel with the code snippet in collapsed state. By default, the panel is
+                    expanded.
+    "full"          If unset, shows the filename only. By default, the full relative path is shown.
+    "id"            Optional id of the collapse panel, defaults to "docs-collapse-n" with a sequential number n
+                    starting at 1.
+    "class"         Optional class argument of the tab control.
+-->

 {{- $name := .Get "name" -}}
 {{- $basePath := .Site.Params.docs.basePath -}}
@@ -20,6 +32,9 @@
 {{- $capture_end := "" -}}

 {{- $id := printf "docs-collapse-%d" .Ordinal -}}
+{{ with .Get "id" }}
+    {{ $id = . }}
+{{ end }}

 {{- $supportedExtensions := slice "js" "scss" "toml" -}}
 {{- if in $supportedExtensions $extension -}}
@@ -53,6 +68,8 @@
    {{ errorf "Invalid value for param 'full': %s" $fullParam -}}
 {{ end -}}

+{{- $class := .Get "class" -}}
+
 {{- /* If any parameters are missing, print an error and exit */ -}}
 {{- if or (not $name) (not $file) -}}
    {{- errorf "%s: %q: Missing required parameters! Got: name=%q file=%q!" .Position .Name $name $file -}}
@@ -71,7 +88,7 @@
    {{- $match = replace $match $capture_start "" -}}
    {{- $match = replace $match $capture_end "" -}}

-    <ul class="nav nav-tabs">
+    <ul class="nav nav-tabs{{ with $class }} {{ . }}{{ end }}">
        <li class="nav-item">
            <a class="nav-link active font-monospace" 
                href="#body-{{ $id }}" 
--- a/layouts/shortcodes/example.html
+++ b/layouts/shortcodes/example.html
@@ -1,15 +1,15 @@
-{{- /*
-  Usage: `example args`
-
-  `args` are all optional and can be one of the following:
-    * id: the `div`'s id - default: ""
-    * class: any extra class(es) to be added to the `div` - default: ""
-    * lang: language used to display the code. Use "hugo" to process Hugo (escaped) shortcodes - default: "html"
-    * show_markup: if the markup should be output in the HTML - default: `true`
-    * show_preview: if the preview should be output in the HTML - default: `true`
-
+<!-- 
    Source: https://github.com/twbs/bootstrap/blob/main/site/layouts/shortcodes/example.html
-*/ -}}
+
+    Display a code example and render a preview of the same input. The shortcode accepts the languages supported by
+    Hugo's highlight function. The shortcode supports the following named arguments:
+
+    "id"            Optional identifier of the element's container.
+    "lang"          Language used to display the code. Use "hugo" to process Hugo (escaped) shortcodes, default value is "html".
+    "show_markup"   If the markup should be output in the HTML, defaults to "true".
+    "show_preview"  If the preview should be output in the HTML, defaults to "true".
+    "class"         Optional class attributes of the element's container.
+-->

 {{- $id := .Get "id" -}}
 {{- $class := .Get "class" -}}
@@ -25,18 +25,18 @@
    {{ $lang = "markdown" }}
 {{- end -}}

-<div class="rounded border mb-3">
+<div class="rounded border preview-background mb-3">
    {{- if eq $show_preview true -}}
-        <div {{ with $id }}id="{{ . }}"{{ end }} class="p-3 {{ with $class }} {{ . }}{{ end }} preview-background">
+        <div {{ with $id }}id="{{ . }}"{{ end }} class="rounded-top p-3 {{ with $class }} {{ . }}{{ end }}">
            {{- $content -}}
        </div>
    {{- end -}}
-    <div class="d-flex align-items-center ps-3 pe-3 py-1 border-top border-bottom syntax-highlight">
-        <small class="font-monospace text-body-secondary text-uppercase">{{- $lang -}}</small>
-    </div>
-    <div class="rounded-bottom syntax-highlight">
-        {{- if eq $show_markup true -}}
+    {{- if eq $show_markup true -}}
+        <div class="d-flex align-items-center ps-3 pe-3 py-1{{ if $show_preview }} border-top{{ else }} rounded-top{{ end }} border-bottom syntax-highlight">
+            <small class="font-monospace text-body-secondary text-uppercase">{{- $lang -}}</small>
+        </div>
+        <div class="rounded-bottom syntax-highlight border-none">
            {{- highlight (trim $input "\r\n") $lang "" -}}
-        {{- end -}}
-    </div>
+        </div>
+    {{- end -}}
 </div>
--- a/layouts/shortcodes/file.html
+++ b/layouts/shortcodes/file.html
@@ -1,10 +1,17 @@
-{{- /*
+<!-- 
    Source: https://github.com/twbs/bootstrap/blob/main/site/layouts/shortcodes/scss-docs.html

-    Usage: `file path="path/to/filename" lang="lang" show="true" full="true"`
-
-    Prints the full content of any given file supported by the Chroma syntax highlighter.
-*/ -}}
+    Print the full content of any given file supported by the Chroma syntax highlighter. The shortcode supports the
+    following arguments:
+    "path"          Path of the input file. The path is relative to the `basePath` defined in the `docs` section of the
+                    site's parameters. If the file starts with `./`, the path of the repository is used as base path instead.
+    "lang"          Language to be used by the syntax highlighter.
+    "show"          If unset, shows the panel with the code in collapsed state. By default, the panel is expanded.
+    "full"          If unset, shows the filename only. By default, the full relative path is shown.
+    "id"            Optional id of the collapse panel, defaults to "file-collapse-n" with a sequential number n
+                    starting at 1.
+    "class"         Optional class argument of the tab control.
+-->

 {{- $basePath := .Site.Params.docs.basePath -}}
 {{- $file := .Get "path" }}
@@ -16,7 +23,10 @@

 {{- $extension := strings.TrimLeft "." (path.Ext $file)  }}
 {{- $lang := .Get "lang" | default $extension -}}
-{{- $id := printf "docs-collapse-%d" .Ordinal -}}
+{{- $id := printf "file-collapse-%d" .Ordinal -}}
+{{ with .Get "id" }}
+    {{ $id = . }}
+{{ end }}

 {{ $supportedFlags := slice "true" "false" -}}
 {{ $showParam := "true" -}}
@@ -37,6 +47,8 @@
    {{ errorf "Invalid value for param 'full': %s" $fullParam -}}
 {{ end -}}

+{{- $class := .Get "class" -}}
+
 {{- /* If any parameters are missing, print an error and exit */ -}}
 {{- if not $file -}}
    {{- errorf "%s: %q: Missing required parameters! Got: path=%q!" .Position .Name $file -}}
@@ -46,7 +58,7 @@
    {{ $tmp := os.Stat $file }}
    {{- $content := readFile $file -}}

-    <ul class="nav nav-tabs">
+    <ul class="nav nav-tabs{{ with $class }} {{ . }}{{ end }}">
        <li class="nav-item">
            <a class="nav-link active font-monospace" 
                href="#body-{{ $id }}" 
--- a/layouts/shortcodes/link.html
+++ b/layouts/shortcodes/link.html
@@ -13,6 +13,7 @@
                    "main.externalLinks.tab" in the site's parameters.
    "case"          Optional flag to indicate if the retrieved title (e.g. no inner text is provided) of an internal
                    link should use its original case, defaults to true. If false, the title is set to lower case.
+    "class"         Optional class attribute of the anchor element.
 -->

 {{- $error := false -}}
@@ -49,7 +50,9 @@

 {{ $text := trim .Inner " \r\n" | markdownify | safeHTML }}

+{{- $class := .Get "class" -}}
+
 {{- if not $error -}}
-    {{ partial "utilities/link.html" (dict "destination" $url "text" $text "cue" $cue "tab" $tab "case" $case) }}
+    {{ partial "utilities/link.html" (dict "destination" $url "text" $text "cue" $cue "tab" $tab "case" $case "class" $class) }}
 {{- end -}}

--- a/layouts/shortcodes/navbar.html
+++ b/layouts/shortcodes/navbar.html
@@ -15,6 +15,7 @@
    "search"        Optional flag to include a search input, default is "true".
    "logo"          Optional address of the logo image.
    "title"         Optional brand title, displayed when the logo is not set.
+    "class":        Optional class attribute of the navbar container.
 -->

 {{ $error := false }}
@@ -84,6 +85,8 @@
 {{ $title := "" -}}
 {{ with .Get "title" }}{{ $title = . }}{{ end -}}

+{{- $class := .Get "class" -}}
+
 {{ if not $error -}}
    {{- partial "assets/navbar.html" (dict 
        "id" $id 
@@ -96,6 +99,7 @@
        "menus" $menus
        "logo" $logo
        "title" $title
+        "class" $class
        )
    -}}
 {{ end -}}
--- a/layouts/shortcodes/release.html
+++ b/layouts/shortcodes/release.html
@@ -4,6 +4,7 @@
    "version":      Required version string, expects semver notation with a "v" prefix.
    "state":        Optional state, either "new" or "deprecated".
    "short":        Optional flag to indicate the release button should use short notation.
+    "class":        Optional class attribute of the button element.
 -->

 {{- $error := false -}}
@@ -54,6 +55,8 @@
    {{- end -}}
 {{- end -}}

+{{- $class := .Get "class" -}}
+
 {{- if not $error -}}
    <div class="pb-3">
    {{- partial "assets/button.html" (dict 
@@ -62,7 +65,7 @@
        "size" "sm"
        "color" $color
        "outline" "true"
-        "class" "rounded-2 fw-semibold")
+        "class" (trim (printf "rounded-2 fw-semibold %s" $class) " "))
    -}} 
    </div>
 {{- end -}}
--- a/layouts/shortcodes/timeline.html
+++ b/layouts/shortcodes/timeline.html
@@ -1,4 +1,14 @@
-<!-- Inspired by the timeline snippet from Siddharth Panchal at https://bootsnipp.com/snippets/Q0ppE -->
+<!-- 
+    Inspired by the timeline snippet from Siddharth Panchal at https://bootsnipp.com/snippets/Q0ppE
+    
+    Show items ordered on a vertical timelime. The shortcode supports the following arguments:
+    "data"          Required filename of the timeline input. You can omit the file extension. The file should reside in
+                    the "data" folder.
+    "background"    Optional border color of the connector dots, defaults to the body background color. If set, uses a
+                    subtle background color that is adaptive to the current color mode.
+    "class"         Optional class attribute of the timeline's container.
+-->
+
 {{ $error := false }}

 {{- $data := .Get "data" -}}
@@ -21,6 +31,8 @@
    {{ $error = true -}}
 {{ end -}}

+{{- $class := .Get "class" -}}
+
 <!-- Inline partial to render icon -->
 {{- define "partials/timeline-icon.html" -}}
    {{- $col := default 6 .col -}}
@@ -74,7 +86,7 @@
 {{- end -}}

 <!-- Render default timeline -->
-<div class="container p-0 d-none d-md-block mb-5 {{ with $background }} timeline-bg-{{ . }}{{ end }}">
+<div class="container p-0 d-none d-md-block mb-5 {{ with $background }} timeline-bg-{{ . }}{{ end }}{{ with $class }} {{ . }}{{ end }}">
    {{ range $index, $item := $entries }}
        <div class="row timeline timeline-{{ $item.color }} timeline-dot g-0 ">
            {{ if eq (mod $index 2) 1 }}
@@ -90,7 +102,7 @@
 </div>

 <!-- Render timeline for smaller devices -->
-<div class="container p-0 d-block d-md-none {{ with $background }} timeline-bg-{{ . }}{{ end }}">
+<div class="container p-0 d-block d-md-none {{ with $background }} timeline-bg-{{ . }}{{ end }}{{ with $class }} {{ . }}{{ end }}">
    {{ range $index, $item := $entries }}
        <div class="row timeline-sm timeline-{{ $item.color }} timeline-dot g-0">
            {{ partial "partials/timeline-icon.html" (dict "icon" $item.icon "direction" "end" "col" 3) }}
--- a/layouts/shortcodes/toast.html
+++ b/layouts/shortcodes/toast.html
@@ -2,6 +2,7 @@
    Prepares a toast message. Use a trigger to display the message. The shortcode supports the following arguments:
    "id"            Optional id of the toast message, defaults to "toast-message-n" with sequence n.
    "header":       Optional header of the toast message. Uses the site title by default.
+    "class"         Optional class attribute of the toast element.
 -->

 {{- $error := false -}}
@@ -10,8 +11,10 @@
 {{ $header := .Get "header" -}}
 {{ $message := trim .Inner " \r\n" -}}

+{{- $class := .Get "class" -}}
+
 {{ if not $message -}}
    {{ errorf "Missing inner element text: %s" .Position -}}
 {{ else if not $error -}}
-    {{ partial "assets/toast.html" (dict "id" $id "header" $header "message" $message) }}
+    {{ partial "assets/toast.html" (dict "id" $id "header" $header "message" $message "class" $class) }}
 {{ end -}}
--- a/layouts/shortcodes/tooltip.html
+++ b/layouts/shortcodes/tooltip.html
@@ -5,6 +5,7 @@
    "title"         Required text to display in the tooltip.
    "href"          Required address for the button or hyperlink.
    "placement"     Optional position of the tooltip: "top" (default), "bottom", "left", or "right". 
+    "class"         Optional class attribute of the tooltip's button element.
 -->

 {{ $error := false }}
@@ -40,6 +41,8 @@
    {{ $error = true }}
 {{ end -}}

+{{- $class := .Get "class" -}}
+
 {{ if not $error }}
-    <div class="d-inline-flex">{{- partial "assets/button.html" (dict "type" $type "title" $title "color" $color "tooltip" $tooltip "href" $href "placement" $placement) -}}</div>
+    <div class="d-inline-flex">{{- partial "assets/button.html" (dict "type" $type "title" $title "color" $color "tooltip" $tooltip "href" $href "placement" $placement "class" $class) -}}</div>
 {{ end }}
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,32 +1,31 @@
 {
  "name": "@gethinode/hinode",
-  "version": "0.16.8",
+  "version": "0.17.4",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "@gethinode/hinode",
-      "version": "0.16.8",
+      "version": "0.17.4",
      "license": "MIT",
      "devDependencies": {
-        "@fortawesome/fontawesome-free": "^6.4.0",
        "@fullhuman/postcss-purgecss": "^5.0.0",
        "autoprefixer": "^10.4.14",
-        "cssnano": "^6.0.0",
-        "cssnano-preset-advanced": "^6.0.0",
-        "eslint": "^8.39.0",
-        "eslint-config-standard": "^17.0.0",
-        "eslint-plugin-import": "^2.27.5",
-        "eslint-plugin-n": "^16.0.0",
+        "cssnano": "^6.0.1",
+        "cssnano-preset-advanced": "^6.0.1",
+        "eslint": "^8.46.0",
+        "eslint-config-standard": "^17.1.0",
+        "eslint-plugin-import": "^2.28.0",
+        "eslint-plugin-n": "^16.0.1",
        "eslint-plugin-promise": "^6.1.1",
-        "hugo-bin": "^0.111.0",
+        "hugo-bin": "^0.112.1",
        "markdownlint-cli2": "^0.8.1",
        "postcss-cli": "^10.1.0",
        "purgecss-whitelister": "^2.4.0",
        "replace-in-files-cli": "^2.2.0",
-        "rimraf": "^5.0.0",
+        "rimraf": "^5.0.1",
        "shx": "^0.3.4",
-        "stylelint": "^15.6.0",
+        "stylelint": "^15.10.2",
        "stylelint-config-standard-scss": "^10.0.0"
      }
    },
@@ -241,18 +240,18 @@
      }
    },
    "node_modules/@eslint-community/regexpp": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.5.1.tgz",
-      "integrity": "sha512-Z5ba73P98O1KUYCCJTUeVpja9RcGoMdncZ6T49FCUl2lN38JtCJ+3WgIDBv0AuY4WChU5PmtJmOCTlN6FZTFKQ==",
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.6.2.tgz",
+      "integrity": "sha512-pPTNuaAG3QMH+buKyBIGJs3g/S5y0caxw0ygM3YyE6yJFySwiGGSzA+mM3KJ8QQvzeLh3blwgSonkFjgQdxzMw==",
      "dev": true,
      "engines": {
        "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
      }
    },
    "node_modules/@eslint/eslintrc": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.0.tgz",
-      "integrity": "sha512-Lj7DECXqIVCqnqjjHMPna4vn6GJcMgul/wuS0je9OZ9gsL0zzDpKPVtcG1HaDVc+9y+qgXneTeUMbCqXJNpH1A==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.1.tgz",
+      "integrity": "sha512-9t7ZA7NGGK8ckelF0PQCfcxIUzs1Md5rrO6U/c+FIQNanea5UZC0wqKXH4vHBccmu4ZJgZ2idtPeW7+Q2npOEA==",
      "dev": true,
      "dependencies": {
        "ajv": "^6.12.4",
@@ -273,24 +272,14 @@
      }
    },
    "node_modules/@eslint/js": {
-      "version": "8.44.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.44.0.tgz",
-      "integrity": "sha512-Ag+9YM4ocKQx9AarydN0KY2j0ErMHNIocPDrVo8zAE44xLTjEtz81OdR68/cydGtk6m6jDb5Za3r2useMzYmSw==",
+      "version": "8.46.0",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.46.0.tgz",
+      "integrity": "sha512-a8TLtmPi8xzPkCbp/OGFUo5yhRkHM2Ko9kOWP4znJr0WAhWyThaw3PnwX4vOTWOAMsV2uRt32PPDcEz63esSaA==",
      "dev": true,
      "engines": {
        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
      }
    },
-    "node_modules/@fortawesome/fontawesome-free": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.4.0.tgz",
-      "integrity": "sha512-0NyytTlPJwB/BF5LtRV8rrABDbe3TdTXqNB3PdZ+UUUZAEIrdOJdmABqKjt4AXwIoJNaRVVZEXxpNrqvE1GAYQ==",
-      "dev": true,
-      "hasInstallScript": true,
-      "engines": {
-        "node": ">=6"
-      }
-    },
    "node_modules/@fullhuman/postcss-purgecss": {
      "version": "5.0.0",
      "resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-5.0.0.tgz",
@@ -678,9 +667,9 @@
      }
    },
    "node_modules/acorn": {
-      "version": "8.9.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.9.0.tgz",
-      "integrity": "sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==",
+      "version": "8.10.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz",
+      "integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==",
      "dev": true,
      "bin": {
        "acorn": "bin/acorn"
@@ -1970,27 +1959,27 @@
      }
    },
    "node_modules/eslint": {
-      "version": "8.45.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.45.0.tgz",
-      "integrity": "sha512-pd8KSxiQpdYRfYa9Wufvdoct3ZPQQuVuU5O6scNgMuOMYuxvH0IGaYK0wUFjo4UYYQQCUndlXiMbnxopwvvTiw==",
+      "version": "8.46.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.46.0.tgz",
+      "integrity": "sha512-cIO74PvbW0qU8e0mIvk5IV3ToWdCq5FYG6gWPHHkx6gNdjlbAYvtfHmlCMXxjcoVaIdwy/IAt3+mDkZkfvb2Dg==",
      "dev": true,
      "dependencies": {
        "@eslint-community/eslint-utils": "^4.2.0",
-        "@eslint-community/regexpp": "^4.4.0",
-        "@eslint/eslintrc": "^2.1.0",
-        "@eslint/js": "8.44.0",
+        "@eslint-community/regexpp": "^4.6.1",
+        "@eslint/eslintrc": "^2.1.1",
+        "@eslint/js": "^8.46.0",
        "@humanwhocodes/config-array": "^0.11.10",
        "@humanwhocodes/module-importer": "^1.0.1",
        "@nodelib/fs.walk": "^1.2.8",
-        "ajv": "^6.10.0",
+        "ajv": "^6.12.4",
        "chalk": "^4.0.0",
        "cross-spawn": "^7.0.2",
        "debug": "^4.3.2",
        "doctrine": "^3.0.0",
        "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^7.2.0",
-        "eslint-visitor-keys": "^3.4.1",
-        "espree": "^9.6.0",
+        "eslint-scope": "^7.2.2",
+        "eslint-visitor-keys": "^3.4.2",
+        "espree": "^9.6.1",
        "esquery": "^1.4.2",
        "esutils": "^2.0.2",
        "fast-deep-equal": "^3.1.3",
@@ -2217,9 +2206,9 @@
      }
    },
    "node_modules/eslint-scope": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.0.tgz",
-      "integrity": "sha512-DYj5deGlHBfMt15J7rdtyKNq/Nqlv5KfU4iodrQ019XESsRnwXH9KAE0y3cwtUHDo2ob7CypAnCqefh6vioWRw==",
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
+      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
      "dev": true,
      "dependencies": {
        "esrecurse": "^4.3.0",
@@ -2233,9 +2222,9 @@
      }
    },
    "node_modules/eslint-visitor-keys": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz",
-      "integrity": "sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA==",
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.2.tgz",
+      "integrity": "sha512-8drBzUEyZ2llkpCA67iYrgEssKDUu68V8ChqqOfFupIaG/LCVPUT+CoGJpT77zJprs4T/W7p07LP7zAIMuweVw==",
      "dev": true,
      "engines": {
        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
@@ -2245,9 +2234,9 @@
      }
    },
    "node_modules/espree": {
-      "version": "9.6.0",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.0.tgz",
-      "integrity": "sha512-1FH/IiruXZ84tpUlm0aCUEwMl2Ho5ilqVh0VvQXw+byAz/4SAciyHLlfmL5WYqsvD38oymdUwBss0LtK8m4s/A==",
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
+      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
      "dev": true,
      "dependencies": {
        "acorn": "^8.9.0",
@@ -3281,9 +3270,9 @@
      }
    },
    "node_modules/hugo-bin": {
-      "version": "0.111.4",
-      "resolved": "https://registry.npmjs.org/hugo-bin/-/hugo-bin-0.111.4.tgz",
-      "integrity": "sha512-4JzcarbSM3hsyWnmevnoamd7O4oMU07f5WNUgnqYJQs7CwvCcSOwqvTNQiZzW9vqiBqZyStD8Oim9LdtPsBG7Q==",
+      "version": "0.112.1",
+      "resolved": "https://registry.npmjs.org/hugo-bin/-/hugo-bin-0.112.1.tgz",
+      "integrity": "sha512-Iguqted2G4zE5ZCH3onkhp9jPxZqxjbnQXxoYgo4RdVQhvRD16E3AzzUfbEiQM9yDM+fKhHCr2ajl9t8JTw/pA==",
      "dev": true,
      "funding": [
        {
@@ -7470,15 +7459,15 @@
      }
    },
    "@eslint-community/regexpp": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.5.1.tgz",
-      "integrity": "sha512-Z5ba73P98O1KUYCCJTUeVpja9RcGoMdncZ6T49FCUl2lN38JtCJ+3WgIDBv0AuY4WChU5PmtJmOCTlN6FZTFKQ==",
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.6.2.tgz",
+      "integrity": "sha512-pPTNuaAG3QMH+buKyBIGJs3g/S5y0caxw0ygM3YyE6yJFySwiGGSzA+mM3KJ8QQvzeLh3blwgSonkFjgQdxzMw==",
      "dev": true
    },
    "@eslint/eslintrc": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.0.tgz",
-      "integrity": "sha512-Lj7DECXqIVCqnqjjHMPna4vn6GJcMgul/wuS0je9OZ9gsL0zzDpKPVtcG1HaDVc+9y+qgXneTeUMbCqXJNpH1A==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.1.tgz",
+      "integrity": "sha512-9t7ZA7NGGK8ckelF0PQCfcxIUzs1Md5rrO6U/c+FIQNanea5UZC0wqKXH4vHBccmu4ZJgZ2idtPeW7+Q2npOEA==",
      "dev": true,
      "requires": {
        "ajv": "^6.12.4",
@@ -7493,15 +7482,9 @@
      }
    },
    "@eslint/js": {
-      "version": "8.44.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.44.0.tgz",
-      "integrity": "sha512-Ag+9YM4ocKQx9AarydN0KY2j0ErMHNIocPDrVo8zAE44xLTjEtz81OdR68/cydGtk6m6jDb5Za3r2useMzYmSw==",
-      "dev": true
-    },
-    "@fortawesome/fontawesome-free": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.4.0.tgz",
-      "integrity": "sha512-0NyytTlPJwB/BF5LtRV8rrABDbe3TdTXqNB3PdZ+UUUZAEIrdOJdmABqKjt4AXwIoJNaRVVZEXxpNrqvE1GAYQ==",
+      "version": "8.46.0",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.46.0.tgz",
+      "integrity": "sha512-a8TLtmPi8xzPkCbp/OGFUo5yhRkHM2Ko9kOWP4znJr0WAhWyThaw3PnwX4vOTWOAMsV2uRt32PPDcEz63esSaA==",
      "dev": true
    },
    "@fullhuman/postcss-purgecss": {
@@ -7796,9 +7779,9 @@
      }
    },
    "acorn": {
-      "version": "8.9.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.9.0.tgz",
-      "integrity": "sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==",
+      "version": "8.10.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz",
+      "integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==",
      "dev": true
    },
    "acorn-jsx": {
@@ -8684,27 +8667,27 @@
      "dev": true
    },
    "eslint": {
-      "version": "8.45.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.45.0.tgz",
-      "integrity": "sha512-pd8KSxiQpdYRfYa9Wufvdoct3ZPQQuVuU5O6scNgMuOMYuxvH0IGaYK0wUFjo4UYYQQCUndlXiMbnxopwvvTiw==",
+      "version": "8.46.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.46.0.tgz",
+      "integrity": "sha512-cIO74PvbW0qU8e0mIvk5IV3ToWdCq5FYG6gWPHHkx6gNdjlbAYvtfHmlCMXxjcoVaIdwy/IAt3+mDkZkfvb2Dg==",
      "dev": true,
      "requires": {
        "@eslint-community/eslint-utils": "^4.2.0",
-        "@eslint-community/regexpp": "^4.4.0",
-        "@eslint/eslintrc": "^2.1.0",
-        "@eslint/js": "8.44.0",
+        "@eslint-community/regexpp": "^4.6.1",
+        "@eslint/eslintrc": "^2.1.1",
+        "@eslint/js": "^8.46.0",
        "@humanwhocodes/config-array": "^0.11.10",
        "@humanwhocodes/module-importer": "^1.0.1",
        "@nodelib/fs.walk": "^1.2.8",
-        "ajv": "^6.10.0",
+        "ajv": "^6.12.4",
        "chalk": "^4.0.0",
        "cross-spawn": "^7.0.2",
        "debug": "^4.3.2",
        "doctrine": "^3.0.0",
        "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^7.2.0",
-        "eslint-visitor-keys": "^3.4.1",
-        "espree": "^9.6.0",
+        "eslint-scope": "^7.2.2",
+        "eslint-visitor-keys": "^3.4.2",
+        "espree": "^9.6.1",
        "esquery": "^1.4.2",
        "esutils": "^2.0.2",
        "fast-deep-equal": "^3.1.3",
@@ -8863,9 +8846,9 @@
      "requires": {}
    },
    "eslint-scope": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.0.tgz",
-      "integrity": "sha512-DYj5deGlHBfMt15J7rdtyKNq/Nqlv5KfU4iodrQ019XESsRnwXH9KAE0y3cwtUHDo2ob7CypAnCqefh6vioWRw==",
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
+      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
      "dev": true,
      "requires": {
        "esrecurse": "^4.3.0",
@@ -8873,15 +8856,15 @@
      }
    },
    "eslint-visitor-keys": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz",
-      "integrity": "sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA==",
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.2.tgz",
+      "integrity": "sha512-8drBzUEyZ2llkpCA67iYrgEssKDUu68V8ChqqOfFupIaG/LCVPUT+CoGJpT77zJprs4T/W7p07LP7zAIMuweVw==",
      "dev": true
    },
    "espree": {
-      "version": "9.6.0",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.0.tgz",
-      "integrity": "sha512-1FH/IiruXZ84tpUlm0aCUEwMl2Ho5ilqVh0VvQXw+byAz/4SAciyHLlfmL5WYqsvD38oymdUwBss0LtK8m4s/A==",
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
+      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
      "dev": true,
      "requires": {
        "acorn": "^8.9.0",
@@ -9636,9 +9619,9 @@
      }
    },
    "hugo-bin": {
-      "version": "0.111.4",
-      "resolved": "https://registry.npmjs.org/hugo-bin/-/hugo-bin-0.111.4.tgz",
-      "integrity": "sha512-4JzcarbSM3hsyWnmevnoamd7O4oMU07f5WNUgnqYJQs7CwvCcSOwqvTNQiZzW9vqiBqZyStD8Oim9LdtPsBG7Q==",
+      "version": "0.112.1",
+      "resolved": "https://registry.npmjs.org/hugo-bin/-/hugo-bin-0.112.1.tgz",
+      "integrity": "sha512-Iguqted2G4zE5ZCH3onkhp9jPxZqxjbnQXxoYgo4RdVQhvRD16E3AzzUfbEiQM9yDM+fKhHCr2ajl9t8JTw/pA==",
      "dev": true,
      "requires": {
        "@xhmikosr/bin-wrapper": "^11.0.2",
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@gethinode/hinode",
-  "version": "0.16.8",
+  "version": "0.17.4",
  "description": "Hinode is a clean documentation and blog theme for Hugo, an open-source static site generator",
  "keywords": [
    "hugo",
@@ -17,14 +17,13 @@
    "registry": "https://registry.npmjs.org/"
  },
  "scripts": {
-    "prestart": "npm run clean && npm run mod:vendor",
    "start": "hugo server --bind=0.0.0.0 --disableFastRender",
    "start:prod": "hugo server --bind=0.0.0.0 --disableFastRender --printI18nWarnings -e production",
-    "prebuild": "npm run clean && npm run -s mod:install",
+    "prebuild": "npm run clean:public && npm run -s mod:install",
    "build": "hugo --gc --minify",
    "build:debug": "hugo -e debug --debug",
    "build:preview": "npm run build -D -F",
-    "clean": "rimraf public resources",
+    "clean:public": "rimraf public",
    "clean:install": "rimraf package-lock.json node_modules",
    "lint": "npm run -s lint:scripts && npm run -s lint:styles && npm run -s lint:markdown",
    "lint:scripts": "eslint assets/js",
@@ -57,24 +56,23 @@
  },
  "homepage": "https://gethinode.com",
  "devDependencies": {
-    "@fortawesome/fontawesome-free": "^6.4.0",
    "@fullhuman/postcss-purgecss": "^5.0.0",
    "autoprefixer": "^10.4.14",
-    "cssnano": "^6.0.0",
-    "cssnano-preset-advanced": "^6.0.0",
-    "eslint": "^8.39.0",
-    "eslint-config-standard": "^17.0.0",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-n": "^16.0.0",
+    "cssnano": "^6.0.1",
+    "cssnano-preset-advanced": "^6.0.1",
+    "eslint": "^8.46.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.28.0",
+    "eslint-plugin-n": "^16.0.1",
    "eslint-plugin-promise": "^6.1.1",
-    "hugo-bin": "^0.111.0",
+    "hugo-bin": "^0.112.1",
    "markdownlint-cli2": "^0.8.1",
    "postcss-cli": "^10.1.0",
    "purgecss-whitelister": "^2.4.0",
    "replace-in-files-cli": "^2.2.0",
-    "rimraf": "^5.0.0",
+    "rimraf": "^5.0.1",
    "shx": "^0.3.4",
-    "stylelint": "^15.6.0",
+    "stylelint": "^15.10.2",
    "stylelint-config-standard-scss": "^10.0.0"
  },
  "hugo-bin": {
Author	SHA1	Message	Date
Mark Dumay	f9eedc7835	Merge pull request #390 from gethinode/refinement Standardize shortcodes	2023-08-05 17:33:29 +02:00
Mark Dumay	cbfb33faf0	Merge branch 'main' into refinement	2023-08-05 17:26:22 +02:00
mark	2d9e89d40a	Update shortcode examples	2023-08-05 17:24:34 +02:00
mark	266b3978fc	Bump package version	2023-08-05 16:09:16 +02:00
mark	d2bfd1c48f	Update dependencies	2023-08-05 16:08:27 +02:00
mark	633da32df5	Add id argument	2023-08-05 15:41:39 +02:00
mark	ea2c28f3fd	Adjust indendation	2023-08-05 15:41:22 +02:00
mark	f66b519f51	Standardize header	2023-08-05 15:41:08 +02:00
mark	6bfb558f73	Standardize header	2023-08-05 13:26:04 +02:00
mark	f0a894091c	Standardize header	2023-08-05 13:25:50 +02:00
mark	3bc14eb232	Add class argument	2023-08-05 13:19:09 +02:00
mark	e428666750	Standardize header	2023-08-05 13:18:55 +02:00
mark	2301ea8df6	Add class argument	2023-08-05 13:18:23 +02:00
mark	e9434b327a	Standardize header	2023-08-05 13:09:41 +02:00
mark	3b1d5d838e	Add class argument	2023-08-05 13:09:29 +02:00
mark	4e5ea23b66	Add class argument	2023-08-05 13:03:30 +02:00
mark	3ad19673a4	Improve rendering of example shortcode	2023-08-05 12:55:52 +02:00
mark	bb58394a43	Refine caching	2023-08-04 13:52:15 +02:00
mark	f574888563	Sanitize SEO thumbnail	2023-08-04 13:47:10 +02:00
mark	7339c262b5	Improve build cache	2023-08-04 13:46:53 +02:00
mark	51f9d204b9	Fix indentation	2023-08-04 13:46:01 +02:00
Mark Dumay	3d082a51a3	Merge pull request #388 from gethinode/develop Update dependencies	2023-08-04 11:28:48 +02:00
mark	db6b6238c5	Update twitter logo	2023-08-04 10:21:32 +02:00
mark	6011e5637a	Update package version	2023-08-04 10:13:43 +02:00
mark	855bf85be6	Bump dependencies	2023-08-04 10:13:01 +02:00
mark	ec37884f7a	Clean up fontawesome package	2023-08-04 10:12:21 +02:00
mark	057720bca8	Bump dependencies	2023-08-04 10:11:22 +02:00
Mark Dumay	e3d607bd25	Merge pull request #387 from gethinode/main Sync with main	2023-08-04 10:10:33 +02:00
Mark Dumay	a9e3a5ecbb	Merge pull request #386 from gethinode/markdumay-patch-1 Update dependabot.yml	2023-08-04 08:45:27 +02:00
Mark Dumay	f9a3edbf30	Update dependabot.yml	2023-08-04 08:31:38 +02:00
github-actions[bot]	c199aa0902	Merge pull request #384 from gethinode/dependabot/npm_and_yarn/fortawesome/fontawesome-free-6.4.2 Bump @fortawesome/fontawesome-free from 6.4.0 to 6.4.2	2023-08-03 13:56:37 +00:00
dependabot[bot]	dfafdbb8af	Bump @fortawesome/fontawesome-free from 6.4.0 to 6.4.2 Bumps [@fortawesome/fontawesome-free](https://github.com/FortAwesome/Font-Awesome) from 6.4.0 to 6.4.2. - [Release notes](https://github.com/FortAwesome/Font-Awesome/releases) - [Changelog](https://github.com/FortAwesome/Font-Awesome/blob/6.x/CHANGELOG.md) - [Commits](https://github.com/FortAwesome/Font-Awesome/compare/6.4.0...6.4.2) --- updated-dependencies: - dependency-name: "@fortawesome/fontawesome-free" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2023-08-03 13:51:18 +00:00
Mark Dumay	c4d8507638	Merge pull request #381 from gethinode/develop Fix spacing for external link icons	2023-08-02 14:55:03 +02:00
Mark Dumay	44d5cfa4de	Merge branch 'main' into develop	2023-08-02 14:41:00 +02:00
mark	5aa3cfb80f	Bump package version	2023-08-02 14:40:28 +02:00
mark	22b83dbcf9	Fix spacing for external link icons	2023-08-02 14:37:51 +02:00
Mark Dumay	0a88ae04b9	Merge pull request #380 from gethinode/develop Refine icon support	2023-08-02 13:57:47 +02:00
Mark Dumay	bf068977a6	Merge branch 'main' into develop	2023-08-02 13:51:20 +02:00
mark	5dfc99efa0	Bump package version	2023-08-02 13:50:16 +02:00
mark	84f09f0dcb	Bump dependencies	2023-08-02 13:49:51 +02:00
mark	65d9635f61	Shift fa-fluid to mod-fontawesome	2023-08-02 13:49:39 +02:00
mark	452bd92029	Adjust layout	2023-08-02 13:33:20 +02:00
mark	87fc26e289	Support shorthand notation for menu icons	2023-08-02 13:33:11 +02:00
Mark Dumay	aad1335523	Merge pull request #378 from gethinode/develop Enable inline icons	2023-08-02 09:24:07 +02:00
mark	a216b26857	Adjust spacing of theme icons	2023-08-02 09:10:45 +02:00
mark	2c121c6cde	Adjust spacing of prev/next navigation	2023-08-02 09:02:07 +02:00
mark	2bc4ff0233	Remove superfluous closing tag	2023-08-02 08:59:55 +02:00
mark	a76c80ba17	Fix spacing of icons	2023-08-02 08:52:31 +02:00
mark	6580955770	Bump package version	2023-08-02 08:39:52 +02:00
mark	38d6c01983	Update icon references	2023-08-02 08:39:21 +02:00
Mark Dumay	af2ba38a86	Merge branch 'main' into develop	2023-08-02 07:38:57 +02:00
mark	0242d388b5	Bump package version	2023-08-02 07:38:04 +02:00
mark	5a78dda34f	Enable inline icons	2023-08-02 07:37:22 +02:00
github-actions[bot]	8564e3e2fc	Merge pull request #377 from gethinode/dependabot/npm_and_yarn/hugo-bin-0.112.1 Bump hugo-bin from 0.112.0 to 0.112.1	2023-08-01 13:59:31 +00:00
dependabot[bot]	913c6ad158	Bump hugo-bin from 0.112.0 to 0.112.1 Bumps [hugo-bin](https://github.com/fenneclab/hugo-bin) from 0.112.0 to 0.112.1. - [Release notes](https://github.com/fenneclab/hugo-bin/releases) - [Commits](https://github.com/fenneclab/hugo-bin/compare/v0.112.0...v0.112.1) --- updated-dependencies: - dependency-name: hugo-bin dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2023-08-01 13:55:10 +00:00
github-actions[bot]	5e676ee5fa	Merge pull request #375 from gethinode/dependabot/npm_and_yarn/hugo-bin-0.112.0 Bump hugo-bin from 0.111.4 to 0.112.0	2023-08-01 06:42:51 +00:00
dependabot[bot]	f1b4e556c4	Bump hugo-bin from 0.111.4 to 0.112.0 Bumps [hugo-bin](https://github.com/fenneclab/hugo-bin) from 0.111.4 to 0.112.0. - [Release notes](https://github.com/fenneclab/hugo-bin/releases) - [Commits](https://github.com/fenneclab/hugo-bin/compare/v0.111.4...v0.112.0) --- updated-dependencies: - dependency-name: hugo-bin dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2023-07-31 13:42:22 +00:00
github-actions[bot]	9856b670e6	Merge pull request #374 from gethinode/dependabot/npm_and_yarn/eslint-8.46.0 Bump eslint from 8.45.0 to 8.46.0	2023-07-31 13:41:36 +00:00
dependabot[bot]	88ff187891	Bump eslint from 8.45.0 to 8.46.0 Bumps [eslint](https://github.com/eslint/eslint) from 8.45.0 to 8.46.0. - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](https://github.com/eslint/eslint/compare/v8.45.0...v8.46.0) --- updated-dependencies: - dependency-name: eslint dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2023-07-31 13:36:55 +00:00
Mark Dumay	5c54291eb8	Merge pull request #372 from gethinode/develop Implement web sharing	2023-07-31 07:57:59 +02:00
Mark Dumay	2a862034aa	Merge branch 'main' into develop	2023-07-31 07:40:43 +02:00
mark	56e0713582	Exclude sharing.js from linting	2023-07-31 07:39:58 +02:00
mark	23a3f7ef71	Bump package version	2023-07-31 07:39:02 +02:00
mark	3418ac8d1d	Implement Support Web Share API #294	2023-07-31 07:38:29 +02:00
mark	c645024474	Support custom attributes	2023-07-31 07:37:53 +02:00
Mark Dumay	6dd208f671	Merge pull request #369 from gethinode/main Sync with main	2023-07-30 14:45:38 +02:00