Merge pull request #404 from gethinode/develop

Bump dependencies

.eslintignore

@@ -1,5 +1,6 @@
+assets/js/critical/color.js
 assets/js/analytics.js
-assets/js/color.js
 assets/js/flexsearch.js
+assets/js/sharing.js
 assets/js/vendor
 node_modules

.github/dependabot.yml

@@ -7,3 +7,4 @@ updates:
     directory: "/"
     schedule:
       interval: "daily"
+    versioning-strategy: increase

.github/workflows/build.yml

@@ -12,7 +12,7 @@ jobs:
     strategy:
       matrix:
         os: [macos-latest, windows-latest, ubuntu-latest]
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     runs-on: ${{ matrix.os }}
@@ -24,5 +24,7 @@ jobs:
       with:
         node-version: ${{ matrix.node-version }}
         cache: 'npm'
+        cache-dependency-path: '**/package-lock.json'
     - run: npm ci
     - run: npm run build
+    - run: npm run build:example

.github/workflows/lint.yml

@@ -14,15 +14,18 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x, 18.x]
+        node-version: [16.x, 18.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     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

.gitignore

@@ -1,5 +1,5 @@
 /_vendor
-/public
+public/
 resources/
 node_modules/
 

README.md

@@ -56,10 +56,11 @@
 - [PageSpeed Insights][pagespeed]
 - [Mozilla Observatory][observatory]
 
-Hinode is a clean documentation and blog theme for [Hugo][hugo], an open-source static site generator. Based on the [Bootstrap 5][bootstrap] framework, the rendered site is fast, secure, and responsive. Hinode uses [FlexSearch][flexsearch] to enable full text search across your site. Finally, the theme uses [Node Package Manager][npm] to automate the build process and to keep track of dependencies.
+Hinode is a clean documentation and blog theme for [Hugo][hugo], an open-source static site generator. Based on the [Bootstrap 5][bootstrap] framework, the rendered site is fast, secure, and responsive. Hinode uses [FlexSearch][flexsearch] to enable full text search across your site. Finally, the theme supports [Node Package Manager][npm] to automate the build process and to keep track of dependencies.
 
 Additional features include:
 
+- Flexible configuration of Hugo modules
 - Switching between light mode and dark mode
 - Support for multiple languages
 - Reusable Bootstrap components through configurable shortcodes and partials

archetypes/default.md

@@ -1,2 +1,16 @@
-+++
-+++
+---
+# author: 
+title: {{ replace .Name "-" " " | title }}
+date: {{ .Date }}
+draft: true
+# layout: 
+# description: 
+# tags: 
+# icon: 
+# thumbnail: 
+    # url: 
+    # author: 
+    # authorURL: 
+    # origin: 
+    # originURL: 
+---

assets/js/critical/color.js

@@ -1,3 +1,5 @@
+{{- if site.Params.main.enableDarkMode -}}
+
 /*!
  * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
  * Copyright 2011-2022 The Bootstrap Authors
@@ -31,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')
@@ -68,3 +70,5 @@
       })
   })
 })()
+
+{{- end -}}

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 -}}

assets/scss/app.scss

@@ -5,10 +5,6 @@
 @import "common/variables.scss";
 @import "common/icons.scss";
 
-{{ if not (in site.Params.modules.core "bootstrap") }}
-    {{ errorf "Bootstrap is a required module, please add it to 'modules.core' in your site parameters" }}
-{{ end }}
-
 // Import Bootstrap configuration (mounted by core Bootstrap module)
 @import "bootstrap.scss";
 
@@ -22,6 +18,7 @@
 @import "components/clipboard.scss";
 @import "components/command.scss";
 @import "components/comments.scss";
+@import "components/feature.scss";
 @import "components/navbar.scss";
 @import "components/img.scss";
 @import "components/pagination.scss";

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;
-    }
-}

assets/scss/components/_feature.scss

@@ -0,0 +1,3 @@
+.feature {
+    margin-top: 0.3 * $navbar-offset;
+}

assets/scss/components/_syntax.scss

@@ -10,6 +10,7 @@
 
 .syntax-highlight {
     background-color: var(--bs-light) if($enable-important-utilities, !important, null);
+    overflow-x: auto;
 }
 
 .preview-background {
@@ -29,6 +30,7 @@
 
         .syntax-highlight {
             background-color: var(--bs-tertiary-bg) if($enable-important-utilities, !important, null);
+            overflow-x: auto;
         }
 
         .bg,

config/_default/hugo.toml

@@ -6,12 +6,13 @@ enableGitInfo = true
 # toml-docs-end main
 
 # additional settings
-googleAnalytics = "G-T85PPZ36GN"
-baseURL = "https://demo.gethinode.com/"
+# googleAnalytics = "G-xxxxxxxxxx"
+baseURL = "https://example.com/"
 canonifyURLs = false
 enableEmoji = true
 enableRobotsTXT = true
 enableInlineShortcodes = true
+summaryLength = 20
 
 # prevent build failures when using Hugo's Instagram shortcode due to deprecated Instagram API.
 # See https://github.com/gohugoio/hugo/issues/7228#issuecomment-714490456
@@ -24,7 +25,7 @@ timeout = "180s"
 # toml-docs-start language
 languageCode = "en-us"
 defaultContentLanguage = "en"
-defaultContentLanguageInSubdir = true
+defaultContentLanguageInSubdir = false
 # toml-docs-end language
 
 # toml-docs-start redirect

config/_default/languages.toml

@@ -1,31 +1,15 @@
 # toml-docs-start lang-main
 [en]
     languageName = "English"
-    contentDir = "content/en"
+    contentDir = "content"
     weight = 1
 # toml-docs-end lang-main
 # toml-docs-start lang-param
     [en.params.head]
         tagline = "A Hugo Theme"
-    [en.params.feature]
-        link = "about"
-        caption = "About"
+    [en.params.social]
+        title = "Follow me"
+        caption = "I work on everything coding and tweet developer memes"
     [en.params.footer]
-        license = "Licensed under Creative Commons (<a href='https://creativecommons.org/licenses/by-nc-sa/4.0/' class='link-secondary' target='_blank' rel='noopener noreferrer'>CC BY-NC-SA 4.0</a>)."
-        socialTitle = "Follow me"
-        socialCaption = "I work on everything coding and tweet developer memes"
+        # license = "Licensed under Creative Commons (<a href='https://creativecommons.org/licenses/by-nc-sa/4.0/' class='link-secondary' target='_blank' rel='noopener noreferrer'>CC BY-NC-SA 4.0</a>)."
 # toml-docs-end lang-param
-
-[nl]
-    languageName = "Nederlands"
-    contentDir = "content/nl"
-    weight = 2
-    [nl.params.head]
-        tagline = "Een Hugo Thema"
-    [nl.params.feature]
-        link = "over-mij"
-        caption = "Over mij"
-    [nl.params.footer]
-        license = "Gelicenseerd onder Creative Commons (<a href='https://creativecommons.org/licenses/by-nc-sa/4.0/' class='link-secondary' target='_blank' rel='noopener noreferrer'>CC BY-NC-SA 4.0</a>)."
-        socialTitle = "Volg mij"
-        socialCaption = "Ik doe aan programmeren en tweet memes"

config/_default/menus/menus.en.toml

@@ -1,50 +1,28 @@
 [[main]]
-  name = "About"
-  pageRef = "/about/"
+  name = "Home"
+  pageRef = "/"
   weight = 10
 
-[[main]]
-  name = "Blog"
-  pageRef = "/blog/"
-  weight = 20
-
-[[main]]
-  name = "Projects"
-  pageRef = "/projects/"
-  weight = 30
-
-[[main]]
-  name = "Sample project"
-  pageRef = "/projects/sample-project/"
-  parent = "Projects"
-  weight = 1
-
-[[main]]
-  name = "Another project"
-  pageRef = "/projects/another-project/"
-  parent = "Projects"
-  weight = 2
-
 [[main]]
   name = "Tags"
-  pageRef = "/tags/"
-  weight = 40
+  pageRef = "/tags"
+  weight = 20
 
 [[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
 

config/_default/params.toml

@@ -4,6 +4,11 @@
     description = "Hinode is a clean documentation and blog theme for your Hugo site based on Bootstrap 5."
     enableDarkMode = true
     modes = ["light", "dark"]
+    canonifyAssetsURLs = false
+    endorse = true
+    [main.externalLinks]
+        cue = false
+        tab = false
 # toml-docs-end main
 
 # toml-docs-start modules
@@ -12,6 +17,10 @@
     optional = ["leaflet", "katex"]
     excludeSCSS = ["bootstrap"]
     disableTemplate = ["katex"]
+    [modules.fontawesome]
+        inline = true
+        debug = true
+        skipMissing = false
 # toml-docs-end modules
 
 # toml-docs-start debugging
@@ -29,8 +38,7 @@
 
 # toml-docs-start home
 [home]
-    sections = ["blog", "projects"]
-    featurePhoto = "/img/sunrise.jpg" # source: https://unsplash.com/photos/ZX6BPboJrYk
+    # sections = ["posts"]
     fullCover = false
     centerHeadline = false
     style = ""
@@ -59,6 +67,7 @@
     enabled = true
     sort = "weight"
     reverse = false
+    webshare = true
 
 [[sharing.providers]]
     name = "LinkedIn"
@@ -69,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]]
@@ -93,37 +102,21 @@
 # toml-docs-end sharing
 
 # toml-docs-start sections
-[sections]
-    [sections.blog]
-        title = "Blog"
-        sort = "date"
-        reverse = true
-        nested = true
-        cols = 3
-        color = ""
-        padding = "0"
-        header = "full"
-        footer = "none"
-        orientation = "stacked"
-        style = "border-0 card-zoom"
-        homepage = 3
-        separator = true
-    [sections.projects]
-        title = "Projects"
-        layout = "card"
-        sort = "title"
-        reverse = false
-        nested = true
-        cols = 1
-        background = "body-tertiary"
-        color = "body"
-        padding = "3"
-        header = "none"
-        footer = "tags"
-        orientation = "horizontal"
-        style = "border-1 card-emphasize"
-        homepage = 3
-        separator = false
+# [sections]
+#     [sections.posts]
+#         title = "Posts"
+#         sort = "date"
+#         reverse = true
+#         nested = true
+#         cols = 3
+#         color = ""
+#         padding = "0"
+#         header = "full"
+#         footer = "none"
+#         orientation = "stacked"
+#         style = "border-0 card-zoom"
+#         homepage = 3
+#         separator = true
 # toml-docs-end sections
 
 [favicon]
@@ -187,11 +180,4 @@
     #theme = "" 
 
 [links]
-    bs_badge_heading = "https://getbootstrap.com/docs/5.2/components/badge/#headings"
-    hinode_docs = "https://gethinode.com/docs"
-    hugo_imaging = "https://gohugo.io/content-management/image-processing/#imaging-configuration"
-    mozilla_image = "https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images"
-    observatory = "https://observatory.mozilla.org/analyze/demo.gethinode.com"
-    pagespeed = "https://pagespeed.web.dev/report?url=https%3A%2F%2Fdemo.gethinode.com%2F"
-    utterances = "https://utteranc.es"
- 
+    hinode = "https://gethinode.com"

content/_index.md

@@ -0,0 +1,13 @@
+---
+title: Welcome to Hinode!
+thumbnail:
+    url: /img/sunrise.jpg
+    author: Harris Vo
+    authorURL: https://unsplash.com/@hoanvokim
+    origin: https://unsplash.com/photos/ZX6BPboJrYk
+    originName: Unsplash
+---
+
+A clean documentation and blog theme for your Hugo site based on Bootstrap 5.
+
+{{< button href="https://gethinode.com/docs" icon="fas book-open" order="first" >}}Get Started{{< /button>}}

content/en/_index.md

@@ -1,6 +0,0 @@
----
-author: Mark Dumay
-title: Welcome to Hinode!
----
-
-A clean documentation and blog theme for your Hugo site based on Bootstrap 5.

content/nl/_index.md

@@ -1,6 +0,0 @@
----
-author: Mark Dumay
-title: Welkom bij Hinode!
----
-
-Een documentatie en blog thema voor Hugo gebaseerd op Bootstrap 5.

content/nl/blog/bootstrap-elements.md

@@ -1,291 +0,0 @@
----
-author: Mark Dumay
-title: Bootstrap elementen
-slug: bootstrap-elementen
-date: 2023-02-17
-description: Gebruik shortcodes om eenvoudig Bootstrap elementen toe te voegen.
-tags: ["bootstrap", "shortcode"]
-thumbnail: img/boots.jpg
-photoCredits: <a href="https://unsplash.com/@nate_dumlao">Nathan Dumlao</a>
-photoSource: <a href="https://unsplash.com/photos/QLPWQvHvmII">Unsplash</a>
----
-
-Hinode beschikt over meerdere shortcodes om eenvoudig Bootstrap elementen toe te voegen aan je website. De [officiële documentatie]({{< param "links.hinode_docs" >}}) bevat meer details.
-
-## Accordion
-
-De volgende shortcode toont een accordion met drie elementen, waarvan de eerste is uitgeklapt.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* accordion */>}}
-  {{</* accordion-item header="Accordion Item #1" show="true" */>}}
-    Dit is de inhoud van het eerste element met ondersteuning voor HTML. De waarde <code>show</code>
-    voor het argument <code>class</code> geeft aan dat het element uitgeklapt moet worden.
-  {{</* /accordion-item */>}}
-  {{</* accordion-item header="Accordion Item #2" */>}}
-    Dit is de inhoud van het tweede element. Het ondersteunt ook HTML.
-  {{</* /accordion-item */>}}
-  {{</* accordion-item header="Accordion Item #3" */>}}
-    Dit is de inhoud van het derde element.
-  {{</* /accordion-item */>}}
-{{</* /accordion */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Alert
-
-De volgende shortcode toont een waarschuwing.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* alert color="danger" dismissible="true" */>}}
-    Een eenvoudige waarschuwing
-{{</* /alert */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Badge
-
-Gebruik HTML code om een label toe te voegen aan een titel. De Bootstrap [documentatie]({{< param "links.bs_badge_heading" >}}) beschrijft meer opties.
-
-{{< example >}}
-<h1>Voorbeeldtekst met grootte één <span class="badge bg-secondary">Nieuw</span></h1>
-<h2>Voorbeeldtekst met grootte twee <span class="badge bg-secondary">Nieuw</span></h2>
-<h3>Voorbeeldtekst met grootte drie <span class="badge bg-secondary">Nieuw</span></h3>
-<h4>Voorbeeldtekst met grootte vier <span class="badge bg-secondary">Nieuw</span></h4>
-<h5>Voorbeeldtekst met grootte vijf <span class="badge bg-secondary">Nieuw</span></h5>
-<h6>Voorbeeldtekst met grootte zes <span class="badge bg-secondary">Nieuw</span></h6>
-{{< /example >}}
-
-## Breadcrumb
-
-De volgende shortcode toont het navigatiepad voor de blog pagina.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* breadcrumb path="blog" */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Button
-
-De volgende shortcode toont een knop met een label en een aanwijzing.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* button color="secondary" tooltip="Toon je ongelezen berichten" href="#!" badge="99+" */>}}
-    Inbox
-{{</* /button */>}}
-{{< /example>}}
-<!-- markdownlint-enable MD037 -->
-
-## Button group
-
-De volgende shortcode toont een groep van drie knoppen.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* button-group aria-label="Basic example" */>}}
-  {{</* button color="primary" href="#!" */>}}Links{{</* /button */>}}
-  {{</* button color="primary" href="#!" */>}}Midden{{</* /button */>}}
-  {{</* button color="primary" href="#!" */>}}Rechts{{</* /button */>}}
-{{</* /button-group */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Card
-
-De volgende shortcode toont een kaart dat linkt naar de [over mij]({{< ref "about" >}}) pagina. De kaart bevat een titel.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* card path="about" padding="3" class="w-50" color="body-tertiary" header="publication" footer="none" */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Carousel
-
-De volgende shortcode toont een carousel met drie pagina's, in een verhouding van 16x9 voor een breedte van 67% op grotere schermen.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* carousel ratio="16x9" class="col-sm-12 col-lg-8 mx-auto" */>}}
-  {{</* img src="img/coffee.jpg" caption="pagina 1" */>}}
-  {{</* img src="img/phone.jpg" caption="pagina 2" */>}}
-  {{</* img src="img/dunes.jpg" caption="pagina 3" */>}}
-{{</* /carousel */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Collapse
-
-De volgende shortcode toont een knop die een informatiepaneel toont of verbergt.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* button collapse="collapse-1" */>}}
-    Trigger panel
-{{</* /button */>}}
-
-{{</* collapse id="collapse-1" class="p-3 border rounded" */>}}
-    Dit is een voorbeeldtekst. Het informatiepaneel is <i>standaard verborgen </i> maar wordt getoond als
-    de gebruiker op de bijbehorende knop drukt.
-{{</* /collapse */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Command prompt
-
-De volgende shortcode toont een prompt voor bash.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* command */>}}
-export MY_VAR=123
-{{</* /command */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-Voeg  `user` en `host` om de gebruikerscontext op te geven. Als aanvulling, `(out)` definieert een outputregel en `\` is een markering die aangeeft dat de regel doorgaat op de volgende regel.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* command user="user" host="localhost" */>}}
-export MY_VAR=123
-echo "hello"
-(out)hello
-echo one \
-two \
-three
-(out)one two three
-echo "goodbye"
-(out)goodbye
-{{</* /command */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Docs
-
-Gebruik de volgende shortcode om de inhoud van een `toml` of `scss` bestand te tonen.
-
-{{< docs name="theme-colors" file="config/_default/params.toml" >}}
-
-## Icon
-
-De volgende shortcodes tonen drie verschillende iconen:
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* fa square-check */>}}
-{{</* fab linkedin */>}}
-{{</* fas circle-check */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Image
-
-De volgende shortcode toont een plaatje met afgeronde hoeken en een 21x9 verhouding.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* image src="img/flowers.jpg" ratio="21x9" caption="Onderschrift" class="rounded" */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Nav
-
-De volgende shortcode toont een groep met verticale tabbladen.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-  {{</* nav type="pills" vertical="true" */>}}
-    {{</* nav-item header="Nav Item #1" show="true" */>}}
-    Dit is de inhoud van het eerste element met ondersteuning voor HTML. De waarde <code>show</code>
-    voor het argument <code>class</code> geeft aan dat het element uitgeklapt moet worden.
-    {{</* /nav-item */>}}
-    {{</* nav-item header="Nav Item #2" */>}}
-    Dit is de inhoud van het tweede element. Het ondersteunt ook HTML.
-    {{</* /nav-item */>}}
-    {{</* nav-item header="Nav Item #3" */>}}
-    Dit is de inhoud van het derde element.
-    {{</* /nav-item */>}}
-  {{</* /nav */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Navbar
-
-De volgende shortcode toont een navigatiemenu.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* navbar path="about" color="primary" size="md" search="false" menus="sample" title="Brand" mode="false" */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Release
-
-De volgende shortcode toont een knop voor een nieuwe release.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* release version="v0.14.1" */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Spinner
-
-De volgende shortcode toont een ronddraaiende cirkel.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* spinner color="info" class="text-center" */>}}
-Loading...
-{{</* /spinner */>}}
-{{< /example>}}
-<!-- markdownlint-enable MD037 -->
-
-## Timeline
-
-De volgende shortcode toont een tijdslijn met het bestand `data/timeline-nl.yml` als input.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* timeline data="timeline-nl" */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Toast
-
-De volgende shortcode toont een knop die een bericht laat verschijnen op het scherm.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* button toast="toast-example-1" */>}}
-    Toon bericht 1
-{{</* /button */>}}
-
-{{</* button toast="toast-example-2" */>}}
-    Toon bericht 2
-{{</* /button */>}}
-
-{{</* toast id="toast-example-1" header="Eerste titel" */>}}
-    Dit is het eerste bericht.
-{{</* /toast */>}}
-
-{{</* toast id="toast-example-2" header="Tweede titel" */>}}
-    Dit is het tweede bericht.
-{{</* /toast */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->
-
-## Tooltip
-
-De volgende shortcode toont een uitleg voor een gekleurde link.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* tooltip color="primary" title="Tooltip" href="#!" */>}}Tooltip{{</* /tooltip */>}} demonstratie
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->

content/nl/blog/components.md

@@ -1,37 +0,0 @@
----
-author: Mark Dumay
-title: Componenten
-slug: componenten
-date: 2023-07-21
-description: Gebruik shortcodes om voorgedefiniëerde componenten toe te voegen die gebruikmaken van externe libraries.
-tags: ["bootstrap", "shortcode"]
-thumbnail: img/puzzle.jpg
-photoCredits: <a href="https://unsplash.com/@ryoji__iwata">Ryoji Iwata</a>
-photoSource: <a href="https://unsplash.com/photos/5siQcvSxCP8">Unsplash</a>
-modules: ["katex", "leaflet"]
----
-
-Hinode biedt meerdere shortcodes aan bovenop de gebruikelijke [Bootstrap elementen]({{< relref "bootstrap-elements" >}}). Zie de [officiële documentatie]({{< param "links.hinode_docs" >}}) voor meer details.
-
-## Formule (KaTeX)
-
-De volgende markdown code genereert twee wiskundige formules met behulp van KaTeX.
-
-{{< example lang="markdown" >}}
-Dit is een inline $-b \pm \sqrt{b^2 - 4ac} \over 2a$ formule
-
-Dit is geen inline formule:
-
-$$x = a_0 + \frac{1}{a_1 + \frac{1}{a_2 + \frac{1}{a_3 + a_4}}}$$  
-$$\forall x \in X, \quad \exists y \leq \epsilon$$
-{{< /example >}}
-
-## Map
-
-De volgende shortcode toont een interactieve kaart van Amsterdam.
-
-<!-- markdownlint-disable MD037 -->
-{{< example lang="hugo" >}}
-{{</* map lat=52.377 long=4.90 zoom=13 popup="Amsterdam CS" popup-lat=52.378062 popup-long=4.900562 */>}}
-{{< /example >}}
-<!-- markdownlint-enable MD037 -->

exampleSite/config/_default/hugo.toml

@@ -0,0 +1,78 @@
+title = "Hinode"
+copyright = "Copyright © 2023 Mark Dumay."
+paginate = 9
+enableGitInfo = true
+
+# additional settings
+googleAnalytics = "G-T85PPZ36GN"
+baseURL = "https://demo.gethinode.com/"
+canonifyURLs = false
+enableEmoji = true
+enableRobotsTXT = true
+enableInlineShortcodes = true
+
+# prevent build failures when using Hugo's Instagram shortcode due to deprecated Instagram API.
+# See https://github.com/gohugoio/hugo/issues/7228#issuecomment-714490456
+ignoreErrors = ["error-remote-getjson"]
+
+timeout = "180s"
+
+languageCode = "en-us"
+defaultContentLanguage = "en"
+defaultContentLanguageInSubdir = true
+
+[outputFormats.REDIR]
+mediaType = "text/netlify"
+baseName = "_redirects"
+isPlainText = true
+notAlternative = true
+
+[mediaTypes."text/netlify"]
+delimiter = ""
+
+[outputs]
+home = ["HTML", "RSS", "REDIR"]
+
+[build]
+  writeStats = true
+  
+[taxonomies]
+  tag = 'tags'
+
+[privacy]
+  [privacy.vimeo]
+    disabled = false
+    simple = true
+
+  [privacy.twitter]
+    disabled = false
+    enableDNT = true
+    simple = true
+
+  [privacy.instagram]
+    disabled = false
+    simple = true
+
+  [privacy.youtube]
+    disabled = false
+    privacyEnhanced = true
+
+[services]
+  [services.instagram]
+    disableInlineCSS = true
+  [services.twitter]
+    disableInlineCSS = true
+
+[outputFormats]
+  [outputFormats.XML]
+    isPlainText = false
+    mediaType = "application/xml"
+    isHtml = false
+    noUgly = true
+    permalinkable = false
+    name = "xml"
+
+[module]
+  replacements = 'github.com/gethinode/hinode -> ../..'
+  [[module.imports]]
+    path = "github.com/gethinode/hinode"

exampleSite/config/_default/languages.toml

@@ -0,0 +1,36 @@
+# toml-docs-start lang-main
+[en]
+    languageName = "English"
+    contentDir = "content/en"
+    weight = 1
+# toml-docs-end lang-main
+# toml-docs-start lang-param
+    [en.params.head]
+        tagline = "A Hugo Theme"
+    [en.params.social]
+        title = "Follow me"
+        caption = "I work on everything coding and tweet developer memes"
+    [en.params.footer]
+        # license = "Licensed under Creative Commons (<a href='https://creativecommons.org/licenses/by-nc-sa/4.0/' class='link-secondary' target='_blank' rel='noopener noreferrer'>CC BY-NC-SA 4.0</a>)."
+# toml-docs-end lang-param
+    [en.params.sections.blog]
+        reference = "More Posts"
+    [en.params.sections.projects]
+        reference = "More Projects"
+
+[nl]
+    languageName = "Nederlands"
+    contentDir = "content/nl"
+    weight = 2
+    [nl.params.head]
+        tagline = "Een Hugo Thema"
+    [nl.params.social]
+        title = "Volg mij"
+        caption = "Ik doe aan programmeren en tweet memes"
+    [nl.params.footer]
+        # license = "Gelicenseerd onder Creative Commons (<a href='https://creativecommons.org/licenses/by-nc-sa/4.0/' class='link-secondary' target='_blank' rel='noopener noreferrer'>CC BY-NC-SA 4.0</a>)."
+    [nl.params.sections.blog]
+        reference = "Meer artikelen"
+    [nl.params.sections.projects]
+        title = "Projecten"
+        reference = "Meer projecten"

exampleSite/config/_default/markup.toml

@@ -0,0 +1,35 @@
+defaultMarkdownHandler = "goldmark"
+
+[highlight]
+    anchorLineNos = false
+    codeFences = true
+    guessSyntax = true
+    hl_Lines = ""
+    lineAnchors = ""
+    lineNoStart = 1
+    lineNos = false
+    lineNumbersInTable = false
+    noClasses = false
+    tabWidth = 2
+    ## Update the 'create:syntax' command in package.json to modify the style
+    ## The first two lines have been modified to remove the background color
+    # style = "monokailight" 
+
+[goldmark]
+    [goldmark.extensions]
+        definitionList = true
+        footnote = true
+        linkify = true
+        strikethrough = true
+        table = true
+        taskList = true
+        typographer = true
+    [goldmark.parser]
+        autoHeadingID = true
+        autoHeadingIDType = 'github'
+    [goldmark.parser.attribute]
+        block = true
+    [goldmark.renderer]
+        hardWraps = false
+        unsafe = true
+        xhtml = false

exampleSite/config/_default/menus/menus.en.toml

@@ -0,0 +1,73 @@
+[[main]]
+  name = "About"
+  pageRef = "/about/"
+  weight = 10
+
+[[main]]
+  name = "Blog"
+  pageRef = "/blog/"
+  weight = 20
+
+[[main]]
+  name = "Projects"
+  pageRef = "/projects/"
+  weight = 30
+
+[[main]]
+  name = "Sample project"
+  pageRef = "/projects/sample-project/"
+  parent = "Projects"
+  weight = 1
+
+[[main]]
+  name = "Another project"
+  pageRef = "/projects/another-project/"
+  parent = "Projects"
+  weight = 2
+
+[[main]]
+  name = "Tags"
+  pageRef = "/tags/"
+  weight = 40
+
+[[social]]
+  name = "LinkedIn"
+  pre = "fab linkedin"
+  url = "https://linkedin.com/"
+  weight = 10
+
+[[social]]
+  name = "GitHub"
+  pre = "fab fa-github"
+  url = "https://github.com/"
+  weight = 20
+
+[[social]]
+  name = "Medium"
+  pre = "fab medium"
+  url = "https://medium.com/"
+  weight = 30
+
+# toml-docs-start sample-navigation
+[[sample]]
+  name = "Blog"
+  pageRef = "/blog/"
+  weight = 10
+
+[[sample]]
+  name = "Projects"
+  pageRef = "/projects/"
+  weight = 20
+
+[[sample]]
+  name = "Sample project"
+  pageRef = "/projects/sample-project/"
+  parent = "Projects"
+  weight = 1
+
+[[sample]]
+  name = "Another project"
+  pageRef = "/projects/another-project/"
+  parent = "Projects"
+  weight = 2
+# toml-docs-end sample-navigation

exampleSite/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
 

exampleSite/config/_default/params.toml

@@ -0,0 +1,183 @@
+[main]
+    separator = "-"
+    description = "Hinode is a clean documentation and blog theme for your Hugo site based on Bootstrap 5."
+    enableDarkMode = true
+    modes = ["light", "dark"]
+    canonifyAssetsURLs = false
+    [main.externalLinks]
+        cue = true
+        tab = true
+
+[modules]
+    core = ["bootstrap", "flexsearch", "fontawesome"]
+    optional = ["leaflet", "katex"]
+    excludeSCSS = ["bootstrap"]
+    disableTemplate = ["katex"]
+    [modules.fontawesome]
+        inline = true
+        debug = true
+        skipMissing = false
+
+[debugging]
+    showJS = false
+    showSCSS = false
+
+[docs]
+    basePath = "/" # TODO: replace
+    github = "https://github.com/gethinode/hinode"
+    release = "https://github.com/gethinode/hinode/releases/tag/"
+    checkVersion = false
+
+[home]
+    sections = ["blog", "projects"]
+    fullCover = false
+    centerHeadline = false
+    style = ""
+
+[navigation]
+    anchor = true
+    logo = "/img/logo_icon.svg"
+    color = "body"
+    fixed = true
+    offset = "3.8em"
+    search = true
+    breadcrumb = true
+    toc = true
+    sidebar = true
+
+[messages]
+    placement = "bottom-right"
+
+[sharing]
+    enabled = true
+    sort = "weight"
+    reverse = false
+    webshare = true
+
+[[sharing.providers]]
+    name = "LinkedIn"
+    url = "https://www.linkedin.com/sharing/share-offsite/?url={url}"
+    icon = "fab linkedin"
+    weight = 10
+
+[[sharing.providers]]
+    name = "Twitter"
+    url = "https://twitter.com/home?status={url}"
+    icon = "fab x-twitter"
+    weight = 20
+
+[[sharing.providers]]
+    name = "Facebook"
+    url = "https://www.facebook.com/sharer.php?u={url}"
+    icon = "fab facebook"
+    weight = 30
+
+[[sharing.providers]]
+    name = "WhatsApp"
+    url = "whatsapp://send?text={title}%20{url}"
+    icon = "fab whatsapp"
+    weight = 40
+
+[[sharing.providers]]
+    name = "email"
+    url = "{url}"
+    icon = "fas link"
+    weight = 50
+    clipboard = true
+
+[sections]
+    [sections.blog]
+        title = "Blog"
+        sort = "date"
+        reverse = true
+        cols = 3
+        color = ""
+        padding = "0"
+        header = "full"
+        footer = "none"
+        orientation = "stacked"
+        style = "border-0 card-zoom"
+        homepage = 3
+        separator = true
+    [sections.projects]
+        title = "Projects"
+        layout = "card"
+        sort = "title"
+        reverse = false
+        nested = true
+        cols = 1
+        background = "body-tertiary"
+        color = "body"
+        padding = "3"
+        header = "none"
+        footer = "tags"
+        orientation = "horizontal"
+        style = "border-1 card-emphasize"
+        homepage = 3
+        separator = false
+
+[favicon]
+    logo = "img/favicon.png"
+    sizes = [16, 32, 48]
+
+# toml-docs-start theme-colors
+[style]
+    primary = "#d43900"
+    secondary = "#6c757d"
+    success = "#198754"
+    info = "#0dcaf0"
+    warning = "#ffc107"
+    danger = "#dc3545"
+    light = "#f8f9fa"
+    dark = "#212529"
+    themeOpacity = "10"
+    themeFont = "Inter"
+    # themeFontPath = "https://fonts.googleapis.com/css2?family=Inter:wght@200;300;600&display=swap" # external path
+    themeFontPath = "/fonts" # local path
+    purge = true
+# toml-docs-end theme-colors
+
+[schema]
+    type = "Organization"
+    name = "Hinode"
+    locale = "en-US"
+    # twitter = "https://twitter.com/gethinode"
+    # linkedIn = ""
+    github = "https://github.com/gethinode/hinode"
+    section = "blog"
+    [author]
+        name = "Mark Dumay"
+        # twitter = "https://twitter.com/markdumay"
+        linkedin = "https://www.linkedin.com/in/markdumay/"
+        github = "https://github.com/markdumay"
+    [logo]
+        url = "img/logo512x512.png"
+        width = 512
+        height = 512
+    [image]
+        url = "img/logo1280x640.png"
+        width = 1280
+        height = 640
+
+[opengraph]
+    images = ["logo.png"]
+    locale = "en_US"
+
+[comments]
+    enabled = false
+    repo = "" # Replace with your repository.
+    #issueTerm = "pathname" # pathname, url, title, og:title
+    #label = "comment"
+    # By default, light and dark mode correspond to github-light and github-dark, respectively.
+    # Optional values: github-light, github-dark, preferred-color-scheme, github-dark-orange, icy-dark, dark-blue, photon-dark.
+    #theme = "" 
+
+[links]
+    bs_badge_heading = "https://getbootstrap.com/docs/5.3/components/badge/#headings"
+    hinode_docs = "https://gethinode.com"
+    hugo_imaging = "https://gohugo.io/content-management/image-processing/#imaging-configuration"
+    mozilla_image = "https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images"
+    observatory = "https://observatory.mozilla.org/analyze/demo.gethinode.com"
+    pagespeed = "https://pagespeed.web.dev/report?url=https%3A%2F%2Fdemo.gethinode.com%2F"
+    utterances = "https://utteranc.es"
+    hinode = "https://gethinode.com"

exampleSite/config/_default/server.toml

@@ -0,0 +1,43 @@
+# toml-docs-start server-config
+[[headers]]
+for = '/**'
+[headers.values]
+    Strict-Transport-Security = "max-age=31536000; includeSubDomains; preload"
+    X-Content-Type-Options = "nosniff"
+    X-XSS-Protection = "1; mode=block"
+    Content-Security-Policy = """\
+        default-src 'self'; \
+        script-src 'self' \
+            https://utteranc.es/client.js https://*.google-analytics.com https://*.googletagmanager.com; \
+        style-src 'self' https://utteranc.es https://fonts.googleapis.com https://www.youtube.com; \
+        object-src 'none'; \
+        base-uri 'self'; \
+        connect-src 'self'
+            https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com; \
+        font-src 'self' https://fonts.gstatic.com; \
+        frame-src 'self' https://utteranc.es https://www.youtube-nocookie.com https://www.youtube.com; \
+        img-src 'self' data: https://i.vimeocdn.com https://i.ytimg.com https://*.google-analytics.com https://*.googletagmanager.com https://tile.openstreetmap.org; \
+        manifest-src 'self'; \
+        media-src 'self' \
+        """
+    X-Frame-Options = "SAMEORIGIN"
+    Referrer-Policy = "strict-origin"
+    Permissions-Policy = """\
+        geolocation=(), \
+        midi=(), \
+        sync-xhr=(), \
+        microphone=(), \
+        camera=(), \
+        magnetometer=(), \
+        gyroscope=(), \
+        fullscreen=(), \
+        payment=() \
+        """
+    cache-control = """\
+        max-age=0, \
+        no-cache, \
+        no-store, \
+        must-revalidate \
+        """
+    Access-Control-Allow-Origin = "*"
+# toml-docs-end server-config

exampleSite/content/en/_index.md

@@ -0,0 +1,14 @@
+---
+author: Mark Dumay
+title: Welcome to Hinode!
+thumbnail:
+    url: /img/sunrise.jpg
+    author: Harris Vo
+    authorURL: https://unsplash.com/@hoanvokim
+    origin: https://unsplash.com/photos/ZX6BPboJrYk
+    originName: Unsplash
+---
+
+A clean documentation and blog theme for your Hugo site based on Bootstrap 5.
+
+{{< button href="about" >}}About{{< /button>}}

exampleSite/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>

exampleSite/content/en/blog/bootstrap-elements.md

@@ -1,12 +1,15 @@
 ---
 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
-photoCredits: <a href="https://unsplash.com/@nate_dumlao">Nathan Dumlao</a>
-photoSource: <a href="https://unsplash.com/photos/QLPWQvHvmII">Unsplash</a>
+thumbnail:
+  url: img/boots.jpg
+  author: Nathan Dumlao
+  authorURL: https://unsplash.com/@nate_dumlao
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/QLPWQvHvmII
 ---
 
 Hinode provides several shortcodes that wrap common Bootstrap components. Refer to the [official documentation]({{< param "links.hinode_docs" >}}) for more details.
@@ -170,6 +173,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.

exampleSite/content/en/blog/components.md

@@ -4,9 +4,12 @@ title: Components
 date: 2023-07-21
 description: Use shortcodes to add predefined components powered by external libraries.
 tags: ["bootstrap", "shortcode"]
-thumbnail: img/puzzle.jpg
-photoCredits: <a href="https://unsplash.com/@ryoji__iwata">Ryoji Iwata</a>
-photoSource: <a href="https://unsplash.com/photos/5siQcvSxCP8">Unsplash</a>
+thumbnail:
+  url: img/puzzle.jpg
+  author: Ryoji Iwata
+  authorURL: https://unsplash.com/@ryoji__iwata
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/5siQcvSxCP8
 modules: ["katex", "leaflet"]
 ---
 

exampleSite/content/en/blog/first-post.md

@@ -4,9 +4,12 @@ title: First post
 date: 2022-10-01
 description: This is my first blog post.
 tags: ["blog"]
-thumbnail: img/notepad.jpg
-photoCredits: <a href="https://unsplash.com/@frederickjmedina">Frederick Medina</a>
-photoSource: <a href="https://unsplash.com/photos/PdfRE-xB--s">Unsplash</a>
+thumbnail:
+  url: img/notepad.jpg
+  author: Frederick Medina
+  authorURL: https://unsplash.com/@frederickjmedina
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/PdfRE-xB--s
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vulputate, ante in luctus congue, leo risus semper justo, vel consequat sapien lectus quis ipsum. In imperdiet urna justo. Nulla vel pellentesque ipsum. Cras congue feugiat dolor ac aliquam. Pellentesque eget dui venenatis, ultrices urna ac, vehicula nibh. Curabitur est lectus, dapibus eu vehicula non, malesuada et dui. Nam enim nulla, egestas et nunc non, elementum aliquet justo. Mauris euismod mauris sapien, eget vestibulum odio dictum sit amet. Morbi nisl elit, placerat at auctor in, finibus ac neque. Curabitur placerat feugiat risus non vestibulum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis cursus est, nec posuere libero.

exampleSite/content/en/blog/fourth-post.md

@@ -4,9 +4,12 @@ title: Fourth post
 date: 2023-01-01
 description: This is my fourth blog post.
 tags: ["blog"]
-thumbnail: img/flowers.jpg # https://picsum.photos/id/106/2592/1728
-photoCredits: <a href="https://unsplash.com/@flutterhappy">Arvee Marie</a>
-photoSource: <a href="https://unsplash.com/photos/YnfGtpt2gf4">Unsplash</a>
+thumbnail:
+  url: img/flowers.jpg
+  author: Arvee Marie
+  authorURL: https://unsplash.com/@flutterhappy
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/YnfGtpt2gf4
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam finibus libero in felis accumsan, vitae imperdiet metus vehicula. Quisque nec dignissim purus. In id dui porta sapien posuere viverra nec vel nisi. Sed varius tincidunt lectus, quis sagittis felis interdum id. Proin purus odio, ultrices auctor libero convallis, volutpat gravida turpis. Ut commodo metus orci, quis sagittis lectus rhoncus non. Nulla et lectus tortor. Suspendisse quam felis, molestie non odio quis, consequat venenatis orci. Etiam sed turpis sit amet elit scelerisque imperdiet. Sed suscipit felis non nibh suscipit egestas. Nulla sodales libero non rhoncus consequat. Nunc in elit at est cursus congue ut ac velit. Cras luctus libero augue, id semper sapien volutpat ultrices.

exampleSite/content/en/blog/second-post.md

@@ -4,9 +4,12 @@ title: Second post
 date: 2022-11-01
 description: This is my second blog post.
 tags: ["blog"]
-thumbnail: img/phone.jpg # https://picsum.photos/id/160/3200/2119
-photoCredits: <a href="https://unsplash.com/@thomweerd">Thom</a> 
-photoSource: <a href="https://unsplash.com/photos/Zdcq3iKly6g">Unsplash</a>
+thumbnail:
+  url: img/phone.jpg
+  author: Thom
+  authorURL: https://unsplash.com/@thomweerd
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/Zdcq3iKly6g
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non sollicitudin sapien. Ut porttitor lectus eu tempor ultricies. Sed semper tincidunt nibh pellentesque condimentum. Vivamus dictum sem eu rhoncus semper. Vestibulum convallis congue tincidunt. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Mauris magna urna, egestas sit amet ligula quis, viverra semper arcu. Praesent laoreet nunc vitae nulla posuere facilisis.

exampleSite/content/en/blog/third-post.md

@@ -4,9 +4,12 @@ title: Third post
 date: 2022-12-01
 description: This is my third blog post.
 tags: ["blog"]
-thumbnail: https://picsum.photos/id/184/4288/2848.jpg
-photoCredits: <a href="https://unsplash.com/@timdegroot">Tim de Groot</a>
-photoSource: <a href="https://unsplash.com/photos/yNGQ830uFB4">Unsplash</a>
+thumbnail:
+  url: https://picsum.photos/id/184/4288/2848.jpg
+  author: Tim de Groot
+  authorURL: https://unsplash.com/@timdegroot
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/yNGQ830uFB4
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent id scelerisque ligula. Vestibulum eu lorem tortor. Suspendisse tristique ultrices mauris, non maximus lorem faucibus in. Suspendisse sagittis eleifend dapibus. Curabitur dignissim luctus sapien eu consequat. Proin congue dui vel ipsum bibendum varius. Pellentesque cursus nisi metus, egestas eleifend ipsum sollicitudin vitae. Sed vitae erat elementum, semper turpis sed, molestie nulla.

exampleSite/content/nl/_index.md

@@ -0,0 +1,14 @@
+---
+author: Mark Dumay
+title: Welkom bij Hinode!
+thumbnail:
+    url: /img/sunrise.jpg
+    author: Harris Vo
+    authorURL: https://unsplash.com/@hoanvokim
+    origin: https://unsplash.com/photos/ZX6BPboJrYk
+    originName: Unsplash
+---
+
+Een documentatie en blog thema voor Hugo gebaseerd op Bootstrap 5.
+
+{{< button href="over-mij" >}}Over mij{{< /button>}}

exampleSite/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>

exampleSite/content/nl/blog/first-post.md

@@ -5,9 +5,12 @@ slug: eerste-artikel
 date: 2022-10-01
 description: Dit is mijn eerste artikel.
 tags: ["blog"]
-thumbnail: img/notepad.jpg
-photoCredits: <a href="https://unsplash.com/@frederickjmedina">Frederick Medina</a>
-photoSource: <a href="https://unsplash.com/photos/PdfRE-xB--s">Unsplash</a>
+thumbnail:
+  url: img/notepad.jpg
+  author: Frederick Medina
+  authorURL: https://unsplash.com/@frederickjmedina
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/PdfRE-xB--s
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vulputate, ante in luctus congue, leo risus semper justo, vel consequat sapien lectus quis ipsum. In imperdiet urna justo. Nulla vel pellentesque ipsum. Cras congue feugiat dolor ac aliquam. Pellentesque eget dui venenatis, ultrices urna ac, vehicula nibh. Curabitur est lectus, dapibus eu vehicula non, malesuada et dui. Nam enim nulla, egestas et nunc non, elementum aliquet justo. Mauris euismod mauris sapien, eget vestibulum odio dictum sit amet. Morbi nisl elit, placerat at auctor in, finibus ac neque. Curabitur placerat feugiat risus non vestibulum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis cursus est, nec posuere libero.

exampleSite/content/nl/blog/fourth-post.md

@@ -5,9 +5,12 @@ slug: vierde-artikel
 date: 2023-01-01
 description: Dit is mijn vierde artikel.
 tags: ["blog"]
-thumbnail: img/flowers.jpg # https://picsum.photos/id/106/2592/1728
-photoCredits: <a href="https://unsplash.com/@flutterhappy">Arvee Marie</a>
-photoSource: <a href="https://unsplash.com/photos/YnfGtpt2gf4">Unsplash</a>
+thumbnail:
+  url: img/flowers.jpg
+  author: Arvee Marie
+  authorURL: https://unsplash.com/@flutterhappy
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/YnfGtpt2gf4
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam finibus libero in felis accumsan, vitae imperdiet metus vehicula. Quisque nec dignissim purus. In id dui porta sapien posuere viverra nec vel nisi. Sed varius tincidunt lectus, quis sagittis felis interdum id. Proin purus odio, ultrices auctor libero convallis, volutpat gravida turpis. Ut commodo metus orci, quis sagittis lectus rhoncus non. Nulla et lectus tortor. Suspendisse quam felis, molestie non odio quis, consequat venenatis orci. Etiam sed turpis sit amet elit scelerisque imperdiet. Sed suscipit felis non nibh suscipit egestas. Nulla sodales libero non rhoncus consequat. Nunc in elit at est cursus congue ut ac velit. Cras luctus libero augue, id semper sapien volutpat ultrices.

exampleSite/content/nl/blog/second-post.md

@@ -5,9 +5,12 @@ slug: tweede-artikel
 date: 2022-11-01
 description: Dit is mijn tweede artikel.
 tags: ["blog"]
-thumbnail: img/phone.jpg # https://picsum.photos/id/160/3200/2119
-photoCredits: <a href="https://unsplash.com/@thomweerd">Thom</a> 
-photoSource: <a href="https://unsplash.com/photos/Zdcq3iKly6g">Unsplash</a>
+thumbnail:
+  url: img/phone.jpg
+  author: Thom
+  authorURL: https://unsplash.com/@thomweerd
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/Zdcq3iKly6g
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non sollicitudin sapien. Ut porttitor lectus eu tempor ultricies. Sed semper tincidunt nibh pellentesque condimentum. Vivamus dictum sem eu rhoncus semper. Vestibulum convallis congue tincidunt. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Mauris magna urna, egestas sit amet ligula quis, viverra semper arcu. Praesent laoreet nunc vitae nulla posuere facilisis.

exampleSite/content/nl/blog/third-post.md

@@ -5,9 +5,12 @@ slug: derde-artikel
 date: 2022-12-01
 description: Dit is mijn derde artikel.
 tags: ["blog"]
-thumbnail: https://picsum.photos/id/184/4288/2848.jpg
-photoCredits: <a href="https://unsplash.com/@timdegroot">Tim de Groot</a>
-photoSource: <a href="https://unsplash.com/photos/yNGQ830uFB4">Unsplash</a>
+thumbnail:
+  url: https://picsum.photos/id/184/4288/2848.jpg
+  author: Tim de Groot
+  authorURL: https://unsplash.com/@timdegroot
+  origin: Unsplash
+  originURL: https://unsplash.com/photos/yNGQ830uFB4
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent id scelerisque ligula. Vestibulum eu lorem tortor. Suspendisse tristique ultrices mauris, non maximus lorem faucibus in. Suspendisse sagittis eleifend dapibus. Curabitur dignissim luctus sapien eu consequat. Proin congue dui vel ipsum bibendum varius. Pellentesque cursus nisi metus, egestas eleifend ipsum sollicitudin vitae. Sed vitae erat elementum, semper turpis sed, molestie nulla.

exampleSite/go.mod

@@ -0,0 +1,11 @@
+module github.com/gethinode/hinode-test
+
+go 1.19
+
+require (
+	github.com/gethinode/mod-bootstrap v1.1.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.4 // indirect
+)

exampleSite/go.sum

@@ -0,0 +1,10 @@
+github.com/gethinode/mod-bootstrap v1.1.1 h1:Tx4M5hGVOFrEaxnUONDAm6N9xuRi5UphKlT7F26HujU=
+github.com/gethinode/mod-bootstrap v1.1.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
+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.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.2 h1:pIG4n3qLl/IVe7BEiwn+GL8r5lOCtF6FDxlcrPKdAXk=
+github.com/gethinode/mod-katex v1.0.2/go.mod h1:byAfpI3wuqNJIooTGVEGc1cjBhhCy4+CcK1H6495MYg=
+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=

go.mod

@@ -3,9 +3,9 @@ module github.com/gethinode/hinode
 go 1.19
 
 require (
-	github.com/gethinode/mod-bootstrap v1.1.0 // indirect
-	github.com/gethinode/mod-flexsearch v1.1.2 // indirect
-	github.com/gethinode/mod-fontawesome v1.2.1 // indirect
+	github.com/gethinode/mod-bootstrap v1.1.1 // indirect
+	github.com/gethinode/mod-flexsearch v1.2.0 // indirect
+	github.com/gethinode/mod-fontawesome v1.2.5 // 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
 )

go.sum

@@ -2,6 +2,8 @@ github.com/gethinode/mod-bootstrap v1.0.1 h1:NDZar+UEL42YHCvzzO+jVgqkZU5INA12Bpj
 github.com/gethinode/mod-bootstrap v1.0.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-bootstrap v1.1.0 h1:BbalsW8kmFhv+J+dcc41TGcjIlM/p69AB0h0oGhAXIU=
 github.com/gethinode/mod-bootstrap v1.1.0/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
+github.com/gethinode/mod-bootstrap v1.1.1 h1:Tx4M5hGVOFrEaxnUONDAm6N9xuRi5UphKlT7F26HujU=
+github.com/gethinode/mod-bootstrap v1.1.1/go.mod h1:DcpPc2cNaXUPGEvhD7npuEEPA7573NvakTlrwFbyjr8=
 github.com/gethinode/mod-flexsearch v1.0.1 h1:FJkRsUzSnQTXl3MWCigT4E6vfff870UWTnkGqaDGIhA=
 github.com/gethinode/mod-flexsearch v1.0.1/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
 github.com/gethinode/mod-flexsearch v1.1.0 h1:7BCMyQDlYlskNXuazt8Jg/jg9WREexu2xVkYqThkAX4=
@@ -10,6 +12,12 @@ github.com/gethinode/mod-flexsearch v1.1.1 h1:zHypfKR/rWPAwqNXvo09Pp3vGqU4w3r7d2
 github.com/gethinode/mod-flexsearch v1.1.1/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
 github.com/gethinode/mod-flexsearch v1.1.2 h1:vA/jHxLq9xxkYGS9cmAoLNIkEBW+iLVCcQ8qKyEa+R4=
 github.com/gethinode/mod-flexsearch v1.1.2/go.mod h1:TXbGbWsvmhBdsTzRt887mcpFfr4ORpzG3+h/l4W3YM4=
+github.com/gethinode/mod-flexsearch v1.1.3 h1:lzmSvnJL6ABjp03avYzSvJJ7hw01CpHap1JGUbDIELg=
+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=
@@ -18,6 +26,14 @@ 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-fontawesome v1.2.5 h1:RqkLRj6+s+gM4nKd0IwNMMDA8cRmxfp0fxkVH4FdAGU=
+github.com/gethinode/mod-fontawesome v1.2.5/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=
@@ -30,3 +46,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=

i18n/de.yaml

@@ -1,52 +1,42 @@
-# Content
-- id: about
-  translation: "Über mich"
+# Single pages
 - id: postedOnDate
   translation: "Veröffentlicht am {{ . }}"
 - id: lastModified
   translation: "Zuletzt verändert am {{ . }}"
-- id: translationsLabel
-  translation: "Andere Sprachen: "
-- id: translationsSeparator
-  translation: ", "
-- id: more
-  translation: "Weitere {{ . }}"
-- id: readMore
-  translation: "Weiterlesen"
-- id: moreBlog
-  translation: "Weitere Beiträge"
-- id: olderBlog
-  translation: "Ältere Beiträge"
-- id: recentBlog
-  translation: "Aktuelle Beiträge"
-- id: newerBlog
-  translation: "Neuere Beiträge"
-- id: previousBlog
-  translation: "Vorheriger Beitrag"
-- id: nextBlog
-  translation: "Nächster Beitrag"
-- id: recentProjects
-  translation: "Projekte"
-- id: moreProjects
-  translation: "Weitere Projekte"
 - id: read
   translation: "Lesezeit"
 - id: minutesShort
   translation: "Min."
 - id: words
   translation: "Wörter"
-- id: copyright
-  translation: "Copyright"
-- id: rights
-  translation: "Alle Rechte vorbehalten"
-- id: photoBy
-  translation: "Foto von"
-- id: photoOn
-  translation: "auf"
+- id: photoFull
+  translation: "Foto von %s auf %s"
+- id: photoShort
+  translation: "Foto von {{ . }}"
+- id: draft
+  translation: "Entwurf"
+
+# List pages
 - id: article
   translation: "Artikel"
 - id: articles
   translation: "Artikel"
+- id: more
+  translation: "Weitere {{ . }}"
+
+# Sharing
+- id: shareLink
+  translation: "Diese Seite teilen"
+- id: copiedToClipboard
+  translation: "Der Text befindet sich in die Zwischenablage"
+- id: link
+  translation: "Link zur Webseite"
+- id: code
+  translation: "Code"
+
+# Pagination
+- id: paginationNav
+  translation: "Navigation auf der Seite"
 - id: paginationPrevious
   translation: "Vorherige"
 - id: paginationNext
@@ -55,78 +45,65 @@
   translation: "Erste"
 - id: paginationLast
   translation: "Letzte"
-- id: toggleSidebar
-  translation: "Menünavigation anzuzeigen oder auszublenden"
+
+# Navigation
 - id: colorMode
-  translation: "Modus"
+  translation: "Thema umschalten"
 - id: colorLight
-  translation: "Licht"
+  translation: "Light"
 - id: colorDark
-  translation: "Dunkel"
+  translation: "Dark"
 - id: colorAuto
-  translation: "Automatisch"
+  translation: "Auto"
 - id: toggleMainNav
   translation: "Hauptmenü anzuzeigen oder auszublenden"
+- id: home
+  translation: "Startseite"
+- id: languageSwitcherLabel
+  translation: "Sprache"
+
+# Table of contents
+- id: toc
+  translation: "Auf dieser Seite"
+- id: seeAlso
+  translation: "Siehe auch"
+
+# Sidebar
+- id: toggleSidebar
+  translation: "Menünavigation anzuzeigen oder auszublenden"
+
+# Feature
+- id: addedFeature
+  translation: "Eingefügt seit {{ . }}"
+- id: deprecatedFeature
+  translation: "Veraltet seit {{ . }}"
+
+# Versioning
+- id: latest
+  translation: "neueste"
+- id: allVersions
+  translation: "Alle Versionen"
+- id: newerVersionAlert
+  translation: "Es gibt eine neuere Version von {{ . }}!"
 
 # 404 page
 - id: pageNotFound
-  translation: "Diese Seite existiert nicht. Versuche es über die"
+  translation: "Diese Seite existiert nicht. Versuche es über die {{ . }}"
 - id: pageNotFoundTitle
   translation: "Nicht gefunden"
 - id: pageNotFoundHome
   translation: "Startseite"
 
+# Footer
+- id: copyright
+  translation: "Copyright"
+- id: rights
+  translation: "Alle Rechte vorbehalten"
+- id: poweredBy
+  translation: "Ermöglicht durch {{ . }}."
 
-# Navigation
-- id: toggleNavigation
-  translation: "Navigation umschalten"
-- id: languageSwitcherLabel
-  translation: "Sprache"
-- id: gcseLabelShort
-  translation: "Suche"
-- id: gcseLabelLong
-  translation: "Suche {{ .Site.Title }}"
-- id: gcseClose
-  translation: "Schließen"
-- id: home
-  translation: "Startseite"
-
-# Staticman
-- id: noComment
-  translation: "Kein Kommentar"
-- id: oneComment
-  translation: "Kommentar"
-- id: moreComment
-  translation: "Kommentare"
-- id: useMarkdown
-  translation: "Du kannst Markdown-Syntax benutzen"
-- id: yourName
-  translation: "Dein Name"
-- id: yourEmail
-  translation: "Deine E-Mail-Adresse"
-- id: yourWebsite
-  translation: "Deine Webseite"
-
-# Delayed Disqus
+# Comments
 - id: show
   translation: "Zeige"
 - id: comments
   translation: "Kommentare"
-
-# Related posts
-- id: seeAlso
-  translation: "Siehe auch"
-
-# Table of contents
-- id: toc
-  translation: "Auf dieser Seite"
-
-# Search
-- id: ui_search
-  translation: "Durchsuche diese Seite..."
-- id: ui_no_results
-  translation: "Keine Ergebnisse für"
-
-# Draft
-- id: draft
-  translation: "Entwurf"

i18n/en.yaml

@@ -1,60 +1,42 @@
-# Content
-- id: about
-  translation: "About"
+# Single pages
 - id: postedOnDate
   translation: "Posted on {{ . }}"
 - id: lastModified
   translation: "Last modified on {{ . }}"
-- id: translationsLabel
-  translation: "Other languages: "
-- id: translationsSeparator
-  translation: ", "
-- id: more
-  translation: "More {{ . }}"
-- id: readMore
-  translation: "Read More"
-- id: moreBlog
-  translation: "More Posts"
-- id: olderBlog
-  translation: "Older Posts"
-- id: recentBlog
-  translation: "Recent Posts"
-- id: newerBlog
-  translation: "Newer Posts"
-- id: previousBlog
-  translation: "Previous Post"
-- id: nextBlog
-  translation: "Next Post"
-- id: recentProjects
-  translation: "Projects"
-- id: moreFeatures
-  translation: "More Features"
-- id: moreGuides
-  translation: "More Guides"
-- id: moreOpensource
-  translation: "More Features"
-- id: moreProjects
-  translation: "More Projects"
-- id: moreUsers
-  translation: "More Users"
 - id: read
   translation: "read"
 - id: minutesShort
   translation: "min"
 - id: words
   translation: "words"
-- id: copyright
-  translation: "Copyright"
-- id: rights
-  translation: "All rights reserved"
-- id: photoBy
-  translation: "Photo by"
+- id: photoFull
+  translation: "Photo by %s on %s"
+- id: photoShort
+  translation: "Photo by {{ . }}"
 - id: photoOn
   translation: "on"
+- id: draft
+  translation: "Draft"
+
+# List pages
 - id: article
   translation: "Article"
 - id: articles
   translation: "Articles"
+- id: more
+  translation: "More {{ . }}"
+
+# Sharing
+- id: shareLink
+  translation: "Share via"
+- id: copiedToClipboard
+  translation: "copied to clipboard"
+- id: link
+  translation: "Link"
+- id: code
+  translation: "Code"
+
+# Pagination
 - id: paginationNav
   translation: "Page navigation"
 - id: paginationPrevious
@@ -65,8 +47,8 @@
   translation: "First page"
 - id: paginationLast
   translation: "Last page"
-- id: toggleSidebar
-  translation: "Toggle sidebar navigation"
+
+# Navigation
 - id: colorMode
   translation: "Toggle theme"
 - id: colorLight
@@ -77,20 +59,28 @@
   translation: "Auto"
 - id: toggleMainNav
   translation: "Toggle main navigation"
-- id: demo
-  translation: "Demo"
+- id: home
+  translation: "Home"
+- id: languageSwitcherLabel
+  translation: "Language"
+
+# Table of contents
+- id: toc
+  translation: "On this page"
+- id: seeAlso
+  translation: "See also"
+
+# Sidebar
+- id: toggleSidebar
+  translation: "Toggle sidebar navigation"
+
+# Feature
 - id: addedFeature
-  translation: "Added in"
+  translation: "Added in {{ . }}"
 - id: deprecatedFeature
-  translation: "Deprecated in"
-- id: shareLink
-  translation: "Share via"
-- id: copiedToClipboard
-  translation: "copied to clipboard"
-- id: link
-  translation: "Link"
-- id: code
-  translation: "Code"
+  translation: "Deprecated in {{ . }}"
+
+# Versioning
 - id: latest
   translation: "latest"
 - id: allVersions
@@ -100,62 +90,22 @@
 
 # 404 page
 - id: pageNotFound
-  translation: "The page you are looking for does not exist or another error occurred. Try going back to our"
+  translation: "The page you are looking for does not exist or another error occurred. Try going back to our {{ . }}."
 - id: pageNotFoundTitle
   translation: "Page not found"
 - id: pageNotFoundHome
   translation: "home page"
 
-# Navigation
-- id: toggleNavigation
-  translation: "Toggle navigation"
-- id: languageSwitcherLabel
-  translation: "Language"
-- id: gcseLabelShort
-  translation: "Search"
-- id: gcseLabelLong
-  translation: "Search {{ .Site.Title }}"
-- id: gcseClose
-  translation: "Close"
-- id: home
-  translation: "Home"
+# Footer
+- id: copyright
+  translation: "Copyright"
+- id: rights
+  translation: "All rights reserved"
+- id: poweredBy
+  translation: "Powered by {{ . }}."
 
-# Staticman
-- id: noComment
-  translation: "No comment"
-- id: oneComment
-  translation: "comment"
-- id: moreComment
-  translation: "comments"
-- id: useMarkdown
-  translation: "You can use Markdown syntax"
-- id: yourName
-  translation: "Your name"
-- id: yourEmail
-  translation: "Your email address"
-- id: yourWebsite
-  translation: "You website"
-
-# Delayed Disqus
+# Comments
 - id: show
   translation: "Show"
 - id: comments
   translation: "Comments" 
-
-# Related posts
-- id: seeAlso
-  translation: "See also"
-
-# Table of contents
-- id: toc
-  translation: "On this page"
-
-# Search
-- id: ui_search
-  translation: "Search this site..."
-- id: ui_no_results
-  translation: "No results for"
-
-# Draft
-- id: draft
-  translation: "Draft"

i18n/nl.yaml

@@ -1,64 +1,52 @@
-# Content
-- id: about
-  translation: "Over mij"
+# Single pages
 - id: postedOnDate
   translation: "Gepubliceerd op {{ . }}"
 - id: lastModified
   translation: "Laatst gewijzigd op {{ . }}"
-- id: translationsLabel
-  translation: "Overige talen: "
-- id: translationsSeparator
-  translation: ", "
-- id: more
-  translation: "Meer {{ . }}"
-- id: readMore
-  translation: "Lees meer"
-- id: moreBlog
-  translation: "Meer berichten"
-- id: olderBlog
-  translation: "Oudere berichten"
-- id: recentBlog
-  translation: "Recente berichten"
-- id: newerBlog
-  translation: "Nieuwere berichten"
-- id: previousBlog
-  translation: "Vorig bericht"
-- id: nextBlog
-  translation: "Volgend bericht"
-- id: recentProjects
-  translation: "Projecten"
-- id: moreProjects
-  translation: "Meer projecten"
 - id: read
   translation: "leestijd"
 - id: minutesShort
   translation: "min"
 - id: words
   translation: "woorden"
-- id: copyright
-  translation: "Copyright"
-- id: rights
-  translation: "Alle rechten voorbehouden"
-- id: photoBy
-  translation: "Foto van"
-- id: photoOn
-  translation: "via"
+- id: photoFull
+  translation: "Foto van %s via %s"
+- id: photoShort
+  translation: "Foto van {{ . }}"
+- id: draft
+  translation: "Concept"
+
+# List pages
 - id: article
   translation: "Artikel"
 - id: articles
   translation: "Artikelen"
+- id: more
+  translation: "Meer {{ . }}"
+
+# Sharing
+- id: shareLink
+  translation: "Delen via"
+- id: copiedToClipboard
+  translation: "gekopieerd naar clipboard"
+- id: link
+  translation: "Link"
+- id: code
+  translation: "Code"
+
+# Pagination
 - id: paginationNav
   translation: "Pagina navigatie"
 - id: paginationPrevious
-  translation: "Vorige"
+  translation: "Vorige pagina"
 - id: paginationNext
-  translation: "Volgende"
+  translation: "Volgende pagina"
 - id: paginationFirst
-  translation: "Eerste"
+  translation: "Eerste pagina"
 - id: paginationLast
-  translation: "Laatste"
-- id: toggleSidebar
-  translation: "Toon of verberg navigatie"
+  translation: "Laatste pagina"
+
+# Navigation
 - id: colorMode
   translation: "Pas modus aan"
 - id: colorLight
@@ -69,18 +57,28 @@
   translation: "Automatisch"
 - id: toggleMainNav
   translation: "Toon of verberg hoofdnavigatie"
+- id: home
+  translation: "Home"
+- id: languageSwitcherLabel
+  translation: "Taal"
+
+# Table of contents
+- id: toc
+  translation: "Inhoudsopgave"
+- id: seeAlso
+  translation: "Zie ook"
+
+# Sidebar
+- id: toggleSidebar
+  translation: "Toon of verberg navigatie"
+
+# Feature
 - id: addedFeature
-  translation: "Toegevoegd in"
+  translation: "Toegevoegd in {{ . }}"
 - id: deprecatedFeature
-  translation: "Verouderd in"
-- id: shareLink
-  translation: "Delen via"
-- id: copiedToClipboard
-  translation: "gekopieerd naar clipboard"
-- id: link
-  translation: "Link"
-- id: code
-  translation: "Code"
+  translation: "Afgeschaft in {{ . }}"
+
+# Versioning
 - id: latest
   translation: "meest recente"
 - id: allVersions  
@@ -90,63 +88,22 @@
 
 # 404 page
 - id: pageNotFound
-  translation: "Deze pagina bestaat niet of er is een andere fout opgetreden. Ga terug naar het"
+  translation: "Deze pagina bestaat niet of er is een andere fout opgetreden. Ga terug naar het {{ . }}."
 - id: pageNotFoundTitle
-  translation: "Niet gevonden"
+  translation: "Pagina niet gevonden"
 - id: pageNotFoundHome
   translation: "begin"
 
+# Footer
+- id: copyright
+  translation: "Copyright"
+- id: rights
+  translation: "Alle rechten voorbehouden"
+- id: poweredBy
+  translation: "Mede mogelijk gemaakt door {{ . }}."
 
-# Navigation
-- id: toggleNavigation
-  translation: "Toon/verberg navigatie"
-- id: languageSwitcherLabel
-  translation: "Taal"
-- id: gcseLabelShort
-  translation: "Zoeken"
-- id: gcseLabelLong
-  translation: "Zoeken op {{ .Site.Title }}"
-- id: gcseClose
-  translation: "Sluiten"
-- id: home
-  translation: "Home"
-
-# Staticman
-- id: noComment
-  translation: "Geen commentaar"
-- id: oneComment
-  translation: "commentaar"
-- id: moreComment
-  translation: "commentaar"
-- id: useMarkdown
-  translation: "Je kunt Markdown syntax gebruiken"
-- id: yourName
-  translation: "Jouw naam"
-- id: yourEmail
-  translation: "Jouw email adres"
-- id: yourWebsite
-  translation: "Jouw website"
-
-# Delayed Disqus
+# Comments
 - id: show
   translation: "Tonen"
 - id: comments
   translation: "Reacties" 
-
-# Related posts
-- id: seeAlso
-  translation: "Zie ook"
-
-# Table of contents
-- id: toc
-  translation: "Inhoudsopgave"
-
-# Search
-- id: ui_search
-  translation: "Zoeken op deze site..."
-- id: ui_no_results
-  translation: "Geen resultaten voor"
-
-# Draft
-- id: draft
-  translation: "Concept"

layouts/404.html

@@ -1,12 +1,13 @@
 {{ define "main"}}
-    <div class="container-xxl flex-fill d-flex align-content-center flex-wrap">
+    <div class="container-xxl flex-fill d-flex align-content-center flex-wrap feature">
         <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>
-            <p>{{ T "pageNotFound" }} <a href="{{ "/" | relLangURL }}">{{ T "pageNotFoundHome" }}</a>.</p>
+            {{- $home := printf "<a href=\"%s\">%s</a>" ("/" | relLangURL) (T "pageNotFoundHome") -}}
+            <p>{{ T "pageNotFound" $home | safeHTML }}</p>
         </div>
     </div>
 {{ end }}

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 }}

layouts/_default/baseof.html

@@ -12,6 +12,10 @@
     {{- end -}}
 {{- end -}}
 
+{{- if and .IsPage (not (in .Site.Params.modules.core "bootstrap")) -}}
+    {{- errorf "Bootstrap is a required module, please add it to 'modules.core' in your site parameters" -}}
+{{- end -}}
+
 <!doctype html>
 <html lang="{{ .Site.Language.Lang }}" class="no-js">
     <head>
@@ -19,9 +23,7 @@
     </head>
 
     <body>
-        {{- if site.Params.main.enableDarkMode -}}
-            {{- partial "footer/scripts.html" (dict "filename" "js/critical.bundle.js" "match" "js/critical/**.js" "header" true "page" .) -}}
-        {{- end -}}
+        {{- partial "footer/scripts.html" (dict "filename" "js/critical.bundle.js" "match" "js/critical/**.js" "header" true "page" .) -}}
         <div class="d-flex flex-column min-vh-100{{ if and .IsHome .Site.Params.home.style }} {{ .Site.Params.home.style }}{{ end }}">
             <div class="{{ if .Site.Params.navigation.fixed }}mb-4{{ end }}">
                 {{- partial "assets/navbar.html" (dict

layouts/_default/list.html

@@ -4,7 +4,7 @@
         "section" .Type
         "home" false
         "nested" .Params.Nested
-        "title" .Title
+        "title" (or .Title .Type)
         "description" .Description
         "content" .Content
         "paginate" true)

layouts/_default/single.html

@@ -47,10 +47,40 @@
     {{- end -}}
 
     {{ if not (in (slice "docs" "minimal") .Layout) }}
-        {{ if .Params.thumbnail -}}
-            {{- $credits := "" -}}
-            {{- if .Params.photoCredits }}{{ if .Params.PhotoSource }}{{ $credits = printf "%s %s %s %s" (T "photoBy") .Params.photoCredits (T "photoOn") .Params.PhotoSource }}{{ end }}{{ end -}}
-            {{- partial "assets/image.html" (dict "url" .Params.thumbnail "ratio" "21x9" "outerClass" "img-wrap" "innerClass" "rounded" "title" .Params.title "caption" $credits) -}}
+        {{- $thumbnail := "" -}}
+        {{- $credits := "" -}}
+        
+        {{- if reflect.IsMap .Params.Thumbnail -}}
+            {{- $thumbnail = .Params.Thumbnail.url -}}
+            {{- $author := "" -}}
+            {{- if and .Params.Thumbnail.authorURL "text" .Params.Thumbnail.author }}
+                {{- $author = partial "utilities/link" (dict "destination" .Params.Thumbnail.authorURL "text" .Params.Thumbnail.author) -}}
+            {{- else if .Params.Thumbnail.author }}
+                {{- $author = .Params.Thumbnail.author -}}
+            {{- end -}}
+
+            {{- $origin := "" -}}
+            {{- if and .Params.Thumbnail.originURL "text" .Params.Thumbnail.origin }}
+                {{- $origin = partial "utilities/link" (dict "destination" .Params.Thumbnail.originURL "text" .Params.Thumbnail.origin) -}}
+            {{- else if .Params.Thumbnail.origin }}
+                {{- $origin = .Params.Thumbnail.origin -}}
+            {{- end }}
+
+            {{- if and $author $origin }}
+                {{ $credits = printf (T "photoFull") $author $origin }}
+            {{ else if $author }}
+                {{ $credits = T "photoShort" $author }}
+            {{ end }}
+        {{ else }}
+            {{- $thumbnail = .Params.Thumbnail -}}
+            {{ if or .Params.photoCredits .Params.photoSource }}
+                {{ warnf "DEPRECATED: frontmatter variables `photoCredits` and `photoSource` have been deprecated in release v0.18: %s" .RelPermalink }}
+            {{ end }}
+            {{- if and .Params.photoCredits .Params.PhotoSource }}{{ $credits = printf (T "photoFull") .Params.photoCredits .Params.PhotoSource }}{{ end -}}
+        {{- end -}}
+
+        {{ if $thumbnail -}}
+            {{- partial "assets/image.html" (dict "url" $thumbnail "ratio" "21x9" "outerClass" "img-wrap" "innerClass" "rounded" "title" .Params.title "caption" $credits) -}}
         {{ end -}}
     {{ end }}
     {{ .Content }}
@@ -67,7 +97,8 @@
                 {{ with .NextInSection -}}
                     {{ $next := . -}}
                     {{ with .OutputFormats.Get "html" -}}
-                        <a class="next" href="{{ $next.Permalink }}"><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 +106,7 @@
                 {{ with .PrevInSection -}}
                     {{ $prev := . -}}
                     {{ with .OutputFormats.Get "html" -}}
-                        <a class="previous" href="{{ $prev.Permalink }}">{{ $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>

layouts/_default/single.xml

@@ -7,10 +7,10 @@
 					{{ $square150 := .Resize "150x150 CatmullRom" }} 
 					{{ $wide310 := .Fill "310x150 CatmullRom" }} 
 					{{ $square310 := .Resize "310x310 CatmullRom" }}
-					<square70x70logo src="{{ $square70.Permalink }}" />
-					<square150x150logo src="{{ $square150.Permalink }}" />
-					<wide310x150logo src="{{ $wide310.Permalink }}" />
-					<square310x310logo src="{{ $square310.Permalink }}" />
+					<square70x70logo src="{{ $square70.RelPermalink }}" />
+					<square150x150logo src="{{ $square150.RelPermalink }}" />
+					<wide310x150logo src="{{ $wide310.RelPermalink }}" />
+					<square310x310logo src="{{ $square310.RelPermalink }}" />
 				{{ end }}
 				<TileColor>#000000</TileColor>
 			</tile>

layouts/index.html

@@ -4,17 +4,26 @@
 
 {{- define "main" -}}
     {{- $page := . -}}
+    {{- $sections := site.Params.home.sections -}}
+    {{- if not $sections -}}
+        {{ range $section := site.Sections }}
+            {{ $sections = $sections | append $section.Type }}
+        {{ end }}
+    {{- end -}}
 
-    {{- range $index, $section := site.Params.home.sections -}}
+    {{- range $index, $section := $sections -}}
         {{- $sectionPage := site.GetPage "section" $section -}}
         {{- $sectionURL := $sectionPage.RelPermalink -}}
-        {{- $title := $sectionPage.Title -}}
-        {{- $thumbnail := $sectionPage.Params.Thumbnail -}}
+        {{- $title := or $sectionPage.Title $sectionPage.Type -}}
+        {{- $thumbnail := (or (and (reflect.IsMap $sectionPage.Params.Thumbnail) $sectionPage.Params.Thumbnail.url) $sectionPage.Params.Thumbnail) -}}
         {{- $icon := $sectionPage.Params.Icon -}}
-        {{- $description := $sectionPage.Description -}}
         {{- $content := $sectionPage.Content -}}
-
-        {{- $moreTitle := (T (printf "more%s" (strings.FirstUpper $section))) -}}
+        {{- $sectionTitle := strings.FirstUpper $sectionPage.Type -}}
+        {{- $moreTitle := "" -}}
+        {{- with (index site.Params.sections $section) -}}
+            {{- with index . "reference" }}{{ $moreTitle = . }}{{ end -}}
+        {{- end -}}
+        {{- $moreTitle = or $moreTitle (printf (T "more" (pluralize $sectionTitle))) -}}
 
         {{- partial "assets/section-list.html" (dict 
             "page" $page 

layouts/partials/assets/breadcrumb.html

@@ -3,7 +3,7 @@
         {{- range $index, $item := .Page.Ancestors.Reverse -}}
             {{- $title := .Title -}}
             {{- if .IsHome }}{{ $title = T "home" }}{{ end -}} 
-            {{- $address := or .Permalink (.Params.Redirect | absLangURL) -}}
+            {{- $address := or .RelPermalink (.Params.Redirect | relLangURL) -}}
             {{ if $address }}
                 <li class="breadcrumb-item"><a href="{{ $address }}">{{ $title }}</a></li>
             {{ else }}

layouts/partials/assets/button.html

@@ -22,6 +22,11 @@
                     "between", "around", or "evenly".
     "toast"         Optional id of the toast to display when the button is clicked.
     "clipboard"     Optional text to be copied to the clipboard when the button is clicked.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "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" -}}
@@ -95,6 +100,7 @@
 {{- end -}}
 
 {{- $class := .class }}
+{{ with $badge }}{{ $class = printf "%s me-3" $class }}{{ end }}
 
 {{- $order := "last" -}}
 {{- with .order }}{{ $order = . }}{{ end -}}
@@ -113,22 +119,45 @@
 {{- $toast := .toast -}}
 {{- $clipboard := .clipboard -}}
 
-<a aria-label="{{ $title }}" {{ if ne $state "disabled" }}{{ with $href }}href="{{ . }}"{{ end }}{{ end }}
-    {{ with $id }}id="{{ . }}"{{ end }}
-    {{ with $toast }}data-toast-target="{{ $toast }}"{{ end }}
-    {{ with $clipboard }}data-clipboard="{{ $clipboard }}"{{ end }}
-    {{ if eq $type "button" }}class="btn btn-{{ if $outline }}outline-{{ end }}{{ $color }} {{ if ne $size "md"}}btn-{{ $size }}{{ end }} position-relative {{ if in (slice "disabled" "active") $state }}{{ $state }}{{ end }} {{ $class }}"
-    role="button" {{ if eq $state "disabled" }}aria-disabled="true"{{ end }}
-    {{ else }} class="link-{{ $color }} position-relative {{ $class }}"{{ end }}
-    {{ with $tooltip }}data-bs-toggle="tooltip" data-bs-title="{{ . }}" data-bs-placement="{{ $placement }}"{{ end }}
-    {{ 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 }}
-    >
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
+{{- $isExternal := ne (urls.Parse (absURL $href)).Host (urls.Parse site.BaseURL).Host -}}
+{{- $target := "" -}}
+{{- $rel := "" -}}
 
+{{- if $isExternal -}}
+    {{- if $tab -}}
+        {{- $target = "_blank" -}}
+        {{- $rel = "noopener noreferrer" -}}
+    {{- end -}}
+
+    {{- if and $title $cue -}}
+        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+        {{- $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 -}}
+    {{- with $toast }}data-toast-target="{{ $toast }}"{{ end -}}
+    {{- with $clipboard }}data-clipboard="{{ $clipboard }}"{{ end -}}
+    {{- if eq $type "button" }}class="btn btn-{{ if $outline }}outline-{{ end }}{{ $color }} {{ if ne $size "md"}}btn-{{ $size }}{{ end }} position-relative {{ if in (slice "disabled" "active") $state }}{{ $state }}{{ end }} {{ $class -}}"
+    role="button" {{ if eq $state "disabled" }}aria-disabled="true"{{ end -}}
+    {{- else }} class="link-{{ $color }} position-relative {{ $class }}"{{ end -}}
+    {{- with $tooltip }}data-bs-toggle="tooltip" data-bs-title="{{ . }}" data-bs-placement="{{ $placement }}"{{ end -}}
+    {{- 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 }}">
-        <div>{{ $title }}</div>
-        {{- with $icon }}<div class="align-self-center{{ if eq $order "first" }} order-first pe-1{{ else }} ps-1{{ end }}">{{ partial "assets/icon.html" (dict "icon" $icon) }}</div>{{ end }}
+        <div class="my-auto">{{ $title }}</div>
+        {{- with $icon }}<div class="align-self-center{{ if $title }}{{ if eq $order "first" }} order-first pe-1{{ else }} ps-1{{ end }}{{ end }}">{{ partial "assets/icon.html" (dict "icon" $icon) }}</div>{{ end }}
     </div>
 
     {{- with $badge }}

layouts/partials/assets/card-group.html

@@ -107,14 +107,15 @@
                 "orientation" $orientation
             ) -}}
 
-            {{- if $element.Permalink -}}
+            {{- if $element.RelPermalink -}}
                 {{- $params = merge $params (dict "path" $element.File.Path) -}}
             {{- else -}}
+                {{- $thumbnail := (or (and (reflect.IsMap $element.Params.Thumbnail) $element.Params.Thumbnail.url) $element.Params.Thumbnail) -}}
                 {{- $params = merge $params (dict
                     "title" $element.Title
-                    "href" $element.Permalink
-                    "description" (or $element.Description $element.Content)
-                    "thumbnail" $element.Params.thumbnail
+                    "href" $element.RelPermalink
+                    "description" (partial "utilities/GetDescription.html" $element)
+                    "thumbnail" $thumbnail
                     "icon" $element.Params.icon
                 ) -}}
             {{- end -}}

layouts/partials/assets/card.html

@@ -111,9 +111,9 @@
 
 {{- with $page -}}
     {{- if not $title }}{{ $title = .Title }}{{ end -}}
-    {{- if not $href }}{{ $href = .Permalink  }}{{ end -}}
-    {{- if not $description }}{{ $description = .Description }}{{ end -}}
-    {{- if not $thumbnail }}{{ $thumbnail = .Params.thumbnail }}{{ end -}}
+    {{- if not $href }}{{ $href = .RelPermalink  }}{{ end -}}
+    {{- if not $description }}{{ $description = partial "utilities/GetDescription.html" . }}{{ end -}}
+    {{- if not $thumbnail }}{{ $thumbnail = (or (and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.url) .Params.Thumbnail) }}{{ end -}}
     {{- if not $icon }}{{ $icon = .Params.icon }}{{ end -}}
 {{- end -}}
 

layouts/partials/assets/image.html

@@ -15,6 +15,7 @@
 -->
 
 {{- $validRatios := slice "1x1" "4x3" "16x9" "21x9" -}}
+{{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
 {{- $ratio := .ratio -}}
 {{- $url := .url -}}
 {{- $mode := false -}}
@@ -68,6 +69,7 @@
 
 <!-- Generate a image set of type webp -->
 {{- define "partials/image-scaled.html " -}}
+    {{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
     {{- $img := .img -}}
     {{- $ratio := .ratio -}}
     {{- $imgset := "" -}}
@@ -98,7 +100,11 @@
                 {{- $scaled = $img.Fit (printf "%s webp" $dim) -}}
             {{- end -}}
             {{- $scaled = $scaled | resources.Copy (replace $img.RelPermalink $clean (printf "-%s.webp" $dim)) -}}
-            {{- $imgset = printf "%s, %s %sw" $imgset $scaled.Permalink (index $widths $index) -}}
+            {{- 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) -}}
+            {{- end -}}
         {{- end -}}
         {{- $imgset = strings.TrimPrefix ", " $imgset -}}
     {{- end -}}
@@ -108,6 +114,7 @@
 
 <!-- Define the img with optional caption -->
 {{- define "partials/image-definition.html" -}}
+    {{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
     {{- $ratio := .ratio -}}
     {{- $url := .url -}}
     {{- $outerClass := .outerClass -}}
@@ -125,7 +132,11 @@
         {{- $img := partial "utilities/GetImage.html" (dict "url" $url) -}}
         {{- if $img -}}
             {{- $fallback := partial "partials/image-default.html" (dict "img" $img "ratio" $ratio) -}}
-            {{- $fallbackURL = $fallback.RelPermalink -}}
+                {{- if $absoluteURL -}}
+                    {{- $fallbackURL = $fallback.Permalink -}}
+                {{- else -}}
+                    {{- $fallbackURL = $fallback.RelPermalink -}}
+                {{- end -}}
             {{- $imgset = partial "partials/image-scaled.html " (dict "img" $img "ratio" $ratio) -}}
         {{- end -}}
     {{- end -}}
@@ -145,7 +156,7 @@
                 srcset="{{ . }}"
                 sizes="100vw"
                 {{- end }}
-                src="{{ absURL $fallbackURL }}"
+                src="{{ $fallbackURL }}"
                 alt="{{ $title }}">
         </div>
     {{- if $caption -}}

layouts/partials/assets/list.html

@@ -52,6 +52,7 @@
 <div class="d-none d-md-block p-0">
     {{- range $index, $item := $list -}}
         {{- $odd := eq (mod $index 2) 1 -}}
+        {{- $thumbnail := (or (and (reflect.IsMap $item.Params.Thumbnail) $item.Params.Thumbnail.url) $item.Params.Thumbnail) -}}
         <div class="container ratio-section d-flex flex-column">
             <div class="row pt-5 pb-5 align-items-center flex-fill row-cols-2">
                 <div class="col-6{{ if $odd }} order-last{{ end }}">
@@ -60,7 +61,7 @@
                         {{- $style = "reveal fade-bottom-n5 rotate-n5 ps-3" -}}
                         {{- if $odd }}{{ $style = "reveal fade-bottom-5 rotate-5 pe-3" }}{{ end }}
                     {{ end }}
-                    {{ partial "partials/list-img.html" (dict "thumbnail" $item.Params.Thumbnail "style" $style "mode" $item.Params.colormode) }}
+                    {{ partial "partials/list-img.html" (dict "thumbnail" $thumbnail "style" $style "mode" $item.Params.colormode) }}
                 </div>
                 <div class="col-6{{ if $odd }} order-first{{ end }} psw-lg-5 p-5">
                     {{ partial "partials/list-content.html" (dict "title" $item.Title "content" (or $item.Description $item.Content)) }}
@@ -73,13 +74,14 @@
 <div class="d-md-none">
     {{- range $index, $item := $list -}}
         {{- $odd := eq (mod $index 2) 1 -}}
+        {{- $thumbnail := (or (and (reflect.IsMap $item.Params.Thumbnail) $item.Params.Thumbnail.url) $item.Params.Thumbnail) -}}
         <div class="container d-flex flex-column">
             <div class="row pt-5 pb-5 align-items-center flex-fill row-cols-2">
                 <div class="col-12 text-center">
-                    {{ partial "partials/list-img.html" (dict "thumbnail" $item.Params.Thumbnail "mode" $item.Params.colormode) }}
+                    {{ partial "partials/list-img.html" (dict "thumbnail" $thumbnail "mode" $item.Params.colormode) }}
                 </div>
                 <div class="col-12 p-3">
-                    {{ partial "partials/list-content.html" (dict "title" $item.Title "content" (or $item.Description $item.Content)) }}
+                    {{ partial "partials/list-content.html" (dict "title" $item.Title "content" (partial "utilities/GetDescription.html" $item)) }}
                 </div>
             </div>
         </div>

layouts/partials/assets/nav.html

@@ -93,14 +93,15 @@
             {{ $header := $item.Title }}
             {{ $body := $item.Content }}
             {{ $show := eq $index 0}}
+            {{- $thumbnail := (or (and (reflect.IsMap $item.Params.Thumbnail) $item.Params.Thumbnail.url) $item.Params.Thumbnail) -}}
             <div class="tab-pane{{ if $show }} active{{ end }}" id="nav-{{ $id }}-{{ $index }}" role="tabpanel" aria-labelledby="{{ $id }}-btn-{{ $index }}" tabindex="0">
                 {{- if eq $pane "persona" -}}
                 {{- partial "assets/persona.html" (dict  
                     "title" $item.Title
                     "class" $class
                     "color" $color
-                    "content" (or $item.Description $item.Content)
-                    "thumbnail" $item.Params.Thumbnail
+                    "content" (partial "utilities/GetDescription.html" $item)
+                    "thumbnail" $thumbnail
                 ) -}}
                 {{- else -}}
                     {{- (or $item.Description $item.Content) -}}

layouts/partials/assets/navbar-item.html

@@ -9,12 +9,24 @@
 {{- $isActive := hasPrefix $pageURL $menuURL -}}
 {{- $isAlias := $menu.Params.alias -}}
 {{- $isIcon := $menu.Params.icon -}}
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
 
 {{- $url := urls.Parse $menuURL -}}
 {{- $baseURL := urls.Parse $.Site.Params.Baseurl -}}
 {{- $isExternal := ne $url.Host $baseURL.Host -}}
 {{- $externalHref := "" }}
-{{- if $isExternal }}{{ $externalHref = "target=\"_blank\" rel=\"noopener noreferrer\"" }}{{ end -}}
+{{- $suffix := "" }}
+
+{{- if $isExternal }}
+    {{- if $tab -}}
+        {{ $externalHref = "target=\"_blank\" rel=\"noopener noreferrer\"" }}
+    {{- end -}}
+
+    {{- if $cue -}}
+        {{ $suffix = partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+    {{- end -}}
+{{ end -}}
 
 {{- $mainNav := urlize (lower $menu.Name) -}}
 {{- $childNav := "" -}}
@@ -40,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 and $isExternal (not $isIcon)}} {{ partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}{{ end -}}
+    {{- if not $isIcon }}&nbsp;{{ $suffix }}{{ end -}}
 </a>

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 -->
@@ -21,26 +22,26 @@
     {{- $collapsed := .collapsed -}}
 
     <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">
-            {{- partial "assets/icon.html" (dict "icon" "fas sun theme-icon-active") }} {{ if $collapsed }} {{ T "colorMode" }} {{ 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 }}">
+            <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">
+        <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>
@@ -93,6 +94,7 @@
     </li>
 {{- end -}}
 
+{{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
 {{- $supportedFlags := slice "true" "false" -}}
 
 {{- $id := printf "navbar-collapse-%d" 0 -}}
@@ -105,11 +107,14 @@
     {{- errorf "partial [assets/navbar.html] - Missing value for param 'page'" -}}
 {{- end -}}
 
-{{- $menuName := "main" }}
-{{- with .menus }}{{ $menuName = .}}{{ end -}}
+{{- $defaultMenu := "main" }}
+{{- $menuName := $defaultMenu }}
+{{- with .menus }}{{ $menuName = . }}{{ end -}}
 {{- $menus := index site.Menus $menuName -}}
 {{- if or (ne (printf "%T" $menus) "navigation.Menu") (ne (index $menus 0).Menu $menuName) -}}
-    {{- errorf "partial [assets/navbar.html] - Invalid value for param 'menus': %s" $menuName -}}
+    {{- if ne $menuName $defaultMenu }}
+        {{- errorf "partial [assets/navbar.html] - Invalid value for param 'menus': %s" $menuName -}}
+    {{- end -}}
 {{- end -}}
 
 {{- $size := "md" -}}
@@ -147,7 +152,7 @@
     {{- end -}}
 {{- end -}}
 
-{{- $enableDarkMode := default true site.Params.main.enableDarkMode -}}
+{{- $enableDarkMode := default false site.Params.main.enableDarkMode -}}
 {{- with .mode -}}
     {{- $darkModeParam := . -}}
     {{- if in $supportedFlags $darkModeParam -}}
@@ -181,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">
@@ -189,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>
@@ -202,7 +209,7 @@
             <!-- Insert the brand logo or name -->
             <a class="navbar-brand mx-auto" href="{{ site.Home.RelPermalink }}">
                 {{- if $logo -}}
-                    <img src="{{ $logo }}" alt="{{ $title }} logo" height="30">
+                    <img src="{{if $absoluteURL }}{{ absURL $logo }}{{ else }}{{ $logo }}{{ end }}" alt="{{ $title }} logo" height="30">
                 {{- else -}}
                     <span class="fw-bold">{{ $title }}</span>
                 {{- end -}}
@@ -238,7 +245,7 @@
                     {{- end -}}
     
                     <!-- Insert divider if applicable -->
-                    {{- if or $enableLanguage $enableVersions -}}
+                    {{- if and $menus (or $enableLanguage $enableVersions) -}}
                         <li class="nav-item py-2 py-md-1 col-12 col-md-auto d-none d-{{ $size }}-block">
                             <div class="vr d-none d-md-flex h-100 mx-md-2"></div>
                         </li>
@@ -250,15 +257,15 @@
                         {{- $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 -}}
                                     {{- range $page.AllTranslations -}}
-                                        <li><a class="dropdown-item {{ if eq .Language.Lang $currentLang }}active{{ end }}" href="{{ .Permalink }}">{{ .Language.LanguageName  }}</a></li>
+                                        <li><a class="dropdown-item {{ if eq .Language.Lang $currentLang }}active{{ end }}" href="{{ .RelPermalink }}">{{ .Language.LanguageName  }}</a></li>
                                     {{- end -}}
                                 {{- else -}}
                                     {{- range site.Languages -}}

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 }}

layouts/partials/assets/persona.html

@@ -49,9 +49,9 @@
 
 {{- with $page -}}
     {{- if not $title }}{{ $title = .Title }}{{ end -}}
-    {{- if not $href }}{{ $href = .Permalink  }}{{ end -}}
+    {{- if not $href }}{{ $href = .RelPermalink  }}{{ end -}}
     {{- if not $content }}{{ $content = .Content }}{{ end -}}
-    {{- if not $thumbnail }}{{ $thumbnail = .Params.thumbnail }}{{ end -}}
+    {{- if not $thumbnail }}{{ $thumbnail = (or (and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.url) .Params.Thumbnail) }}{{ end -}}
 {{- end -}}
 
 {{- $class := .class -}}

layouts/partials/assets/section-list.html

@@ -24,7 +24,7 @@
 {{- $padding := "0" -}}
 {{- $header := "full" -}}
 {{- $footer := "none" -}}
-{{- $style := "" -}}
+{{- $style := "border-0 card-zoom" -}}
 {{- $homepage := 3 -}}
 {{- $background := "" -}}
 {{- $layout := "card" -}}
@@ -87,7 +87,6 @@
         {{- $paginate = false -}}
         {{- $max = int (math.Min $homepage $max) -}}
     {{ end -}}
-    {{- $cols = int (math.Min $cols $max) -}}
 
     {{- $params := (dict 
         "page" $page

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 -}}

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>

layouts/partials/footer/footer.html

@@ -4,6 +4,10 @@
             {{- $copyright := printf "%s © %s %s %s." (T "copyright") (dateFormat "2006" now) .Site.Title (T "rights") }}
             {{ cond (gt (len .Site.Copyright) 0) .Site.Copyright $copyright }}
             {{ .Site.Params.footer.license | safeHTML }}
+            {{ if .Site.Params.main.endorse }}
+                {{ $link := partial "utilities/link" (dict "destination" (index site.Params.links "hinode") "text" "Hinode" "class" "link-secondary") }}
+                {{ T "poweredBy" $link | safeHTML }}
+            {{ end }}
         </small>
     </div>
 </footer>

layouts/partials/footer/scripts.html

@@ -1,3 +1,4 @@
+{{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
 {{- $filename := .filename | default "js/main.bundle.js" -}}
 {{- $match := .match | default "{js/*.js,js/vendor/**.js}" -}}
 {{- $page := .page -}}
@@ -23,9 +24,11 @@
     {{- end }}
 {{- end -}}
 
-{{- if not hugo.IsProduction -}}
-    <script src="{{ $js.Permalink }}"></script>
-{{ else -}}
-    {{ $js = $js | minify | fingerprint -}}
-    <script src="{{ $js.Permalink }}" integrity="{{ $js.Data.Integrity }}" crossorigin="anonymous"></script>
+{{- if gt (len $js.Content) 0 -}}
+    {{- if not hugo.IsProduction -}}
+        <script src="{{ if $absoluteURL }}{{ $js.Permalink }}{{ else }}{{ $js.RelPermalink }}{{ end }}"></script>
+    {{ else -}}
+        {{ $js = $js | minify | fingerprint -}}
+        <script src="{{ if $absoluteURL }}{{ $js.Permalink }}{{ else }}{{ $js.RelPermalink }}{{ end }}" integrity="{{ $js.Data.Integrity }}" crossorigin="anonymous"></script>
+    {{ end -}}
 {{ end -}}

layouts/partials/footer/social.html

@@ -1,14 +1,28 @@
+{{ if .Site.Params.footer.socialTitle }}
+    {{ warnf "DEPRECATED: parameter `Params.home.socialTitle` has been deprecated in release v0.18"}}
+{{ end }}
+{{ if .Site.Params.footer.socialCaption }}
+    {{ warnf "DEPRECATED: parameter `Params.home.socialCaption` has been deprecated in release v0.18"}}
+{{ end }}
+
+{{- $tab := site.Params.main.externalLinks.tab -}}
 <div class="container-fluid">
     <div class="row row-cols-1 row-cols-sm-4 bg-primary p-3 bg-opacity-{{ .Site.Params.style.themeOpacity | default "25" | safeHTML }} align-items-center">
         <div class="col col-md-2 d-none d-md-block"></div>
         <div class="col col-sm-6 col-md-4">
-            <div class="fs-3 fw-bold">{{ .Site.Params.footer.socialTitle }}</div>
-            <p>{{ .Site.Params.footer.socialCaption }}</p>
+            {{ if gt .Site.Menus.social 0 }}
+                <div class="fs-3 fw-bold">{{ or .Site.Params.footer.socialTitle .Site.Params.social.title }}</div>
+                <p>{{ or .Site.Params.footer.socialCaption .Site.Params.social.caption }}</p>
+            {{ end }}
         </div>
         <div class="col text-sm-start text-center col-sm-6 col-md-4">
             {{ range .Site.Menus.social -}}
-                <a href="{{ .URL }}" target="_blank" rel="noopener noreferrer" aria-label="{{ .Name | safeHTML }}" class="text-decoration-none link-secondary d-inline p-2">
-                    {{ .Pre | safeHTML }}
+                <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">
+                    {{ if hasPrefix .Pre "<i" }}
+                        {{ .Pre | safeHTML }}
+                    {{ else }}
+                        {{ partial "assets/icon.html" (dict "icon" (printf "%s fa-2x" .Pre) )}}
+                    {{ end }}
                 </a>
             {{ end -}}
         </div>

layouts/partials/head/favicon.html

@@ -1,10 +1,11 @@
 <!-- Source: https://davelage.com/posts/hugo-favicons/ -->
+{{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
 {{ if .Site.Params.favicon.logo -}}
     {{ $favicon := resources.Get .Site.Params.favicon.logo -}}
     {{ range $i := .Site.Params.favicon.sizes -}} 
         {{ $image := $favicon.Resize (printf "%dx%d CatmullRom" $i $i) -}}
-        <link rel="icon" type="image/png" sizes="{{$i}}x{{$i}}" href="{{ $image.Permalink }}">
+        <link rel="icon" type="image/png" sizes="{{$i}}x{{$i}}" href="{{ if $absoluteURL }}{{ $image.Permalink }}{{ else }}{{ $image.RelPermalink }}{{ end }}">
     {{ end -}} 
     {{ $image := $favicon.Resize "180x CatmullRom" -}}
-    <link rel="apple-touch-icon" sizes="180x180" href="{{ $image.Permalink }}">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ if $absoluteURL }}{{ $image.Permalink }}{{ else }}{{ $image.RelPermalink }}{{ end }}">
 {{ end -}}

layouts/partials/head/seo.html

@@ -7,22 +7,17 @@
     {{ $.Scratch.Set "title" .Site.Title -}}
 {{ end -}}
 
-{{ with .Description -}}
-    {{ $.Scratch.Set "description" . -}}
-{{ else -}}
-    {{ with .Summary | plainify -}}
-        {{ $.Scratch.Set "description" . -}}
-    {{ else -}}
-        {{ $.Scratch.Set "description" .Site.Params.main.description -}}
-    {{ end -}}
-{{ end -}}
+{{ $description := or (partial "utilities/GetDescription.html" .) .Site.Params.main.description }}
+{{ $.Scratch.Set "description" $description -}}
 
-{{ with .Params.thumbnail -}}
-    {{ $source := partial "utilities/GetImage.html" (dict "url" .) -}}
-    {{ with $source -}}
+{{- $thumbnail := (or (and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.url) .Params.Thumbnail) -}}
+{{ with $thumbnail -}}
+    {{ $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 -}}    
@@ -57,7 +52,7 @@
 {{ end -}}
 
     {{ if .IsHome -}}
-        <title>{{ .Site.Title }} {{ .Site.Params.main.separator }} {{ .Site.Params.head.tagline }}</title>
+        <title>{{ .Site.Title }} {{ if .Site.Params.head.tagline }} {{ .Site.Params.main.separator }} {{ .Site.Params.head.tagline }}{{ end }}</title>
     {{ else -}}
         <title>{{ .Site.Title }} {{ .Site.Params.main.separator }} {{ .Title }}</title>
     {{ end -}}

layouts/partials/head/stylesheet.html

@@ -1,3 +1,4 @@
+{{- $absoluteURL := site.Params.main.canonifyAssetsURLs | default false -}}
 {{- $source := .source | default "scss/app.scss" -}}
 {{- $target := .target | default "css/main.css" -}}
 {{- $page := .page -}}
@@ -6,7 +7,7 @@
 {{- $modules := "" -}}
 {{ if $core }}
     {{- if reflect.IsSlice site.Params.modules.excludeSCSS -}}
-        {{- $modules = complement site.Params.modules.excludeSCSS site.Params.modules.core -}}
+        {{- $modules = complement site.Params.modules.excludeSCSS (or site.Params.modules.core slice) -}}
     {{ else }}
         {{- $modules = site.Params.modules.core -}}
     {{ end }}
@@ -43,8 +44,8 @@
 {{- end -}}
 
 {{- if not hugo.IsProduction -}}
-    <link rel="stylesheet" href="{{ $css.Permalink }}">
+    <link rel="stylesheet" href="{{ if $absoluteURL }}{{ $css.Permalink }}{{ else }}{{ $css.RelPermalink }}{{ end }}">
 {{- else -}}
     {{- $css = $css | fingerprint | resources.PostProcess -}}
-    <link rel="stylesheet" href="{{ $css.Permalink }}" integrity="{{ $css.Data.Integrity }}" crossorigin="anonymous">
+    <link rel="stylesheet" href="{{ if $absoluteURL }}{{ $css.Permalink }}{{ else }}{{ $css.RelPermalink }}{{ end }}" integrity="{{ $css.Data.Integrity }}" crossorigin="anonymous">
 {{- end -}}

layouts/partials/home/featured.html

@@ -1,20 +1,21 @@
-<div class="container-fluid flex-fill bg-primary bg-opacity-{{ .Site.Params.style.themeOpacity | default "25" | safeHTML }}">
-    <div class="container-xxl p-4">
-        <div class="row row-cols-1 row-cols-sm-3 align-items-center pt-5 pb-5 h-100">
-            <div class="col col-md-2 d-none d-md-block"></div>
-            <div class="col col-sm-6 col-md-4 text-center text-sm-start">
-                <p class="display-4">{{ .Title }}</p>
-                <p>{{ .Content }}</p>
-                {{ if .Site.Params.feature.link }}
-                    <p><a class="btn btn-primary" href="{{ .Site.Params.feature.link | safeURL }}" role="button">{{ .Site.Params.feature.caption | default (T "about") }}</a></p>
-                {{ end }}
-            </div>
-            <div class="col col-sm-6 col-md-4">
-                {{ if .Site.Params.home.featurePhoto }}
-                    {{- partial "assets/image.html" (dict "url" .Site.Params.home.featurePhoto "ratio" "4x3" "outerClass" "img-wrap" "innerClass" "rounded" "title" .Site.Title) -}}
-                {{ end }}
-            </div>
-            <div class="col col-md-2 d-none d-md-block"></div>
+<div class="container-fluid flex-fill feature">
+    <div class="row row-cols-1 row-cols-sm-4 h-100 bg-primary px-4 py-5 bg-opacity-{{ .Site.Params.style.themeOpacity | default "25" | safeHTML }} align-items-center">
+        <div class="col col-lg-2 d-none d-lg-block bg-info order-1"></div>
+        <div class="col col-sm-6 col-lg-4 text-center text-sm-start order-3 order-sm-2">
+            <p class="display-4">{{ .Title }}</p>
+            <p>{{ .Content }}<p>
         </div>
+        <div class="col text-sm-start text-center col-sm-6 col-lg-4 order-2 order-sm-3">
+            {{- $thumbnail := (or (and (reflect.IsMap .Params.Thumbnail) .Params.Thumbnail.url) .Params.Thumbnail) -}}
+            {{- $thumbnail = or $thumbnail .Site.Params.home.featurePhoto -}}
+            {{ if .Site.Params.home.featurePhoto }}
+                {{ warnf "DEPRECATED: parameter `Params.home.featurePhoto` has been deprecated in release v0.18"}}
+            {{ end }}
+            {{- if $thumbnail -}}
+                {{- partial "assets/image.html" (dict "url" $thumbnail "ratio" "16x9" "outerClass" "img-wrap" "innerClass" "rounded" "title" .Site.Title) -}}
+            {{ end }}
+            <div class="pb-5 d-block d-sm-none"></div>
+        </div>
+        <div class="col col-lg-2 d-none d-lg-block bg-info order-4"></div>
     </div>
 </div>

layouts/partials/utilities/GetDescription.html

@@ -0,0 +1,18 @@
+{{- $page := . -}}
+{{- if ne (printf "%T" $page) "*hugolib.pageState" -}}
+    {{- errorf "partial [utilities/GetDescription.html] - Expected page context" -}}
+{{- end -}}
+
+{{- $description := "" -}}
+{{- if not $page.RelPermalink -}}
+    {{- $description = $page.Content -}}
+{{ else }}
+    {{- $description = $page.Description -}}
+{{- end -}}
+
+{{- if not $description -}}
+    {{- $description = $page.Summary -}}
+    {{- if $page.Truncated }}{{ $description = print $description "..." }}{{ end -}}}
+{{- end -}}
+
+{{- return $description -}}

layouts/partials/utilities/link.html

@@ -0,0 +1,45 @@
+{{ $destination := .destination }}
+{{- if not $destination -}}
+    {{- errorf "partial [utilities/link.html] - Missing param 'destination'" -}}
+{{- end -}}
+
+{{- $target := "" -}}
+{{- $rel := "" -}}
+{{- $case := .case | default true }}
+{{- $cue := .cue | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .tab | default site.Params.main.externalLinks.tab -}}
+{{- $isExternal := ne (urls.Parse (absURL $destination)).Host (urls.Parse site.BaseURL).Host -}}
+
+{{ $text := .text }}
+{{- if not $text -}}
+    {{ if $isExternal }}
+        {{ $text = (urls.Parse (absURL $destination)).Host }}
+    {{ else }}
+        {{ $target := site.GetPage $destination }}
+        {{ if not $target }}
+            {{- errorf "partial [utilities/link.html] - Cannot find page: %s" $destination -}}
+        {{ else }}
+            {{ $text = $target.Title }}
+            {{ if not $case }}{{ $text = lower $text }}{{ end }}
+            {{ $destination = $target.RelPermalink }}
+        {{ end }}
+    {{ end }}
+{{- end -}}
+
+{{- if $isExternal -}}
+    {{- if $tab -}}
+        {{- $target = "_blank" -}}
+        {{- $rel = "noopener noreferrer" -}}
+    {{- end -}}
+
+    {{- if $cue -}}
+        {{ $suffix := partial "assets/icon.html" (dict "icon" "fas up-right-from-square fa-2xs") }}
+        {{- $text = printf "%s %s" $text $suffix | safeHTML -}}
+    {{- end -}}
+{{ else }}
+    {{ $destination = relLangURL $destination }}
+{{- end -}}
+
+{{- $class := .class -}}
+
+<a {{ with $class }}class="{{ . }}" {{ end }}href="{{ $destination | safeURL }}"{{ with $target }} target="{{ . }}"{{ end }}{{ with $rel }} rel="{{ . }}"{{ end }}>{{ $text }}</a>

layouts/shortcodes/alert.html

@@ -4,10 +4,28 @@
                     "warning", "info", "light", "dark", "white" or "black".
     "dismissible"   Optional flag to indicate the alert is dismissible, defaults to false.
     "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 -}}
 {{ $color := "primary" -}}
+{{ $icon := "" }}
+{{ $type := "" -}}
+
+{{ with .Get "type" }}{{ $type = . }}{{ end -}}
+{{ $supportedTypes := slice "danger" "info" -}}
+{{ if $type }}
+    {{ if not (in $supportedTypes $type) -}}
+        {{ errorf "Invalid value for param 'type': %s" .Position -}}
+        {{ $error = true -}}
+    {{ else }}
+        {{ $color = $type }}
+        {{ if eq $type "danger" }}{{ $icon = "fas triangle-exclamation" }}{{ else }}{{ $icon = "fa lightbulb" }}{{ end }}
+    {{ end -}}
+{{ end -}}
+
 {{ with .Get "color" }}{{ $color = . }}{{ end -}}
 {{ $supportedColors := slice "primary" "secondary" "success" "danger" "warning" "info" "light" "dark" -}}
 {{ if not (in $supportedColors $color) -}}
@@ -15,9 +33,9 @@
     {{ $error = true -}}
 {{ end -}}
 
-{{ $icon := "" }}
-{{ with .Get "icon" }}
-    {{ $icon = partial "assets/icon.html" (dict "icon" (printf "%s fa-2x fa-pull-left" .)) }}
+{{ with .Get "icon" }}{{ $icon = . }}{{ end }}
+{{ with $icon }}
+    {{ $icon = partial "assets/icon.html" (dict "icon" (printf "%s fa-2x fa-fw" .)) }}
 {{ end }}
 
 {{ $dismissibleParam := "false" -}}
@@ -31,10 +49,14 @@
     {{ $error = true -}}
 {{ end -}}
 
+{{- $class := .Get "class" -}}
+
 {{- if not $error -}}
-    <div class="alert alert-{{ $color }} {{ if $dismissible }}alert-dismissible fade show{{ end }}" role="alert">
-        {{ with $icon }}{{ . }}{{ end }}
-        {{ trim .Inner " \r\n" | markdownify | safeHTML -}}
-        {{ if $dismissible }}<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>{{ end }}
+    <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 -}}
+            {{ if $dismissible }}<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>{{ end }}
+        </div>
     </div>
 {{- end -}}

layouts/shortcodes/button.html

@@ -12,17 +12,29 @@
     "aria-label"    Optional label for the badge.
     "tooltip"       Optional text to display in a tooltip. Cannot be used together with collapse. Ignored for active/
                     inactive buttons.
-    "collapse"      Optional panel to collapse. Cannot be used together with tooltip. Ignored for active/inactive buttons.
+    "collapse"      Optional panel to collapse. Cannot be used together with tooltip. Ignored for active/inactive
+                    buttons.
     "placement"     Optional position of the tooltip: "top" (default), "bottom", "left", or "right". 
+    "class"         Optional class attribute of the button element, e.g. “p-5”.
+    "icon"          Font Awesome icon class attribute, required unless button title is set. An example value is
+                    "fas sort".
+    "order"         Optional order of the icon, either "first" or "last" (default).
+    "justify"       Optional justification of the button title and icon, either "start", "end", "center" (default),
+                    "between", "around", or "evenly".
     "toast"         Optional id of the toast to display when the button is clicked.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "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.
 -->
 
 {{ $error := false }}
 {{ $type := "button" -}}
 
+{{- $icon := .Get "icon" }}
 {{ $title := trim .Inner " \r\n" -}}
-{{ if not $title -}}
-    {{ errorf "Missing inner element text: %s" .Position -}}
+{{ if not (or $title $icon) -}}
+    {{ errorf "Missing icon or inner element text: %s" .Position -}}
     {{ $error = true }}
 {{ end -}}
 
@@ -69,6 +81,7 @@
 {{ if $relref }}
     {{ $href = relref . $relref }}
 {{ end }}
+{{ $class := .Get "class" -}}
 
 {{ $placement := "top" -}}
 {{ with .Get "placement" }}{{ $placement = . }}{{ end -}}
@@ -80,6 +93,25 @@
 
 {{- $toast := .Get "toast" -}}
 
+{{- $order := "last" -}}
+{{- with .Get "order" }}{{ $order = . }}{{ end -}}
+{{- $supportedOrders := slice "first" "last" -}}
+{{- if not (in $supportedOrders $order) -}}
+    {{ errorf "Invalid value for param 'order': %s" .Position -}}
+    {{ $error = true }}
+{{- end -}}
+
+{{- $justify := "center" -}}
+{{- with .Get "justify" }}{{ $justify = . }}{{ end -}}
+{{- $supportedJustify := slice "start" "end" "center" "between" "around" "evenly" -}}
+{{- if not (in $supportedJustify $justify) -}}
+    {{ errorf "Invalid value for param 'justify': %s" .Position -}}
+    {{ $error = true }}
+{{- end -}}
+
+{{- $cue := .Get "cue" | default site.Params.main.externalLinks.cue -}}
+{{- $tab := .Get "tab" | default site.Params.main.externalLinks.tab -}}
+
 {{ if not $error }}
     {{- partial "assets/button.html" (dict 
         "type" $type
@@ -94,7 +126,13 @@
         "href" $href
         "id" $id
         "state" $state
+        "class" $class
         "placement" $placement
+        "icon" $icon
+        "order" $order
+        "justify" $justify
+        "cue" $cue
+        "tab" $tab
         "toast" $toast)
     -}} 
 {{ end }}

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>

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
     
-    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`.
-*/ -}}
+    The snippet between the two markers is then rendered using syntax highlighting. The shortcode supports the
+    following named arguments:
+
+    "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 }}" 
@@ -80,7 +97,7 @@
                 data-bs-target=".multi-{{ $id }}" 
                 aria-expanded="false" 
                 aria-controls="body-{{ $id }} footer-{{ $id }}">
-                <small>{{ if $full }}{{ strings.TrimPrefix $basePath $file }}{{ else }}{{ path.Base $file }}{{ end }}</small>
+                <small>{{ if $full }}{{ strings.TrimPrefix "/" (strings.TrimPrefix $basePath $file) }}{{ else }}{{ path.Base $file }}{{ end }}</small>
             </a>
         </li>
     </ul>

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>

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 }}" 

layouts/shortcodes/link.html

@@ -0,0 +1,58 @@
+<!-- 
+    Generates a link for a given named link or url. The shortcode supports a single unnamed parameter, or various named
+    parameters. The unnamed parameter is recognized as a named link if it does not contain any "/", otherwise it is
+    treated as a url. Any inner text is rendered as the link title, otherwise it uses the host name (for external links)
+    or page name (for internal links). The shortcode supports the following named arguments:
+    "name"          Optional name of the link maintained in the "links" section of the site's parameters. If omitted,
+                    the "url" argument should be provided instead.
+    "url"           Optional url of the link, including the scheme ("http" or "https"). If omitted, the "name" argument
+                    should be provided instead.
+    "cue"           Optional flag to indicate if an external link should show a visual cue, defaults to setting
+                    "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.
+    "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 -}}
+{{ $name := "" }}
+{{ $url := "" }}
+{{ $case := true }}
+{{ $cue := site.Params.main.externalLinks.cue }}
+{{ $tab := site.Params.main.externalLinks.tab }}
+
+{{ if .IsNamedParams }}
+    {{ $name = .Get "name" }}
+    {{ $url = .Get "url" }}
+    {{ $cue = .Get "cue" | default site.Params.main.externalLinks.cue }}
+    {{ $tab = .Get "tab" | default site.Params.main.externalLinks.tab }}
+    {{ $case = .Get "case" | default true }}
+{{ else if strings.Contains (.Get 0) "/" }}
+    {{ $url = .Get 0 }}
+{{ else }}
+    {{ $name = .Get 0 }}
+{{ end }}
+
+{{ if not (or $name $url) }}
+    {{ errorf "Expected param 'name' or 'url': %s" .Position -}}
+    {{ $error = true -}}
+{{ end }}
+
+{{ if $name }}
+    {{ $url = index site.Params.links $name }}
+    {{ if not $url }}
+        {{ errorf "Cannot find link '%s': %s" $name .Position -}}
+        {{ $error = true -}}
+    {{ end }}
+{{ end }}
+
+{{ $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 "class" $class) }}
+{{- end -}}
+

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 -}}