Merge pull request #1560 from gethinode/hugo-mod-dependencies

Update Hugo module dependencies

.github/codeql/codeql-config.yml

@@ -0,0 +1,8 @@
+paths:
+  - 'assets/js'
+paths-ignore:
+  - '**/vendor'
+  - '**/critical/languageSelector.js'
+  - '**/critical/color.js'
+  - '**/navbar.js'
+  - '**/sharing.js'

.github/workflows/codeql.yml

@@ -0,0 +1,102 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL Advanced"
+
+on:
+  push:
+    branches: [ "main" ]
+  pull_request:
+    branches: [ "main" ]
+  schedule:
+    - cron: '44 1 * * 3'
+
+jobs:
+  analyze:
+    name: Analyze (${{ matrix.language }})
+    # Runner size impacts CodeQL analysis time. To learn more, please see:
+    #   - https://gh.io/recommended-hardware-resources-for-running-codeql
+    #   - https://gh.io/supported-runners-and-hardware-resources
+    #   - https://gh.io/using-larger-runners (GitHub.com only)
+    # Consider using larger runners or machines with greater resources for possible analysis time improvements.
+    runs-on: ${{ (matrix.language == 'swift' && 'macos-latest') || 'ubuntu-latest' }}
+    permissions:
+      # required for all workflows
+      security-events: write
+
+      # required to fetch internal or private CodeQL packs
+      packages: read
+
+      # only required for workflows in private repositories
+      actions: read
+      contents: read
+
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+        - language: actions
+          build-mode: none
+        - language: javascript-typescript
+          build-mode: none
+        # CodeQL supports the following values keywords for 'language': 'actions', 'c-cpp', 'csharp', 'go', 'java-kotlin', 'javascript-typescript', 'python', 'ruby', 'rust', 'swift'
+        # Use `c-cpp` to analyze code written in C, C++ or both
+        # Use 'java-kotlin' to analyze code written in Java, Kotlin or both
+        # Use 'javascript-typescript' to analyze code written in JavaScript, TypeScript or both
+        # To learn more about changing the languages that are analyzed or customizing the build mode for your analysis,
+        # see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/customizing-your-advanced-setup-for-code-scanning.
+        # If you are analyzing a compiled language, you can modify the 'build-mode' for that language to customize how
+        # your codebase is analyzed, see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/codeql-code-scanning-for-compiled-languages
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v5
+
+    # Add any setup steps before running the `github/codeql-action/init` action.
+    # This includes steps like installing compilers or runtimes (`actions/setup-node`
+    # or others). This is typically only required for manual builds.
+    # - name: Setup runtime (example)
+    #   uses: actions/setup-example@v1
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v3
+      with:
+        languages: ${{ matrix.language }}
+        build-mode: ${{ matrix.build-mode }}
+        config-file: ./.github/codeql/codeql-config.yml
+
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+
+        # For more details on CodeQL's query packs, refer to: https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
+        # queries: security-extended,security-and-quality
+
+    # If the analyze step fails for one of the languages you are analyzing with
+    # "We were unable to automatically build your code", modify the matrix above
+    # to set the build mode to "manual" for that language. Then modify this step
+    # to build your code.
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
+    - if: matrix.build-mode == 'manual'
+      shell: bash
+      run: |
+        echo 'If you are using a "manual" build mode for one or more of the' \
+          'languages you are analyzing, replace this with the commands to build' \
+          'your code, for example:'
+        echo '  make bootstrap'
+        echo '  make release'
+        exit 1
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v3
+      with:
+        category: "/language:${{matrix.language}}"

.github/workflows/lint-build.yml

@@ -14,13 +14,17 @@ env:
   CACHE_PATH_WIN: '~\AppData\Local\hugo_cache'
   CACHE_PATH_MAC: '/Users/runner/Library/Caches/hugo_cache'
 
+permissions:
+  pull-requests: read
+  contents: read
+
 jobs:
   lint:
     runs-on: ubuntu-latest
 
     steps:
     - name: Check out repository
-      uses: actions/checkout@v4
+      uses: actions/checkout@v5
 
     - name: Set up Node.js
       uses: actions/setup-node@v4
@@ -49,7 +53,7 @@ jobs:
 
     steps:
     - name: Check out repository
-      uses: actions/checkout@v4
+      uses: actions/checkout@v5
 
     - name: Install Go
       uses: actions/setup-go@v5

.github/workflows/mod-update.yml

@@ -14,7 +14,7 @@ jobs:
 
     steps:
     - name: Checkout repository
-      uses: actions/checkout@v4
+      uses: actions/checkout@v5
 
     - name: Setup Node.js
       uses: actions/setup-node@v4

.github/workflows/npm-publish.yml

@@ -1,41 +0,0 @@
-# This workflow will run tests using node and then publish a package to npmjs.org when a release is created
-# For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages
-name: Publish package to npmjs
-
-on:
-  workflow_dispatch:
-  release:
-    types: [published]
-
-env:
-  REGISTRY_URL: 'https://registry.npmjs.org/'
-
-jobs:
-  build:
-    strategy:
-      matrix:
-        os: [ubuntu-latest]
-        node-version: [20.x]
-
-    runs-on: ${{ matrix.os }}
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup .npmrc file to publish to npm
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ matrix.node-version }}
-          registry-url: ${{ env.REGISTRY_URL }}
-          cache: 'npm'
-          cache-dependency-path: '**/package-lock.json'
-  
-      # [27/AUG/23] Adjusted from npm ci to prevent EBADPLATFORM error due to fsevents
-      - name: Install npm
-        run: npm i
-
-      - name: Publish package to npm
-        run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/release.yml

@@ -0,0 +1,44 @@
+name: Release
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+
+env:
+  HUSKY: 0
+
+permissions:
+  contents: read # for checkout
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write # to be able to publish a GitHub release
+      issues: write # to be able to comment on released issues
+      pull-requests: write # to be able to comment on released pull requests
+      id-token: write # to enable use of OIDC for npm provenance
+    
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v5
+        with:
+          fetch-depth: 0
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "lts/*"
+
+      - name: Install dependencies
+        run: npm clean-install
+
+      - name: Verify the integrity of provenance attestations and registry signatures for installed dependencies
+        run: npm audit signatures
+
+      - name: Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: npx semantic-release

.gitignore

@@ -1,5 +1,6 @@
 _vendor/
 prebuild/
+prebuild-headers/
 public/
 resources/
 node_modules/

.husky/commit-msg

@@ -0,0 +1 @@
+npx --no -- commitlint --edit $1

.husky/install.mjs

@@ -0,0 +1,6 @@
+// Skip Husky install in production and CI
+if (process.env.NODE_ENV === 'production' || process.env.CI === 'true') {
+    process.exit(0)
+}
+const husky = (await import('husky')).default
+console.log(husky())

.husky/pre-commit

@@ -0,0 +1 @@
+npm test

README.md

@@ -15,9 +15,6 @@
     <a href="https://gethinode.com">
         <img src="https://img.shields.io/badge/theme-hinode-blue" alt="Hinode theme">
     </a>
-    <a href="https://www.npmjs.com/package/%40gethinode/hinode">
-        <img src="https://img.shields.io/npm/v/%40gethinode/hinode" alt="npm package">
-    </a>
     <a href="https://app.netlify.com/sites/gethinode-demo/deploys">
         <img src="https://img.shields.io/netlify/0ad42e3e-fdfa-4d37-8e26-58badd429a67"  alt="Netlify Status">
     </a>

assets/js/critical/color.js

@@ -1,4 +1,4 @@
-{{- if site.Params.main.enableDarkMode -}}
+{{- if (or site.Params.main.enableDarkMode site.Params.main.colorMode.enabled) -}}
 
 /*!
  * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
@@ -43,9 +43,7 @@
       document.documentElement.setAttribute('data-bs-theme', theme)
     }
 
-    document.querySelectorAll('.navbar-mode-selector').forEach(chk => {
-      chk.checked = (document.documentElement.getAttribute('data-bs-theme') === 'light')
-    })
+    updateSelectors()
   }
 
   // alternates the currently active theme
@@ -54,6 +52,12 @@
     setTheme(target)
   }
 
+  function updateSelectors() {
+    document.querySelectorAll('.navbar-mode-selector').forEach(chk => {
+      chk.checked = (document.documentElement.getAttribute('data-bs-theme') === 'light')
+    })
+  }
+
   window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
     if (storedTheme !== 'light' || storedTheme !== 'dark') {
       setTheme(getPreferredTheme())
@@ -69,7 +73,12 @@
     })
   })
 
-  // initialize theme directly when script is invoked
+  window.addEventListener('load', () => {
+    // update the selectors when all elements are ready
+    updateSelectors()
+  })
+
+  // initialize theme as soon as possible to reduce screen flickering
   setTheme(getTheme())
 })()
 

assets/js/modal.js

@@ -0,0 +1,6 @@
+document.addEventListener('hide.bs.modal', function (event) {
+  // Remove the focus from the active element
+  if (document.activeElement) {
+    document.activeElement.blur()
+  }
+})

assets/js/nav.js

@@ -0,0 +1,45 @@
+function updateDropdown (element, id, label) {
+  const dropdown = document.getElementById(element)
+  if (dropdown != null) {
+    dropdown.querySelector('.dropdown-toggle').textContent = label
+    dropdown.querySelectorAll('.panel-dropdown .dropdown-item').forEach(item => {
+      item.classList.remove('active')
+      let target = item.getAttribute('data-link')
+      if (target != null) {
+        target = target.replace(/^#+/, '')
+        if (target === id) {
+          item.classList.add('active')
+        }
+      }
+    })
+  }
+}
+
+document.querySelectorAll('.panel-dropdown').forEach(trigger => {
+  trigger.addEventListener('hide.bs.dropdown', event => {
+    if (event.clickEvent != null) {
+      let target = event.clickEvent.srcElement.getAttribute('data-link')
+      if (target != null) {
+        trigger.querySelectorAll('.panel-dropdown .dropdown-item').forEach(item => {
+          item.classList.remove('active')
+        })
+        target = target.replace(/^#+/, '')
+        const btn = document.getElementById(target)
+        if (btn != null) {
+          event.clickEvent.srcElement.classList.add('active')
+          trigger.querySelector('.dropdown-toggle').textContent = event.clickEvent.srcElement.textContent
+          btn.click()
+        }
+      }
+    }
+  })
+})
+
+document.querySelectorAll('.nav-panel .nav-link').forEach(trigger => {
+  trigger.addEventListener('click', event => {
+    const companion = event.srcElement.parentElement.parentElement.getAttribute('data-companion')
+    if (companion != null) {
+      updateDropdown(companion, trigger.getAttribute('id'), trigger.textContent.trim())
+    }
+  })
+})

assets/js/toc.js

@@ -0,0 +1,13 @@
+const btnTOCShowMore = document.getElementById('btnTOCShowMore')
+if (btnTOCShowMore !== null) {
+  btnTOCShowMore.addEventListener('click', (e) => {
+    btnTOCShowMore.style.display = 'none'
+  })
+}
+
+const btnTOCShowLess = document.getElementById('btnTOCShowLess')
+if ((btnTOCShowLess !== null) && (btnTOCShowMore !== null)) {
+  btnTOCShowLess.addEventListener('click', (e) => {
+    btnTOCShowMore.style.display = 'initial'
+  })
+}

assets/scss/app-dart.scss

@@ -24,8 +24,10 @@
 @import "components/carousel.scss";
 @import "components/clipboard.scss";
 @import "components/command.scss";
+@import "components/docs.scss";
 @import "components/feature.scss";
 @import "components/footer.scss";
+@import "components/kbd.scss";
 @import "components/nav.scss";
 @import "components/navbar.scss";
 @import "components/img.scss";
@@ -35,6 +37,7 @@
 @import "components/sidebar.scss";
 @import "components/syntax-dart.scss"; // note: modified for dart-sass
 @import "components/table.scss";
+@import "components/toast.scss";
 @import "components/timeline.scss";
 @import "components/toc.scss";
 @import "components/video.scss";

assets/scss/app.scss

@@ -22,8 +22,10 @@
 @import "components/carousel.scss";
 @import "components/clipboard.scss";
 @import "components/command.scss";
+@import "components/docs.scss";
 @import "components/feature.scss";
 @import "components/footer.scss";
+@import "components/kbd.scss";
 @import "components/nav.scss";
 @import "components/navbar.scss";
 @import "components/img.scss";
@@ -33,6 +35,7 @@
 @import "components/sidebar.scss";
 @import "components/syntax.scss";
 @import "components/table.scss";
+@import "components/toast.scss";
 @import "components/timeline.scss";
 @import "components/toc.scss";
 @import "components/video.scss";

assets/scss/common/_styles.scss

@@ -14,6 +14,10 @@ a:active {
     text-decoration: none;
 }
 
+div.rounded, img.rounded {
+    --bs-border-radius: #{$theme-border-radius};
+}
+
 //
 // Ensure main page is rendered to full viewport height
 //

assets/scss/common/_variables-dart.scss

@@ -16,12 +16,12 @@ $font-weight-normal:            300 !default;
 $font-weight-bold:              600 !default;
 $font-weight-bolder:            bolder !default;
 
-$theme-border-radius:           1rem;
-
 strong {
     font-weight:                600 if($enable-important-utilities, !important, null);
 }
 
+$theme-border-radius:           0.375rem;
+
 $navbar-height:                 h.$navbar-height;
 $navbar-offset:                 h.$navbar-offset;
 $navbar-offset-xs:              h.$navbar-offset-xs;

assets/scss/common/_variables.scss

@@ -17,13 +17,13 @@ $font-weight-normal:            300 !default;
 $font-weight-bold:              600 !default;
 $font-weight-bolder:            bolder !default;
 
-$theme-border-radius:           1rem;
-
 strong {
     font-weight:                600 if($enable-important-utilities, !important, null);
 }
 // scss-docs-end font
 
+$theme-border-radius:           0.375rem;
+
 $white:                       #fff !default;
 $black:                       #000 !default;
 $body-bg:                     #fff !default;

assets/scss/components/_button.scss

@@ -52,3 +52,7 @@ a.btn {
 .btn-xs {
   @include button-size($btn-padding-y-xs, $btn-padding-x-xs, $btn-font-size-xs, $btn-border-radius-xs);
 }
+
+.btn {
+    --bs-border-radius: #{$theme-border-radius};
+}

assets/scss/components/_card.scss

@@ -6,6 +6,9 @@
 }
 
 .card {
+    --bs-card-border-radius: #{$theme-border-radius};
+    --bs-card-inner-border-radius: #{$theme-border-radius};
+    --bs-border-radius: #{$theme-border-radius};
     --bs-card-bg: transparent;
 }
 
@@ -28,6 +31,13 @@
     cursor: pointer;
 }
 
+.card-img-top {
+    --bs-border-radius: #{$theme-border-radius};
+
+    border-top-left-radius: var(--bs-border-radius) !important;
+    border-top-right-radius: var(--bs-border-radius) !important;
+}
+
 .card-img-wrap img {
     transition: transform 0.25s ease;
     width: 100%;

assets/scss/components/_carousel.scss

@@ -1,3 +1,7 @@
+.carousel-inner {
+    border-radius: #{$theme-border-radius};
+}
+
 .gradient {
     width: 100%;
     height: 100%;

assets/scss/components/_docs.scss

@@ -0,0 +1,22 @@
+.docs-controls .nav-link,
+.file-controls .nav-link {
+    border-top-left-radius: #{$theme-border-radius};
+    border-top-right-radius: #{$theme-border-radius};
+    margin-left: #{$theme-border-radius};
+
+    &:hover,
+    &:focus {
+        border-bottom: 0;
+    }
+}
+
+.docs-panel,
+.file-panel {
+    border: 1px solid var(--#{$prefix}border-color);
+    overflow: hidden;
+}
+
+.docs-panel, .docs-panel .collapse,
+.file-panel, .file-panel .collapse {
+    border-radius: #{$theme-border-radius};
+}

assets/scss/components/_img.scss

@@ -27,3 +27,7 @@
     width: 100vw;
     object-fit: cover;
 }
+
+.figure-caption {
+    margin-left: #{$theme-border-radius};
+}

assets/scss/components/_kbd.scss

@@ -0,0 +1,3 @@
+kbd {
+    border-radius: #{$theme-border-radius};
+}

assets/scss/components/_nav.scss

@@ -84,6 +84,14 @@
     border-color: var(--#{$prefix}border-color);
 }
 
+.nav-callout, .pagination {
+    --bs-border-radius: #{$theme-border-radius};
+}
+
+.nav-callout .tab-content {
+    border-radius: #{$theme-border-radius};
+}
+
 @if $enable-dark-mode {
     @include color-mode(dark) {
         .nav-callout, .tab-content {

assets/scss/components/_navbar.scss

@@ -7,7 +7,7 @@
 }
 
 .mode-switch {
-    --#{$prefix}mode-switch-width: 50px;
+    --#{$prefix}mode-switch-width: 3em;
 }
 
 .mode-switch .label {
@@ -64,6 +64,18 @@
     transform: scale(0.8);
 }
 
+.mode-toggle > input {
+	z-index: 1;
+	cursor: pointer;
+    height: 25px;
+    width: 25px;
+}
+
+.mode-toggle > label {
+	z-index: 0;
+	cursor: pointer;
+}
+
 // Source: https://jsfiddle.net/njhgr40m/
 
 @if $enable-dark-mode {
@@ -126,12 +138,60 @@
 
 .navbar-expanded {
     box-shadow: $box-shadow-sm;
+    min-height: 100vh;
+    align-items: start;
+}
+
+.navbar-expanded .navbar-collapse {
+    margin-top: 2rem;
+}
+
+@each $h, $size in $font-sizes {
+    .navbar-fs-#{$h} {
+        font-size: #{$size};
+    }
+}
+
+@each $breakpoint in map-keys($grid-breakpoints) {
+    $next: breakpoint-next($breakpoint, $grid-breakpoints);
+    $infix: breakpoint-infix($next, $grid-breakpoints);
+
+    @if $infix != '' {
+        @include media-breakpoint-up($next) {
+            .navbar#{$infix}-fs { 
+                font-size: inherit;
+            } 
+        }
+    }
+}
+
+.navbar-icon {
+    padding-right: var(--bs-navbar-nav-link-padding-x);
+    padding-left: var(--bs-navbar-nav-link-padding-x);
 }
 
 .nav-item .vr {
     color: var(--bs-navbar-color);
 }
 
+.navbar .nav-item {
+    display: flex;
+    align-items: center;
+}
+
+.navbar-collapse .dropdown {
+    display: inline;
+    align-items: normal;
+}
+
+.navbar-expanded .btn {
+    font-size: 1em;
+}
+
+.navbar-expanded .search-input {
+    margin-bottom: 1rem;
+}
+
 /* Remove border from toggler */
 .navbar-toggler {
     border: 0 if($enable-important-utilities, !important, null);
@@ -319,3 +379,7 @@
     position: absolute;
     z-index: $zindex-fixed;
 }
+
+.form-control.is-search {
+    border: 1px solid var(--bs-border-color) !important;
+}

assets/scss/components/_sidebar.scss

@@ -11,6 +11,12 @@
 }
 
 .sidebar-item {
+    --bs-border-radius: #{$theme-border-radius};
+    --bs-border-radius-sm: #{$theme-border-radius};
+    --bs-border-radius-lg: #{$theme-border-radius};
+    --bs-border-radius-xl: #{$theme-border-radius};
+    --bs-border-radius-xxl: #{$theme-border-radius};
+
     color: rgba(0, 0, 0, 0.65);
     margin-left: 0 !important;
     display: inline-block;
@@ -28,6 +34,8 @@
 }
 
 .sidebar-item-group {
+    border-radius: #{$theme-border-radius};
+
     &:hover,
     &:focus {
         color: $primary;
@@ -126,4 +134,6 @@
 
 .dropdown-toggle {
     outline: 0;
+    display: flex;
+    align-items: center;
 }

assets/scss/components/_syntax-dart.scss

@@ -16,6 +16,10 @@
     flex: 1;
 }
 
+.codeblock.syntax-highlight, .command.syntax-highlight {
+    border-radius: #{$theme-border-radius};
+}
+
 .syntax-highlight {
     background-color: var(--bs-light) if($enable-important-utilities, !important, null);
     overflow-x: auto;

assets/scss/components/_syntax.scss

@@ -16,6 +16,10 @@
     flex: 1;
 }
 
+.codeblock.syntax-highlight, .command.syntax-highlight {
+    border-radius: #{$theme-border-radius};
+}
+
 .syntax-highlight {
     background-color: var(--bs-light) if($enable-important-utilities, !important, null);
     overflow-x: auto;

assets/scss/components/_timeline.scss

@@ -26,6 +26,10 @@ $semi-circle-border: 0.2rem;
 
 // scss-docs-end timeline
 
+.timeline-container {
+    border-radius: #{$theme-border-radius}; 
+}
+
 .timeline, .timeline-sm {
     position: relative;
 }

assets/scss/components/_toast.scss

@@ -0,0 +1,4 @@
+.toast {
+    border-radius: #{$theme-border-radius};
+    overflow: hidden;
+}

assets/scss/components/_toc.scss

@@ -3,11 +3,11 @@
 //
 // scss-docs-start toc
 .toc-sidebar {
-    grid-area: toc;
     right: 0;
     z-index: 2;
     overflow-y: auto;
     top: 5rem;
+    max-height: calc(100vh - var(--navbar-offset));
 }
 
 // scss-docs-end toc
@@ -74,6 +74,14 @@
     }
 }
 
+.btn-link.toc-item {
+    font-size: inherit;
+}
+
+#btnTOCShowMore {
+    padding-top: 0.875rem;
+}
+
 a.toc-item {
     display: block;
 }

assets/scss/components/_video.scss

@@ -3,6 +3,7 @@
     padding-bottom: 56.25%;
     height: 0;
     overflow: hidden;
+    border-radius: #{$theme-border-radius};
 }
 
 .video-embedded > iframe {
@@ -11,7 +12,7 @@
     left: 0;
     width: 100%;
     height: 100%;
-    border:0;
+    border: 0;
 }
 
 // Adapted from https://github.com/gohugoio/hugo/tpl/tplimpl/embedded/templates/shortcodes/vimeo_simple.html

assets/scss/theme/fonts.scss

@@ -10,7 +10,7 @@
 
 /* inter-200 - latin */
 @font-face {
-    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-display: block; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
     font-family: 'Inter';
     font-style: normal;
     font-weight: 200;
@@ -23,7 +23,7 @@
   }
   /* inter-300 - latin */
   @font-face {
-    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-display: block; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
     font-family: 'Inter';
     font-style: normal;
     font-weight: 300;
@@ -36,7 +36,7 @@
   }
   /* inter-regular - latin */
   @font-face {
-    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-display: block; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
     font-family: 'Inter';
     font-style: normal;
     font-weight: 400;
@@ -49,7 +49,7 @@
   }
   /* inter-600 - latin */
   @font-face {
-    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+    font-display: block; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
     font-family: 'Inter';
     font-style: normal;
     font-weight: 600;

commitlint.config.js

@@ -0,0 +1 @@
+module.exports = {extends: ['@commitlint/config-conventional']}

component-library/bookshop.scss

@@ -2,8 +2,10 @@
 @import "modules/bookshop/components/about/about";
 @import "modules/bookshop/components/articles/articles";
 @import "modules/bookshop/components/cards/cards";
+@import "modules/bookshop/components/cta/cta";
 @import "modules/bookshop/components/faq/faq";
 @import "modules/bookshop/components/hero/hero";
+@import "modules/bookshop/components/panels/panels";
 @import "modules/bookshop/components/releases/releases";
 @import "modules/bookshop/components/separator/separator";
 @import "modules/bookshop/components/video-message/video-message";

component-library/components/about/about.hugo.html

@@ -19,6 +19,7 @@
 {{/* Main code */}}
 {{ if not $args.error }}
     {{ partial "assets/hero.html"  (dict 
+        "page"         page
         "heading"      $args.heading
         "background"   $args.background
         "illustration" (merge (dict "ratio" "auto") $args.illustration)

component-library/components/articles/articles.bookshop.yml

@@ -27,6 +27,8 @@ blueprint:
   more:
     title:
     link:
+  icon-rounded:
+  icon-style:
   cols:
   padding:
   limit:

component-library/components/articles/articles.hugo.html

@@ -19,6 +19,10 @@
     {{ $error = $args.err }}
 {{ end }}
 
+{{/* Initialize global arguments */}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
+
+{{/* Initialize local variables */}}
 {{ $pages := slice }}
 {{ $result := partial "assets/live-pages.html" (dict 
 	"page"       $args.page
@@ -60,9 +64,14 @@
 	{{ $paginate = false }}
 {{ end }}
 
-<!-- Main code -->
+{{/* Main code */}}
 {{ if not $error }}
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+	{{ if or (gt (len $pages) 0) (not $args.hideEmpty) }}
+		{{- partial "assets/section-title.html" (dict
+			"heading" $args.heading
+			"justify" $args.justify
+			"class" (printf "pb-%d" $padding.y))
+		-}}
 
 		{{ $partial := "assets/card-group.html" }}
 		{{ $params := dict }}
@@ -72,13 +81,14 @@
 			"limit"        $args.limit
 			"cols"         $args.cols
 			"icon-rounded" $args.iconRounded
+			"icon-style"   $args.iconStyle
 			"href"         (cond $moreButton $moreLink "")
 			"href-title"   (cond $moreButton $moreTitle "")
 			"href-force"   (gt $result.total (len $result.pages))
 		)}}
 
 		{{ if $args.scroll }}
-		{{ $partial := "assets/stack.html" }}
+			{{ $partial = "assets/stack.html" }}
 			{{ $params = merge $params (dict 
 				"header-style" "none"
 				"body-style"   "title"
@@ -95,7 +105,6 @@
 				"footer-style" $args.footerStyle
 				"padding"      $args.padding
 				"class"        (or $args.class "border-0")
-			"icon-style"   "fa-2x"
 				"align"        "start"
 				"orientation"  $args.orientation
 				"hook"         "assets/live-card.html"
@@ -103,5 +112,10 @@
 				"paginate"     $paginate
 			) -}}
 		{{ end }}
+		{{ if gt (len $pages) 0 }}
 			{{ partial $partial $params }}
+		{{ else }}
+			<p class="pt-{{ $padding.y }}">{{- T "emptyList" }}.</p>
+		{{ end }}
+	{{ end }}
 {{ end }}

component-library/components/cards/cards.bookshop.yml

@@ -17,6 +17,7 @@ blueprint:
     width:
   cols:
   icon-rounded:
+  icon-style:
   padding:
   background:
     backdrop:
@@ -32,3 +33,4 @@ blueprint:
   class:
   width:
   justify:
+  align:

component-library/components/cards/cards.hugo.html

@@ -21,6 +21,7 @@
 
 {{/* Initialize global arguments */}}
 {{- $breakpoint := partial "utilities/GetBreakpoint.html" -}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
 
 {{/* Initialize local variables */}}
 {{ $list := slice }}
@@ -34,37 +35,46 @@
 	) }}
 {{ end}}
 
+{{/* Main code */}}
 {{ if not $error }}
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
+	{{/* Layout for small screens */}}
 	{{- partial "assets/card-group.html" (dict 
 		"page"         page
 		"list"         $list
-		"class"        (printf "border-0 card-icon-primary d-%s-none %s" $breakpoint.prev $args.class)
+		"class"        (printf "border-0 card-icon-primary %s" (or $args.class ""))
+		"wrapper"      (printf "d-%s-none" $breakpoint.prev)
 		"cols"         $args.cols
 		"gutter"       "4"
 		"padding"      $args.padding
 		"header-style" "none"
 		"footer-style" "none"
 		"icon-rounded" $args.iconRounded
-		"icon-style"   "fa-2x"
-		"align"        "start"
+		"icon-style"   (or $args.iconStyle "fa-2x")
+		"align"        $args.align
 		"orientation"  ($args.orientation | default "horizontal-sm")
 		"hook"         "assets/live-card.html"
 	) -}}
 
+	{{/* Layout for regular screens */}}
 	{{- partial "assets/card-group.html" (dict 
 		"page"         page
 		"list"         $list
-		"class"        (printf "border-0 card-icon-primary d-none d-%s-block %s" $breakpoint.prev $args.class)
+		"class"        (printf "border-0 card-icon-primary %s" (or $args.class ""))
+		"wrapper"      (printf "d-none d-%s-block" $breakpoint.prev)
 		"cols"         $args.cols
 		"gutter"       "4"
 		"padding"      $args.padding
 		"header-style" "none"
 		"footer-style" "none"
 		"icon-rounded" $args.iconRounded
-		"icon-style"   "fa-2x"
-		"align"        "start"
+		"icon-style"   (or $args.iconStyle "fa-2x")
+		"align"        $args.align
 		"orientation"  ($args.orientation | default "stacked")
 		"hook"         "assets/live-card.html"
 	) -}}

component-library/components/cta/cta.bookshop.yml

@@ -0,0 +1,43 @@
+# Metadata about this component, to be used in the CMS
+spec:
+  structures:
+    - content_blocks
+  label: CTA
+  description: Call to action
+  icon: contact_page
+  tags: []
+
+# Defines the structure of this component, as well as the default values
+blueprint:
+  heading:
+    preheading:
+    title:
+    content:
+    align:
+    arrangement:
+    width:
+    size:
+  contact:
+  caption-url:
+  illustration:
+    image:
+    icon:
+    ratio:
+    class:
+    anchor:
+    mode:
+  background:
+    backdrop:
+    color:
+    subtle:
+  links:
+    -
+      title:
+      url:
+      icon:
+      force:
+  align:
+  fluid:
+  padding:
+  order:
+  width:

component-library/components/cta/cta.hugo.html

@@ -0,0 +1,43 @@
+{{/* 
+    Copyright © 2025 The Hinode Team / Mark Dumay. All rights reserved.
+    Use of this source code is governed by The MIT License (MIT) that can be found in the LICENSE file.
+    Visit gethinode.com/license for more details.
+*/}}
+
+{{/* Initialize arguments */}}
+{{ $args := partial "utilities/InitArgs.html" (dict "bookshop" "cta" "args" .) }}
+{{ if or $args.err $args.warnmsg }}
+    {{ partial (cond $args.err "utilities/LogErr.html" "utilities/LogWarn.html") (dict 
+        "partial" "component-library/components/cta/cta.hugo.html" 
+        "warnid"  "warn-invalid-arguments"
+        "msg"     "Invalid arguments"
+        "details" ($args.errmsg | append $args.warnmsg)
+        "file"    page.File
+    )}}
+{{- end -}}
+
+{{/* Main code */}}
+{{ if not $args.error }}
+	{{ $links := slice }}
+	{{ if and (reflect.IsSlice .links) (gt (len .links) 0) }}
+		{{ $links = .links }}
+	{{ else }}
+		{{ with site.Params.modules.bookshop.cta.defaultURL }}
+			{{ $links = $links | append (dict "title" (T "contactAction") "url" . "icon" "fas chevron-right") }}
+		{{ end }}
+	{{ end }}
+
+	{{ partial "assets/contact.html" (dict 
+		"page"         page
+		"orientation"  "horizontal"
+		"heading"      $args.heading
+		"contact"      $args.contact
+		"caption-url"  $args.captionUrl
+		"illustration" $args.illustration
+		"class"        "contact-img"
+		"links"        $links
+		"align"        $args.align
+		"order"        $args.order
+		"data"         site.Params.modules.bookshop.cta.section 
+	) }}
+{{ end }}

component-library/components/cta/cta.scss

@@ -0,0 +1,12 @@
+.cta {
+    background-color: var(--#{$prefix}primary-bg-subtle);
+}
+
+.cta, .background-img-fluid  {
+    border-radius: #{$theme-border-radius} if($enable-important-utilities, !important, null);
+}
+
+.cta .contact-img {
+    background-color: var(--#{$prefix}body-bg);
+    border-radius: var(--bs-border-radius);
+}

component-library/components/faq/faq.hugo.html

@@ -16,15 +16,24 @@
     )}}
 {{ end }}
 
+{{/* Initialize global arguments */}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
+
+{{/* Main code */}}
 {{ if not $args.err }}
 	{{ $color := "" }}
 	{{ if $args.contrast }}{{ $color = "white" }}{{ end }}
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "color" $color "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
 	{{ $class := "" }}
 	{{ $id := printf "faq-%s" (md5 (delimit (slice . now) "-")) }}
 
-	<div id="{{ $id }}" class="accordion accordion-faq {{ if $args.contrast }}accordion-faq-contrast text-white {{ end }}accordion-flush mb-3{{ with $class }} {{ . }}{{ end }} col-12 col-md-6 mx-auto">
+	<div id="{{ $id }}" class="accordion accordion-faq {{ if $args.contrast }}accordion-faq-contrast text-white {{ end -}}
+		accordion-flush{{ with $class }} {{ . }}{{ end }} col-12 col-md-6 mx-auto">
 		{{ range $index, $item := $args.items }}
 			<div class="accordion-item">
 				{{- with $item.title -}}

component-library/components/hero/hero.hugo.html

@@ -18,6 +18,7 @@
 
 {{ if not $args.err }}
 	{{ partial "assets/hero.html"  (dict 
+        "page"         page
 		"breadcrumb"   $args.breadcrumb
 		"heading"      $args.heading
 		"background"   $args.background

component-library/components/panels/panels.bookshop.yml

@@ -0,0 +1,35 @@
+# Metadata about this component, to be used in the CMS
+spec:
+  structures:
+    - content_blocks
+  label: Panels
+  description: Introduction section
+  icon: check
+  tags: []
+
+# Defines the structure of this component, as well as the default values
+blueprint:
+  heading:
+    preheading:
+    heading:
+    content:
+    align:
+    width:
+  cols:
+  padding:
+  background:
+    backdrop:
+    color:
+    subtle:
+  elements:
+    - title:
+      icon:
+      image:
+      mode:
+      content:
+  tab-type:
+  ratio:
+  responsive:
+  class:
+  width:
+  justify:

component-library/components/panels/panels.hugo.html

@@ -0,0 +1,87 @@
+{{/* 
+    Copyright © 2025 The Hinode Team / Mark Dumay. All rights reserved.
+    Use of this source code is governed by The MIT License (MIT) that can be found in the LICENSE file.
+    Visit gethinode.com/license for more details.
+*/}}
+
+{{ $error := false }}
+
+{{/* Initialize arguments */}}
+{{ $args := partial "utilities/InitArgs.html" (dict "bookshop" "panels" "args" .)}}
+{{ if or $args.err $args.warnmsg }}
+    {{ partial (cond $args.err "utilities/LogErr.html" "utilities/LogWarn.html") (dict 
+        "partial" "component-library/components/panels/panels.hugo.html" 
+        "warnid"  "warn-invalid-arguments"
+        "msg"     "Invalid arguments"
+        "details" ($args.errmsg | append $args.warnmsg)
+        "file"    page.File
+    )}}
+    {{ $error = $args.err }}
+{{ end }}
+
+{{/* Initialize global arguments */}}
+{{- $breakpoint := partial "utilities/GetBreakpoint.html" -}}
+{{- $padding := partial "utilities/GetPadding.html" -}}
+
+{{/* Initialize local variables */}}
+{{ $list := slice }}
+{{ $titles := slice }}
+{{ $toc := slice }}
+{{ $parentID := printf "panel-%v" (cond (isset . "_ordinal") (index . "_ordinal") (md5 (delimit (slice . now) "-"))) }}
+{{ $inner := "" }}
+{{ range $i, $element := $args.elements }}
+	{{ $toc = $toc | append (dict "href" "panel-0-1" "level" 2 "title" $element.title) }}
+
+    {{ $hero := partial "assets/hero.html"  (dict 
+        "page"         page
+        "heading"      (dict "title" $element.title "content" $element.content "width" 8 "size" 6)
+        "background"   $args.background
+        "illustration" (dict "ratio" $args.ratio "icon" $element.icon "image" $element.image "mode" $element.mode)
+		"order"        $args.order
+        "link-type"    $args.linkType
+        "links"        $args.links
+        "orientation"  "horizontal"
+		"align"        "start"
+		"width"        12
+        )
+    }}
+
+	{{- $output := partial "assets/nav-item.html" (dict 
+        "page"      page
+        "id"        $i
+        "parent-id" $parentID
+        "fade"      false
+        "title"     $element.title
+		"show"      (eq $i 0)
+        "raw"       $hero
+        )
+    -}}
+
+	{{ $inner = printf "%s\n%s" $inner $output }}
+	{{ $titles = $titles | append $element.title }}
+{{ end}}
+
+{{/* Main code */}}
+{{ if not $error }}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
+
+	{{- partial "assets/nav.html" (dict 
+        "id"           (or $args.id $parentID)
+        "page"         page
+		"nav-items"    $inner
+        "nav-titles"   $titles
+        "tab-type"     $args.tabType
+        "vertical"     $args.vertical
+        "word-wrap"    $args.wordWrap
+        "class"        $args.class
+        "pane"         $args.pane
+        "width"        $args.width
+		"responsive"   $args.responsive
+        ) 
+    -}}
+{{ end }}
+

component-library/components/panels/panels.scss

@@ -0,0 +1,13 @@
+.panels .dropdown-toggle {
+    text-decoration: none !important;
+}
+
+.panels .nav-tabs {
+    border-top-left-radius: #{$theme-border-radius};
+    border-top-right-radius: #{$theme-border-radius};
+    margin-left: #{$theme-border-radius};
+}
+
+.panels .tab-content {
+    border-radius: #{$theme-border-radius};
+}

component-library/components/separator/separator.bookshop.yml

@@ -6,3 +6,5 @@ spec:
   description: Inserts a horizontal page section separator
   icon: horizontal_rule
   tags: []
+
+blueprint:

component-library/components/separator/separator.hugo.html

@@ -4,7 +4,7 @@
     Visit gethinode.com/license for more details.
 */}}
 
-{{ $args := partial "utilities/InitArgs.html" (dict "structure" "separator" "args" .) }}
+{{ $args := partial "utilities/InitArgs.html" (dict "bookshop" "separator" "args" .) }}
 {{ if or $args.err $args.warnmsg }}
     {{ partial (cond $args.err "utilities/LogErr.html" "utilities/LogWarn.html") (dict 
         "partial" "component-library/components/separator/separator.hugo.html" 

component-library/components/video-message/video-message.bookshop.yml

@@ -24,12 +24,14 @@ blueprint:
   link-type:
   orientation:
   icon-rounded:
+  icon-style:
   video:
     provider:
     account:
     media-id:
     autoplay:
     query-args:
+    color:
   cols:
   messages:
     - title:

component-library/components/video-message/video-message.hugo.html

@@ -16,6 +16,7 @@
     )}}
 {{ end }}
 
+{{/* Initialize global variables */}}
 {{- $breakpoint := partial "utilities/GetBreakpoint.html" -}}
 {{- $padding := partial "utilities/GetPadding.html" -}}
 
@@ -27,6 +28,7 @@
 	{{ $queryArgs := .queryArgs }}
 	{{ $border := .border }}
 	{{ $padding := .padding }}
+	{{ $color := .color }}
 
 	{{ if site.Params.env_bookshop_live }}
 		{{/* Define dummy content as we cannot retrieve video data in live mode */}}
@@ -35,7 +37,7 @@
 			"ratio" "21x9"
 			"wrapper" (printf "text-center mb-%d" $padding.y)) -}}
 	{{ else }}
-        <div class="video-container{{ if $border }} video-container-border{{ end}}">
+        <div class="video-container{{ if $border }} video-container-border{{ end}} {{ with $color }}bg-{{ . }}{{ end }}">
 			{{ partial "assets/video.html" (dict
 				"page"       page
 				"provider"   $provider
@@ -59,6 +61,7 @@
 	{{ $cols := .cols }}
 	{{ $type := .type }}
 	{{ $iconRounded := .iconRounded }}
+	{{ $iconStyle := .iconStyle }}
 
 	{{- partial "assets/card-group.html" (dict 
 		"page"         page
@@ -75,9 +78,11 @@
 		"button"       true
 		"link-type"    $type
 		"icon-rounded" $iconRounded
+		"icon-style"   $iconStyle
 	) -}}
 {{ end }}
 
+{{/* Main code */}}
 {{ if not $args.err }}
 	{{ $list := slice }}
 
@@ -96,10 +101,14 @@
 		) }}
 	{{ end}}
 
-	{{- partial "assets/section-title.html" (dict "heading" $args.heading "justify" $args.justify) -}}
+	{{- partial "assets/section-title.html" (dict
+		"heading" $args.heading
+		"justify" $args.justify
+		"class" (printf "pb-%d" $padding.y))
+	-}}
 
 	{{ if eq $args.orientation "stacked" }}
-		<div class="col-{{ $breakpoint.current }}-{{ $args.width }} mx-auto pb-{{ $padding.y }}">
+		<div class="col-{{ $breakpoint.current }}-{{ $args.width }} mx-auto">
 		{{ with $args.video }}
 			{{- partial "inline/video.html" (dict
 				"provider"   .provider
@@ -109,14 +118,21 @@
 				"query-args" .queryArgs
 				"border"     $.border
 				"padding"    $padding
+				"color"      .color
 			) -}}
 		{{ end }}
 		</div>
-		<div class="mt-{{ $padding.y }} pb-{{ $padding.y }}">
-			{{- partial "inline/messages.html" (dict "list" $list "cols" $args.cols "type" $args.type "iconRounded" $args.iconRounded) -}}
+		<div class="mt-{{ $padding.y }} w-100">
+			{{- partial "inline/messages.html" (dict
+				"list"        $list
+				"cols"        $args.cols
+				"type"        $args.type
+				"iconRounded" $args.iconRounded
+				"iconStyle"   $args.iconStyle
+			) -}}
 		</div>
 	{{ else }}
-		<div class="container grid gap-4 pb-{{ $padding.y }}">
+		<div class="container grid gap-{{ $padding.x }}">
 			<div class="row row-cols-1 row-cols-{{ $breakpoint.current }}-2">
 				<div class="col col-{{ $breakpoint.current }}-{{ $args.width }} p-0">
 					{{ with $args.video }}
@@ -128,11 +144,18 @@
 							"query-args" .queryArgs
 							"border"     $.border
 							"padding"    $padding
+							"color"      .color
 						) -}}
 					{{ end }}
 				</div>
 				<div class="col col-{{ $breakpoint.current }}-{{ sub 12 $args.width }} mt-{{ $padding.y }} mt-{{ $breakpoint.current }}-0">
-					{{- partial "inline/messages.html" (dict "list" $list "cols" 1 "type" $args.type "iconRounded" $args.iconRounded) -}}
+					{{- partial "inline/messages.html" (dict
+						"list"        $list
+						"cols"        1
+						"type"        $args.type
+						"iconRounded" $args.iconRounded
+						"iconStyle"   $args.iconStyle
+					) -}}
 				</div>
 			</div>
 		</div>

component-library/components/video-message/video-message.scss

@@ -2,6 +2,7 @@
     --bs-video-border-color: var(--bs-primary);
     --bs-video-border-width: 1rem;
     
+    border-radius: $theme-border-radius;
     position: relative;
 }
 

component-library/helpers/component.html

@@ -16,6 +16,7 @@
 {{- $class := index . 2 | default "p-0" -}}
 {{- $bgclass := index . 3 | default "" -}}
 {{- $padding := partial "utilities/GetPadding.html" -}}
+{{- with index $component_props "padding" }}{{ $padding = dict "x" . "y" . }}{{ end -}}
 {{- $component_path := partial "_bookshop/helpers/component_key" $component_name -}}
 {{- $flat_component_path := partial "_bookshop/helpers/flat_component_key" $component_name -}}
 
@@ -31,10 +32,12 @@
     {{- $cover := index $component_props "cover" -}}
     {{- $background := index $component_props "background" -}}
     {{- $backdrop := "" -}}
+    {{- $fluid := index $component_props "fluid" | default true -}}
     {{- $style := index $component_props "wrapper" -}}
     {{- $width := index $component_props "width" -}}
     {{- $justify := index $component_props "justify" | default "start" -}}
-    {{- $padding := cond (ne $component_name "separator") (printf "px-%d px-xxl-0 py-%d" $padding.x $padding.y) "" -}}
+    {{- $paddingOuter := cond (ne $component_name "separator") (printf "px-xxl-0 px-%d py-0" $padding.x) "" -}}
+    {{- $padding := cond (ne $component_name "separator") (printf "px-%d %spy-%d" $padding.x (cond $fluid "px-xxl-0 " "") $padding.y) "" -}}
     {{- $wrapper := $style }}
     {{ with $background }}
         {{ $wrapper = partial "utilities/GetBackgroundStyle.html" (dict "background" . "class" $style) }}
@@ -42,14 +45,16 @@
             {{ with $background.backdrop }}{{ $wrapper = "" }}{{ $backdrop = . }}{{ end }}
         {{ end }}
     {{ end }}
-    {{/* warnf "wrapper: '%s'" $wrapper */}}
     {{- $theme := index $component_props "theme" -}}
     {{- $overlayMode := (or (index $component_props "overlay-mode") page.Params.overlayMode) | default "dark" -}}
     {{ if not $backdrop }}{{ $overlayMode = page.Params.overlayMode }}{{ end }}
     {{ if eq $overlayMode "none" }}{{ $overlayMode = "" }}{{ end }}
     
     {{ (printf "<!--bookshop-live name(%s)-->" $component_name) | safeHTML }}
-    <section {{ with $id }}id="{{ . }}" {{ end }}class="{{ $component_name }} container-fluid {{ $class }} {{ with $wrapper }}{{ . }}{{ end -}}
+    {{ if not $fluid }}<div class="container-xxl {{ $paddingOuter }}">{{ end }}
+    <section {{ with $id }}id="{{ . }}" {{ end }}class="{{ $component_name }}
+        container-fluid {{ $class }}
+        {{ with $wrapper }}{{ . }}{{ end -}}
         {{- if and $backdrop $overlayMode }} background-container{{ end -}}
         {{- if $cover }} section-cover d-flex align-items-center{{ end }}" 
         {{ with $overlayMode -}}
@@ -60,12 +65,16 @@
         {{- end -}}
         >
         {{- if $backdrop -}}
-            {{ partial "assets/live-image.html" (dict "src" $backdrop "class" (printf "background-img-fluid %s" $bgclass) "title" (T "backgroundImage")) }}
+            {{ partial "assets/live-image.html" (dict
+                "src" $backdrop
+                "class" (printf "background-img-fluid %s" $bgclass)
+                "title" (T "backgroundImage"))
+            }}
         {{- end -}}
 
         {{ $col := cond (and $width (lt $width 12)) (printf "col-12 col-md-%d" $width) "" }}
 
-        <div class="container-xxl {{ $padding }} d-flex flex-column align-items-{{ $justify }}">
+        <div class="container-{{ cond $fluid "xxl" "fluid" }} {{ $padding }} d-flex flex-column align-items-{{ $justify }}">
             {{ with $col }}
                 <div class="{{ . }}">{{ partial $resolved_component $component_props }}</div>
             {{ else }}
@@ -73,6 +82,7 @@
             {{ end}}
         </div>
     </section>
+    {{ if not $fluid }}</div>{{ end }}
     {{ "<!--bookshop-live end-->" | safeHTML }}
 {{- else -}}
     {{- $file_loc := slicestr $component_path 9 -}}

config/_default/hugo.toml

@@ -176,7 +176,7 @@ home = ["HTML", "RSS", "REDIR", "netlify", "server"]
   [[module.imports]]
     path = "github.com/gethinode/mod-csp"
   [[module.imports]]
-    path = "github.com/gethinode/mod-flexsearch/v2"
+    path = "github.com/gethinode/mod-flexsearch/v3"
   [[module.imports]]
     path = "github.com/gethinode/mod-fontawesome/v2"
   [[module.imports]]
@@ -188,7 +188,7 @@ home = ["HTML", "RSS", "REDIR", "netlify", "server"]
   [[module.imports]]
     path = "github.com/gethinode/mod-lottie"
   [[module.imports]]
-    path = "github.com/gethinode/mod-mermaid/v2"
+    path = "github.com/gethinode/mod-mermaid/v3"
   [[module.imports]]
     path = "github.com/gethinode/mod-simple-datatables/v2"
   [[module.imports]]

config/_default/params.toml

@@ -2,9 +2,7 @@
 [main]
     separator = "-"
     description = "Hinode is a clean documentation and blog theme for your Hugo site based on Bootstrap 5."
-    enableDarkMode = true
     enableLanguageSelectionStorage = false
-    modes = ["light", "dark"]
     canonifyAssetsURLs = false
     endorse = true
     footerBelowFold = false
@@ -22,6 +20,12 @@
         tab = false
     [main.build]
         transpiler = "libsass"
+    [main.colorMode]
+        enabled = true
+        modes = ["light", "dark"]
+        toggle = false
+        iconLight = "fas sun"
+        iconDark = "fas moon"
 # toml-docs-end main
 
 # toml-docs-start images
@@ -84,18 +88,29 @@
 [navigation]
     anchor = true
     logo = "/img/logo_icon.svg"
+    logo-height = 30
     color = "body"
     fixed = true
     overlay = false
     overlayMode = "dark"
     horizontal = false
     offset = "5.5rem"
-    search = true
-    searchModal = false
     breadcrumb = true
     toc = true
     sidebar = true
     size = "md"
+    startLevel = 2
+    endLevel = 3
+    maxNumHeadings = 9
+    [navigation.padding]
+        x = 4
+        y = 4
+    [navigation.language]
+        icon = "fas globe"
+    [navigation.search]
+        enabled = true
+        modal = true
+        icon = "fas magnifying-glass"
 # toml-docs-end navigation
 
 # toml-docs-start messages

config/postcss.config.js

@@ -27,9 +27,10 @@ const purgecss = purgeCSSPlugin({
       './assets/scss/theme/fonts.scss',
       './assets/scss/theme/theme.scss',
       './_vendor/github.com/gethinode/mod-cookieyes/v2/assets/scss/cookieyes.scss',
-      './_vendor/github.com/gethinode/mod-flexsearch/v2/assets/scss/modules/flexsearch/flexsearch.scss',
+      './_vendor/github.com/gethinode/mod-flexsearch/v3/assets/scss/modules/flexsearch/flexsearch.scss',
       './_vendor/github.com/gethinode/mod-katex/dist/katex.scss',
       './_vendor/github.com/gethinode/mod-leaflet/dist/leaflet.scss',
+      './_vendor/github.com/gethinode/mod-mermaid/v3/assets/scss/mermaid.scss',
       './_vendor/github.com/gethinode/mod-simple-datatables/v2/dist/simple-datatables.scss',
       './_vendor/github.com/twbs/bootstrap/scss/_carousel.scss',
       './_vendor/github.com/twbs/bootstrap/scss/_dropdown.scss',

content/_index.md

@@ -16,8 +16,8 @@ content_blocks:
       ratio: 16x9
     width: 8
     links:
-      - title: About
-        url: about
+      - title: Getting started
+        url: https://gethinode.com/docs
         icon: fas chevron-right
     orientation: horizontal
     justify: center

content/_modals/_index.md

@@ -0,0 +1,8 @@
+---
+title: Modal elements
+cascade:
+- build:
+    list: local
+    publishResources: false
+    render: never
+---

data/netlify.toml

@@ -4,12 +4,12 @@
     command = "npm run build:example"
 
 [build.environment]
-    DART_SASS_VERSION = "1.83.1"
-    HUGO_VERSION = "0.140.2"
+    DART_SASS_VERSION = "1.89.2"
+    HUGO_VERSION = "0.147.9"
     HUGO_ENV = "production"
     HUGO_ENABLEGITINFO = "true"
-    NODE_VERSION = "22.12.0"
-    NPM_VERSION = "10.9.0"
+    NODE_VERSION = "22.13.0"
+    NPM_VERSION = "10.9.2"
 # toml-docs-end netlify
 
 [context.deploy-preview]

data/structures/card-group.yml

@@ -12,6 +12,7 @@ arguments:
   class:
   color:
   padding:
+    default: 3
   gutter:
     release: v0.19.0
   header-style:
@@ -43,6 +44,7 @@ arguments:
   icon-rounded:
     release: v1.0.0
   align:
+    default: start
   wrapper:
     default: p-0
   responsive:

data/structures/card.yml

@@ -15,6 +15,7 @@ arguments:
     parent: cascade
   padding:
     parent: cascade
+    default: 3
   gutter:
     default: 0
     parent: cascade
@@ -45,6 +46,7 @@ arguments:
   icon-rounded:
     release: v1.0.0
   align:
+    default: start
     parent: cascade
     release: v0.23.0
   scroll:

data/structures/contact.yml

@@ -0,0 +1,36 @@
+comment: >-
+  Displays a contact banner, typically placed at the bottom or right-hand side of the page.
+arguments:
+  page:
+  data:
+  heading:
+  contact:
+    type: string
+    optional: false
+    comment: >-
+      The full name of the contact to retrieve.
+  caption-url:
+    type:
+      - string
+      - template.URL
+    optional: true
+    comment: >-
+      Address of the contact's page, either a local reference or an external
+      address. Include the `scheme` when referencing an external address, such
+      as `https://google.com`. Local references may include an optional anchor
+      link such as `blog/bootstrap-elements/#docs`.
+  illustration:
+  background:
+  link-type:
+  links:
+  align:
+  order:
+    default: first
+  orientation:
+  width:
+  justify:
+  class:
+  width:
+    default: 12
+  hook:
+    default: assets/hero-image.html

data/structures/hero.yml

@@ -3,6 +3,7 @@ comment: >-
   supports a heading, featured illustration, and navigation links. You can
   can also add a background image with an overlay to improve contrast.
 arguments:
+  page:
   breadcrumb:
   heading:
   background:
@@ -18,6 +19,7 @@ arguments:
   justify:
   use-section:
   use-title:
+  size:
   class:
   padding:
     default: px-4 px-xxl-0 py-4

data/structures/nav-item.yml

@@ -15,6 +15,9 @@ arguments:
   class:
   body:
     group: partial
+  raw:
+    group: partial
+    release: v1.3.0
   navitem-type:
     release: v1.0.0
   illustration:

data/structures/nav.yml

@@ -22,6 +22,8 @@ arguments:
     release: v1.0.0
   class:
   pane:
+  responsive:
+    release: v1.4.0
   width:
     default: 12
     group: partial

data/structures/navbar-item.yml

@@ -9,7 +9,9 @@ arguments:
     comment: Context of the current page.
     group: partial
   menu:
-    type: '*navigation.MenuEntry'
+    type:
+      - '*navigation.MenuEntry'
+      - 'map[string]interface {}'
     optional: false
     comment: Menu data to use for the navbar item.
   parent:
@@ -37,3 +39,24 @@ arguments:
     optional: true
     comment: >-
       Renders the navigation item as plain item, ignoring any children.
+  breakpoint:
+    release: v1.2.0
+  modal:
+    type: string
+    optional: true
+    release: v1.2.0
+    comment: >-
+      If set, toggles a modal control for the provided target.
+  id:
+    type: string
+    optional: true
+    release: v1.2.0
+    comment: >-
+      If set, adds an id attribute to the menu item.
+  fs:
+    type: int
+    optional: true
+    default: 6
+    release: v1.2.0
+    comment: >-
+      Sets the font size of the navigation items when the navbar is collapsed.

data/structures/script.yml

@@ -1,6 +1,6 @@
 comment: >-
   Includes a reference to a local or external JavaScript file. Hinode uses the
-  template defined in `layouts/partials/templates/script.html` to generate the
+  template defined in `layouts/_partials/templates/script.html` to generate the
   link to a (bundled) JavaScript file. It includes context such as the state,
   category, and integrity. For example, you can adapt this template to implement
   cookie consent management.
@@ -44,3 +44,10 @@ arguments:
     optional: true
     comment: >-
       Cryptographic hash of the script to enable Subresource Integrity (SRI).
+  script-type:
+    type: string
+    optional: true
+    release: v1.7.0
+    comment: >-
+      Type of the attribute of the script. Set the value to `module` to import
+      the script as a JavaScript module.

data/structures/separator.yml

@@ -1,20 +0,0 @@
-comment: >-
-  Inserts a horizontal page section separator.
-arguments:
-  _bookshop_name:
-    type: string
-    optional: true
-    comment: Unique name of the bookshop component
-    group: partial
-  page:
-    type:
-      - '*hugolib.pageState'
-      - '*hugolib.pageForShortcode'
-    optional: true
-    comment: Context of the current page.
-    group: partial
-  theme:
-    type: string
-    optional: true
-    comment: Color theme to apply.
-    release: v1.0.0-alpha

exampleSite/config/_default/hugo.toml

@@ -115,7 +115,7 @@ home = ["HTML", "RSS", "REDIR", "netlify", "server"]
   [[module.imports]]
     path = "github.com/gethinode/mod-csp"
   [[module.imports]]
-    path = "github.com/gethinode/mod-flexsearch/v2"
+    path = "github.com/gethinode/mod-flexsearch/v3"
   [[module.imports]]
     path = "github.com/gethinode/mod-fontawesome/v2"
   [[module.imports]]

exampleSite/config/_default/params.toml

@@ -1,9 +1,7 @@
 [main]
     separator = "-"
     description = "Hinode is a clean documentation and blog theme for your Hugo site based on Bootstrap 5."
-    enableDarkMode = true
     enableLanguageSelectionStorage = true
-    modes = ["light", "dark"]
     canonifyAssetsURLs = false
     footerBelowFold = false
     loading = "lazy"
@@ -21,6 +19,12 @@
     [main.build]
         transpiler = "dartsass"
         silenceDeprecations = true
+    [main.colorMode]
+        enabled = true
+        modes = ["light", "dark"]
+        toggle = true
+        iconLight = "fas sun"
+        iconDark = "fas moon"
 
 [debugging]
     showJS = false
@@ -37,6 +41,7 @@
 [navigation]
     anchor = true
     logo = "/img/logo_icon.svg"
+    logo-height = 30
     color = "body"
     fixed = true
     overlay = false
@@ -44,12 +49,23 @@
     horizontal = false
     offset = "5.5rem"
     offsetXS = "5.5rem"
-    search = true
-    searchModal = false
     breadcrumb = true
     toc = true
     sidebar = true
     size = "md"
+    fontsizeCollapsed = 6
+    startLevel = 2
+    endLevel = 3
+    maxNumHeadings = 9
+    [navigation.language]
+        icon = "fas globe"
+    [navigation.padding]
+        x = 4
+        y = 4
+    [navigation.search]
+        enabled = true
+        modal = false
+        icon = "fas magnifying-glass"
 
 [messages]
     placement = "bottom-right"
@@ -165,3 +181,6 @@
 
 [modules.cookieyes]
     url = "https://cdn-cookieyes.com/client_data/a54b5553f349dd13bd225f8e/script.js"
+
+[modules.mermaid]
+    elk = true

exampleSite/config/postcss.config.js

@@ -27,9 +27,10 @@ const purgecss = purgeCSSPlugin({
       './assets/scss/theme/fonts.scss',
       './assets/scss/theme/theme.scss',
       './_vendor/github.com/gethinode/mod-cookieyes/v2/assets/scss/cookieyes.scss',
-      './_vendor/github.com/gethinode/mod-flexsearch/v2/assets/scss/modules/flexsearch/flexsearch.scss',
+      './_vendor/github.com/gethinode/mod-flexsearch/v3/assets/scss/modules/flexsearch/flexsearch.scss',
       './_vendor/github.com/gethinode/mod-katex/dist/katex.scss',
       './_vendor/github.com/gethinode/mod-leaflet/dist/leaflet.scss',
+      './_vendor/github.com/gethinode/mod-mermaid/v3/assets/scss/mermaid.scss',
       './_vendor/github.com/gethinode/mod-simple-datatables/v2/dist/simple-datatables.scss',
       './_vendor/github.com/twbs/bootstrap/scss/_carousel.scss',
       './_vendor/github.com/twbs/bootstrap/scss/_dropdown.scss',

exampleSite/content/en/_index.md

@@ -56,6 +56,7 @@ content_blocks:
     cols: 1
     padding: 4
     limit: 2
+    icon-style: fa-5x
     header-style: none
     footer-style: tags
     orientation: horizontal-sm

exampleSite/content/en/blocks/_index.md

@@ -25,9 +25,10 @@ content_blocks:
     more:
       title: More Posts
     cols: 3
-    padding: 0
+    padding: 3
     limit: 9
     paginate: true
     cover: false
     header-style: none
+    class: border-1
 ---

exampleSite/content/en/blocks/cards.md

@@ -24,14 +24,19 @@ The `cards` content block renders a group of content cards.
     subtle: true
   orientation: stacked
   icon-rounded: true
-  class: text-center
+  icon-style: fa-xs
+  padding: 0
+  align: start
   elements:
     - title: First Card
       icon: fas 1
+      content: Content of the first card
     - title: Second Card
       icon: fas 2
+      content: Content of the second card
     - title: Third Card
       icon: fas 3
+      content: Content of the third card
 ```
 
 {{< /example-bookshop >}}
@@ -42,3 +47,145 @@ The `cards` content block renders a group of content cards.
 The content block supports the following arguments:
 
 {{< args bookshop-cards >}}
+
+## Examples
+
+### Stacked cards with an image
+
+Set the `image` attribute of each `element` to an image asset to render illustrated cards.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: stacked
+  class: bg-body
+  align: center
+  elements:
+    - title: First Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+    - title: Second Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+    - title: Third Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Horizontal cards with an image
+
+Set the `orientation` attribute to `horizontal` to render horizontally oriented cards.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: horizontal
+  class: bg-body
+  align: center
+  elements:
+    - title: First Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: Content of the first card
+    - title: Second Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: Content of the second card
+    - title: Third Card
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: Content of the third card
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Stacked cards with an icon
+
+Set the `icon` attribute of each `element` to an icon to render illustrated cards. Adjust the icon's styling with `icon-rounded` and `icon-style`.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: stacked
+  icon-style: fa-xs text-primary
+  align: start
+  padding: 0
+  elements:
+    - title: First Card
+      icon: fas 1
+      content: Content of the first card
+    - title: Second Card
+      icon: fas 2
+      content: Content of the second card
+    - title: Third Card
+      icon: fas 3
+      content: Content of the third card
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Horizontal cards with an icon
+
+Set the `icon` attribute of each `element` to an icon to render illustrated cards. Adjust the icon's styling with `icon-rounded` and `icon-style`.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cards
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Cards content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  orientation: horizontal
+  icon-rounded: true
+  icon-style: fa-2xs text-primary
+  align: start
+  padding: 0
+  elements:
+    - title: First Card
+      icon: fas 1
+      content: Content of the first card
+    - title: Second Card
+      icon: fas 2
+      content: Content of the second card
+    - title: Third Card
+      icon: fas 3
+      content: Content of the third card
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->

exampleSite/content/en/blocks/cta.md

@@ -0,0 +1,36 @@
+---
+_schema: default
+title: CTA
+description: Use the CTA content block to display an action link with an optional contact.
+icon: fas address-card
+---
+
+## Overview
+
+The `cta` content block renders a call to action link or button. You can include an optional contact or provide your own illustration. By default, the `cta` uses a generic title and message. Set the `heading` attribute to override these values.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: cta
+  contact: Betty White
+  caption-url: /en/blocks/cta/
+  background:
+    color: primary
+    subtle: true
+  order: first
+  links:
+    - title: Get in touch
+      url: '#!'
+      icon: fas chevron-right
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+## Arguments
+
+The content block supports the following arguments:
+
+{{< args bookshop-cta >}}

exampleSite/content/en/blocks/panels.md

@@ -0,0 +1,189 @@
+---
+_schema: default
+title: Panels
+description: Use the panels content block to display multiple toggable panels.
+icon: fa folder
+---
+
+## Overview
+
+The `panels` content block displays multiple panels that are toggled by a tab control.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: panels
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Panels content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  width: 12
+  tab-type: underline
+  ratio: 1x1
+  elements:
+    - title: First Panel
+      image: /img/sunrise.jpg
+      content: content 1
+    - title: Second Panel
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: content 2
+    - title: Third Panel
+      image: /img/pj-accetturo-XpD6Dkui-yg-unsplash.jpg
+      content: content 3
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+## Arguments
+
+The content block supports the following arguments:
+
+{{< args bookshop-panels >}}
+
+## Examples
+
+### Tabs
+
+Set `tab-type` to `tabs` to adjust the panel controls.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: panels
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Panels content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  width: 12
+  tab-type: tabs
+  ratio: 1x1
+  elements:
+    - title: First Panel
+      image: /img/sunrise.jpg
+      content: content 1
+    - title: Second Panel
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: content 2
+    - title: Third Panel
+      image: /img/pj-accetturo-XpD6Dkui-yg-unsplash.jpg
+      content: content 3
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Pills
+
+Set `tab-type` to `pills` to adjust the panel controls.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: panels
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Panels content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  width: 12
+  tab-type: pills
+  ratio: 1x1
+  elements:
+    - title: First Panel
+      image: /img/sunrise.jpg
+      content: content 1
+    - title: Second Panel
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: content 2
+    - title: Third Panel
+      image: /img/pj-accetturo-XpD6Dkui-yg-unsplash.jpg
+      content: content 3
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Underline
+
+Set `tab-type` to `underline` to adjust the panel controls.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: panels
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Panels content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  width: 12
+  tab-type: underline
+  ratio: 1x1
+  elements:
+    - title: First Panel
+      image: /img/sunrise.jpg
+      content: content 1
+    - title: Second Panel
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: content 2
+    - title: Third Panel
+      image: /img/pj-accetturo-XpD6Dkui-yg-unsplash.jpg
+      content: content 3
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->
+
+### Callout
+
+Set `tab-type` to `callout` to adjust the panel controls.
+
+<!-- markdownlint-disable MD037 -->
+{{< example-bookshop lang="bookshop" >}}
+
+```yml
+- _bookshop_name: panels
+  heading:
+    preheading: Preheading
+    title: Heading
+    content: Panels content. It supports multiple lines.
+    align: start
+  background:
+    color: primary
+    subtle: true
+  width: 12
+  tab-type: callout
+  ratio: 1x1
+  elements:
+    - title: First Panel
+      image: /img/sunrise.jpg
+      content: content 1
+    - title: Second Panel
+      image: /img/nat-9l98kFByiao-unsplash.jpg
+      content: content 2
+    - title: Third Panel
+      image: /img/pj-accetturo-XpD6Dkui-yg-unsplash.jpg
+      content: content 3
+```
+
+{{< /example-bookshop >}}
+<!-- markdownlint-enable MD037 -->

exampleSite/content/en/blocks/video-message.md

@@ -24,10 +24,12 @@ The `video` content block renders a horizontal line to separate sections. The se
     color: primary
     subtle: true
   orientation: horizontal
+  icon-style: fa-lg
   video:
     provider: vimeo
     media-id: "55073825"
     autoplay: true
+    color: black
   messages:
     - title: First Message
       icon: fas 1

exampleSite/content/en/blog/components.md

@@ -4,7 +4,7 @@ title: Components
 date: 2023-09-23
 description: Use shortcodes to add predefined components powered by external libraries.
 tags: ["bootstrap", "shortcode"]
-keywords: ["featured"]
+keywords: featured
 thumbnail:
   url: img/puzzle.jpg
   author: Ryoji Iwata
@@ -94,6 +94,22 @@ As an example, the following shortcode displays an interactive map of the city o
 
 ## Mermaid Diagrams
 
+### Shortcode (with controls and frontmatter)
+
+<!-- markdownlint-disable MD003 MD022 -->
+{{< mermaid controls=true >}}
+---
+config:
+  layout: elk.stress
+  look: handDrawn
+  theme: forest
+---
+flowchart TD
+  A --> B
+  A --> C
+{{< /mermaid >}}
+<!-- markdownlint-enable MD003 MD022 -->
+
 ### Flowchart
 
 ```mermaid

exampleSite/content/en/blog/content-blocks.md

@@ -4,7 +4,7 @@ title: Content blocks
 date: 2025-06-07
 description: Quickly edit your webpages using reusable content blocks.
 tags: ["bookshop", "blocks"]
-keywords: ["featured"]
+keywords: featured
 thumbnail:
   url: img/pj-accetturo-XpD6Dkui-yg-unsplash.jpg
   author: Pj Accetturo

exampleSite/content/fr/_index.md

@@ -2,14 +2,63 @@
 author: Mark Dumay
 title: Bienvenue sur Hinode!
 description: Un thème de blog et de documentation pour Hugo basé sur Bootstrap 5.
-thumbnail:
-  url: /img/sunrise.jpg
-  author: Harris Vo
-  authorURL: https://unsplash.com/@hoanvokim
-  origin: https://unsplash.com/photos/ZX6BPboJrYk
-  originName: Unsplash
-actions:
-  about:
-    url: "a-propos"
-    title: "À propos"
+content_blocks:
+  - _bookshop_name: hero
+    heading:
+      title: Bienvenue sur Hinode!
+      content: |-
+        Un thème de blog et de documentation pour Hugo basé sur Bootstrap 5.
+      width: 6
+    background:
+      color: primary
+      subtle: true
+    illustration:
+      image: /img/sunrise.jpg
+      ratio: 16x9
+    width: 8
+    links:
+      - title: À propos
+        url: "/fr/a-propos/"
+        icon: fas chevron-right
+    orientation: horizontal
+    justify: center
+
+  - _bookshop_name: articles
+    heading:
+      title: Articles de blog
+      align: start
+    input:
+      section: blog
+      reverse: true
+      sort: date
+      keywords: featured
+    hide-empty: false
+    header-style: none
+    more:
+      title: Plus d'articles
+    padding: 0
+    limit: 3
+    class: border-0 card-zoom card-body-margin
+
+  - _bookshop_name: articles
+    heading:
+      title: Projets
+      align: start
+    background:
+      background: body-tertiary
+    hide-empty: false
+    input:
+      section: projects
+      reverse: false
+      sort: date
+    more:
+      title: Plus d'articles
+    cols: 1
+    padding: 4
+    limit: 2
+    icon-style: fa-5x
+    header-style: none
+    footer-style: tags
+    orientation: horizontal-sm
+    class: border-1 card-emphasize
 ---

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

@@ -5,6 +5,7 @@ slug: elements-bootstrap
 date: 2023-08-12
 description: Utilisez des shortcodes pour ajouter facilement des éléments Bootstrap courants.
 tags: ["bootstrap", "shortcode"]
+keywords: featured
 thumbnail:
   url: img/boots.jpg
   author: Nathan Dumlao

exampleSite/content/fr/blog/components.md

@@ -5,6 +5,7 @@ slug: composents
 date: 2023-07-21
 description: Utilisez des shortcodes pour ajouter des composants prédéfinis alimentés par des bibliothèques externes.
 tags: ["bootstrap", "shortcode"]
+keywords: featured
 thumbnail:
   url: img/puzzle.jpg
   author: Ryoji Iwata

exampleSite/content/fr/blog/image.md

@@ -4,6 +4,7 @@ title: Images locales et distantes
 date: 2024-05-19
 description: Inclure des images responsives provenant de sources locales et de certains fournisseurs de CDN d'images.
 tags: ["blog"]
+keywords: featured
 thumbnail:
   url: https://assets.imgix.net/examples/bluehat.jpg
 ---

exampleSite/content/nl/_index.md

@@ -2,14 +2,62 @@
 author: Mark Dumay
 title: Welkom bij Hinode!
 description: Een documentatie en blog thema voor Hugo gebaseerd op Bootstrap 5.
-thumbnail:
-    url: /img/sunrise.jpg
-    author: Harris Vo
-    authorURL: https://unsplash.com/@hoanvokim
-    origin: https://unsplash.com/photos/ZX6BPboJrYk
-    originName: Unsplash
-actions:
-  about:
-    url: "over-mij"
-    title: "Over mij"
+content_blocks:
+  - _bookshop_name: hero
+    heading:
+      title: Welkom bij Hinode!
+      content: |-
+        Een documentatie en blog thema voor Hugo gebaseerd op Bootstrap 5.
+      width: 6
+    background:
+      color: primary
+      subtle: true
+    illustration:
+      image: /img/sunrise.jpg
+      ratio: 16x9
+    width: 8
+    links:
+      - title: "Over mij"
+        url: "/nl/over-mij/"
+        icon: fas chevron-right
+    orientation: horizontal
+    justify: center
+
+  - _bookshop_name: articles
+    heading:
+      title: Blog
+      align: start
+    input:
+      section: blog
+      reverse: true
+      sort: date
+    hide-empty: false
+    header-style: none
+    more:
+      title: Meer artikelen
+    padding: 0
+    limit: 3
+    class: border-0 card-zoom card-body-margin
+
+  - _bookshop_name: articles
+    heading:
+      title: Projecten
+      align: start
+    background:
+      background: body-tertiary
+    hide-empty: false
+    input:
+      section: projects
+      reverse: false
+      sort: date
+    more:
+      title: Meer artikelen
+    cols: 1
+    padding: 4
+    limit: 2
+    icon-style: fa-5x
+    header-style: none
+    footer-style: tags
+    orientation: horizontal-sm
+    class: border-1 card-emphasize
 ---

exampleSite/data/contacts.en.yml

@@ -0,0 +1,45 @@
+- name: Alex Smith
+  preferred: Alex
+  image: /assets/img/joseph-gonzalez-iFgRcqHznqg-unsplash.png
+  function: Digital Strategy Lead
+  linkedin: https://www.linkedin.com
+  keywords:
+    - transformation
+  biography: >-
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut accumsan
+    venenatis dapibus. Proin placerat mauris ac interdum gravida. Proin
+    consequat feugiat sagittis. Sed vel augue nec est auctor semper. Curabitur
+    mauris ante, euismod eu sem in, sagittis porttitor urna. Mauris sodales at
+    quam condimentum malesuada. Vivamus erat augue, euismod nec ligula quis,
+    molestie lobortis ante. Proin venenatis non diam ac interdum.
+
+- name: Betty White
+  preferred: Betty
+  image: /assets/img/jake-nackos-IF9TK5Uy-KI-unsplash.png
+  function: UX Expert
+  linkedin: https://www.linkedin.com
+  keywords:
+    - experience
+  biography: >-
+    Duis rutrum, justo eleifend sagittis facilisis, leo orci hendrerit elit, ac
+    tristique nisl justo non neque. Mauris semper egestas massa, nec dapibus ex
+    tincidunt nec. Quisque lectus quam, finibus sed hendrerit id, accumsan eget
+    sapien. Nam facilisis diam eu felis tempus euismod. Nullam id neque
+    fringilla purus vestibulum mattis elementum vitae lectus. Fusce vel libero
+    consectetur urna egestas molestie eget sit amet elit.
+
+- name: Charles Green
+  preferred: Charles
+  image: /assets/img/foto-sushi-6anudmpILw4-unsplash-1x1.png
+  function: UX Expert
+  linkedin: https://www.linkedin.com
+  keywords:
+    - technology
+    - transformation
+    - experience
+  biography: >-
+    Suspendisse potenti. Aenean elit nisl, viverra eu volutpat at, sodales a sem.
+    Aliquam blandit nunc non mi posuere, quis laoreet ex congue. Donec fringilla
+    porttitor lacus accumsan porttitor. Integer vel sagittis diam. Nullam vehicula
+    fermentum risus nec facilisis. Fusce eleifend gravida orci, in efficitur enim
+    fermentum nec. Sed quis malesuada lorem. Ut vitae sodales sapien.

exampleSite/go.mod

@@ -3,5 +3,5 @@ module github.com/gethinode/hinode/exampleSite
 go 1.19
 
 require (
-	github.com/gethinode/mod-cookieyes/v2 v2.2.4 // indirect
+	github.com/gethinode/mod-cookieyes/v2 v2.2.5 // indirect
 )

exampleSite/go.sum

@@ -1,2 +1,2 @@
-github.com/gethinode/mod-cookieyes/v2 v2.2.4 h1:MxKKNSpX2cb9+4l3mH/xfZUqiJ1buaGLj0AFRnPci5M=
-github.com/gethinode/mod-cookieyes/v2 v2.2.4/go.mod h1:tULb7D7CoTycGUyL7ryqHJKaX11XuL2SN+XwP7/DI0Y=
+github.com/gethinode/mod-cookieyes/v2 v2.2.5 h1:xzTQ42qYViZ/LJJUHAEeDV9aayXVEX4MtnpS+m5Zekc=
+github.com/gethinode/mod-cookieyes/v2 v2.2.5/go.mod h1:tULb7D7CoTycGUyL7ryqHJKaX11XuL2SN+XwP7/DI0Y=

exampleSite/hugo_stats.json

@@ -14,6 +14,7 @@
       "figure",
       "footer",
       "form",
+      "h1",
       "h2",
       "h3",
       "head",
@@ -69,7 +70,6 @@
     ],
     "classes": [
       "%!s(<nil>)",
-      "%!s(MISSING)",
       "about",
       "accordion",
       "accordion-body",
@@ -89,14 +89,15 @@
       "align-middle",
       "align-self-center",
       "align-self-end",
+      "align-self-start",
       "anchor",
       "articles",
       "background-container",
       "background-img-fluid",
       "badge",
-      "ball",
       "bg-bg-body-tertiary",
       "bg-bg-primary-subtle",
+      "bg-black",
       "bg-body",
       "bg-body-tertiary",
       "bg-danger",
@@ -109,9 +110,7 @@
       "border-0",
       "border-1",
       "border-bottom",
-      "border-end",
       "border-none",
-      "border-start",
       "border-top",
       "bottom-0",
       "bottom-bar",
@@ -143,6 +142,7 @@
       "card-icon-primary",
       "card-icon-secondary",
       "card-img-bg",
+      "card-img-h100",
       "card-img-top",
       "card-img-wrap",
       "card-text",
@@ -171,6 +171,7 @@
       "col-6",
       "col-8",
       "col-9",
+      "col-auto",
       "col-lg-2",
       "col-lg-4",
       "col-lg-8",
@@ -188,9 +189,16 @@
       "col-sm-6",
       "collapse",
       "collapsed",
+      "command",
+      "contact-img",
       "container",
       "container-fluid",
       "container-xxl",
+      "control-btn",
+      "control-btn-expand",
+      "control-btn-zoom-in",
+      "control-btn-zoom-out",
+      "cta",
       "custom",
       "d-block",
       "d-flex",
@@ -207,9 +215,16 @@
       "d-sm-block",
       "d-sm-none",
       "data-table",
+      "diagram-container",
+      "diagram-controls",
+      "diagram-wrapper",
       "disabled",
       "display-1",
       "display-4",
+      "display-6",
+      "docs",
+      "docs-controls",
+      "docs-panel",
       "dropdown",
       "dropdown-divider-bg",
       "dropdown-item",
@@ -226,9 +241,13 @@
       "fa-2xs",
       "fa-3",
       "fa-4x",
+      "fa-5x",
       "fa-activity",
       "fa-address-card",
       "fa-angle-left",
+      "fa-angle-right",
+      "fa-angles-left",
+      "fa-angles-right",
       "fa-arrow-left",
       "fa-arrow-right",
       "fa-bootstrap",
@@ -241,9 +260,11 @@
       "fa-divide",
       "fa-docker",
       "fa-ellipsis",
+      "fa-expand",
       "fa-face-frown",
       "fa-facebook",
       "fa-fluid",
+      "fa-folder",
       "fa-fw",
       "fa-github",
       "fa-globe",
@@ -253,9 +274,12 @@
       "fa-house",
       "fa-info",
       "fa-inverse",
+      "fa-lg",
       "fa-link",
       "fa-linkedin",
       "fa-magnifying-glass",
+      "fa-magnifying-glass-minus",
+      "fa-magnifying-glass-plus",
       "fa-medium",
       "fa-moon",
       "fa-rocket",
@@ -272,11 +296,16 @@
       "fa-whatsapp",
       "fa-wrapper",
       "fa-x-twitter",
+      "fa-xl",
+      "fa-xs",
       "fab",
       "fade",
       "faq",
       "fas",
       "figure-caption",
+      "file",
+      "file-controls",
+      "file-panel",
       "fixed-top",
       "flex-column",
       "flex-fill",
@@ -301,10 +330,8 @@
       "g-4",
       "gap-1",
       "gap-2",
-      "gap-4",
       "gap-5",
       "gradient",
-      "grid",
       "h-100",
       "h1",
       "h2",
@@ -342,24 +369,28 @@
       "lottie-animation",
       "m-0",
       "m-auto",
-      "m-md-n4",
       "m-n1",
       "main",
       "main-nav-toggler",
       "mb-0",
+      "mb-1",
       "mb-3",
       "mb-4",
       "mb-5",
       "mb-lg-5",
+      "me-1",
       "me-3",
       "me-auto",
+      "me-md-3",
       "mermaid",
       "middle-bar",
-      "mode-switch",
+      "mode-item",
+      "mode-toggle",
       "ms-1",
       "ms-3",
       "ms-auto",
       "ms-md-3",
+      "mt-1",
       "mt-2",
       "mt-3",
       "mt-4",
@@ -372,16 +403,21 @@
       "mx-auto",
       "mx-md-0",
       "mx-md-2",
+      "mx-md-n4",
       "my-2",
       "my-4",
       "my-auto",
       "my-md-0",
       "my-md-auto",
+      "my-md-n4",
       "nav",
+      "nav-callout",
       "nav-item",
       "nav-link",
+      "nav-panel",
       "nav-pills",
       "nav-tabs",
+      "nav-underline",
       "navbar",
       "navbar-brand",
       "navbar-collapse",
@@ -389,6 +425,8 @@
       "navbar-contrast",
       "navbar-expand-md",
       "navbar-fixed-top",
+      "navbar-fs-6",
+      "navbar-md-fs",
       "navbar-mode-selector",
       "navbar-nav",
       "navbar-nav-scroll",
@@ -405,7 +443,12 @@
       "p-2",
       "p-3",
       "p-4",
-      "p-md-4",
+      "page-item",
+      "page-link",
+      "pagination",
+      "pagination-terse",
+      "panel-dropdown",
+      "panels",
       "pb-3",
       "pb-4",
       "pb-5",
@@ -430,14 +473,19 @@
       "ptw-5",
       "ptw-lg-5",
       "ptw-sm-4",
+      "px-%!d(string=0)",
       "px-2",
+      "px-3",
       "px-4",
+      "px-md-4",
       "px-xxl-0",
+      "py-%!d(string=0)",
       "py-1",
       "py-2",
       "py-3",
       "py-4",
       "py-md-1",
+      "py-md-4",
       "ratio",
       "ratio-16x9",
       "releases",
@@ -446,6 +494,7 @@
       "rounded-5",
       "rounded-bottom",
       "rounded-pill",
+      "rounded-start",
       "rounded-top",
       "row",
       "row-cols-1",
@@ -480,6 +529,7 @@
       "table-border-bottom-wrap",
       "table-responsive-md",
       "table-wrap",
+      "tabs-dropdown",
       "tag-link",
       "text-",
       "text-bg-body-tertiary",
@@ -511,6 +561,7 @@
       "timeline-bg-primary-subtle",
       "timeline-connector-end",
       "timeline-connector-start",
+      "timeline-container",
       "timeline-description-text-end",
       "timeline-description-text-start",
       "timeline-dot",
@@ -566,9 +617,11 @@
       "animation",
       "args",
       "arguments",
+      "articles-de-blog",
       "background-type",
       "badge",
       "barre-de-navigation",
+      "bienvenue-sur-hinode",
       "block-diagram",
       "blog",
       "body-docs-collapse-15",
@@ -576,9 +629,12 @@
       "body-file-collapse-1",
       "bouton",
       "breadcrumb",
+      "btnTOCShowLess",
+      "btnTOCShowMore",
       "button",
       "button-group",
       "c4-diagram",
+      "callout",
       "card",
       "card-group",
       "carousel",
@@ -600,12 +656,25 @@
       "data-tables",
       "docs",
       "documentation",
+      "dropdown-nav-0",
+      "dropdown-panel-0692e7e68c57d91164039f0f77cce9d8",
+      "dropdown-panel-0a5cb51ed9eea57f673dc25545175b8b",
+      "dropdown-panel-41fccc8aa490d4ea9d475a6d2d44be42",
+      "dropdown-panel-7aa9804adc5998a7a66cd8faf656c6f9",
+      "dropdown-panel-99dcbfb73d35cee704ca4ee9fb6a5e3c",
+      "dropdown-panel-b06517abb515d4c22a03ca07d577f3de",
+      "dropdown-panel-b434a05f655e7811ee71b4177747a1c0",
+      "dropdown-panel-ba696faaa3c3f34bebc3f1da67a7c8ad",
+      "dropdown-panel-d80f75f98e8a44fe4164fa76a6afd600",
+      "dropdown-panel-d8bdd6a5f6d88907f9d6e8b57d921196",
       "elements-type",
       "entity-relationship-diagram",
       "example",
+      "examples",
       "exemple",
       "fa-address-card",
       "fa-face-frown",
+      "fa-folder",
       "fa-square-check",
       "fab-bootstrap",
       "fab-docker",
@@ -615,20 +684,24 @@
       "fab-medium",
       "fab-whatsapp",
       "fab-x-twitter",
-      "faq-0a7097f76883a213c55ec2c34a30493c",
-      "faq-0a7097f76883a213c55ec2c34a30493c-heading-faq-0a7097f76883a213c55ec2c34a30493c",
-      "faq-0a7097f76883a213c55ec2c34a30493c-item-0",
-      "faq-0a7097f76883a213c55ec2c34a30493c-item-1",
-      "faq-0a7097f76883a213c55ec2c34a30493c-item-2",
-      "faq-f7b9efada37955325b04f32aa6566814",
-      "faq-f7b9efada37955325b04f32aa6566814-heading-faq-f7b9efada37955325b04f32aa6566814",
-      "faq-f7b9efada37955325b04f32aa6566814-item-0",
-      "faq-f7b9efada37955325b04f32aa6566814-item-1",
-      "faq-f7b9efada37955325b04f32aa6566814-item-2",
+      "faq-1b8aefa895c57fc4fd5452748485b590",
+      "faq-1b8aefa895c57fc4fd5452748485b590-heading-faq-1b8aefa895c57fc4fd5452748485b590",
+      "faq-1b8aefa895c57fc4fd5452748485b590-item-0",
+      "faq-1b8aefa895c57fc4fd5452748485b590-item-1",
+      "faq-1b8aefa895c57fc4fd5452748485b590-item-2",
+      "faq-f18dc8d82722290aea32dc7f4423dea5",
+      "faq-f18dc8d82722290aea32dc7f4423dea5-heading-faq-f18dc8d82722290aea32dc7f4423dea5",
+      "faq-f18dc8d82722290aea32dc7f4423dea5-item-0",
+      "faq-f18dc8d82722290aea32dc7f4423dea5-item-1",
+      "faq-f18dc8d82722290aea32dc7f4423dea5-item-2",
       "fas-1",
       "fas-2",
       "fas-3",
+      "fas-address-card",
       "fas-angle-left",
+      "fas-angle-right",
+      "fas-angles-left",
+      "fas-angles-right",
       "fas-arrow-left",
       "fas-arrow-right",
       "fas-chevron-right",
@@ -639,6 +712,7 @@
       "fas-code",
       "fas-divide",
       "fas-ellipsis",
+      "fas-expand",
       "fas-globe",
       "fas-grip",
       "fas-h",
@@ -647,6 +721,8 @@
       "fas-info",
       "fas-link",
       "fas-magnifying-glass",
+      "fas-magnifying-glass-minus",
+      "fas-magnifying-glass-plus",
       "fas-moon",
       "fas-rocket",
       "fas-share-nodes",
@@ -657,6 +733,7 @@
       "fichier",
       "fil-dariane",
       "file",
+      "first-panel",
       "flowchart",
       "footer-docs-collapse-15",
       "footer-docs-collapse-16",
@@ -671,6 +748,8 @@
       "gérer-les-préférences-des-cookies",
       "heading",
       "heading-type",
+      "horizontal-cards-with-an-icon",
+      "horizontal-cards-with-an-image",
       "how-do-we-use-cookies",
       "how-we-share-your-information",
       "icon",
@@ -682,6 +761,7 @@
       "infobulle",
       "input-type",
       "ins",
+      "interested-in-this-topic",
       "invite-de-commandes",
       "items-type",
       "kaart",
@@ -708,6 +788,16 @@
       "nav-0-btn-1",
       "nav-0-btn-2",
       "nav-nav-0",
+      "nav-panel-0692e7e68c57d91164039f0f77cce9d8",
+      "nav-panel-0a5cb51ed9eea57f673dc25545175b8b",
+      "nav-panel-41fccc8aa490d4ea9d475a6d2d44be42",
+      "nav-panel-7aa9804adc5998a7a66cd8faf656c6f9",
+      "nav-panel-99dcbfb73d35cee704ca4ee9fb6a5e3c",
+      "nav-panel-b06517abb515d4c22a03ca07d577f3de",
+      "nav-panel-b434a05f655e7811ee71b4177747a1c0",
+      "nav-panel-ba696faaa3c3f34bebc3f1da67a7c8ad",
+      "nav-panel-d80f75f98e8a44fe4164fa76a6afd600",
+      "nav-panel-d8bdd6a5f6d88907f9d6e8b57d921196",
       "navbar",
       "navbar-0-collapse",
       "navbar-mode",
@@ -716,8 +806,69 @@
       "navigation",
       "notification",
       "overview",
+      "panel-0692e7e68c57d91164039f0f77cce9d8-0",
+      "panel-0692e7e68c57d91164039f0f77cce9d8-1",
+      "panel-0692e7e68c57d91164039f0f77cce9d8-2",
+      "panel-0692e7e68c57d91164039f0f77cce9d8-btn-0",
+      "panel-0692e7e68c57d91164039f0f77cce9d8-btn-1",
+      "panel-0692e7e68c57d91164039f0f77cce9d8-btn-2",
+      "panel-0a5cb51ed9eea57f673dc25545175b8b-0",
+      "panel-0a5cb51ed9eea57f673dc25545175b8b-1",
+      "panel-0a5cb51ed9eea57f673dc25545175b8b-2",
+      "panel-0a5cb51ed9eea57f673dc25545175b8b-btn-0",
+      "panel-0a5cb51ed9eea57f673dc25545175b8b-btn-1",
+      "panel-0a5cb51ed9eea57f673dc25545175b8b-btn-2",
+      "panel-41fccc8aa490d4ea9d475a6d2d44be42-0",
+      "panel-41fccc8aa490d4ea9d475a6d2d44be42-1",
+      "panel-41fccc8aa490d4ea9d475a6d2d44be42-2",
+      "panel-41fccc8aa490d4ea9d475a6d2d44be42-btn-0",
+      "panel-41fccc8aa490d4ea9d475a6d2d44be42-btn-1",
+      "panel-41fccc8aa490d4ea9d475a6d2d44be42-btn-2",
+      "panel-7aa9804adc5998a7a66cd8faf656c6f9-0",
+      "panel-7aa9804adc5998a7a66cd8faf656c6f9-1",
+      "panel-7aa9804adc5998a7a66cd8faf656c6f9-2",
+      "panel-7aa9804adc5998a7a66cd8faf656c6f9-btn-0",
+      "panel-7aa9804adc5998a7a66cd8faf656c6f9-btn-1",
+      "panel-7aa9804adc5998a7a66cd8faf656c6f9-btn-2",
+      "panel-99dcbfb73d35cee704ca4ee9fb6a5e3c-0",
+      "panel-99dcbfb73d35cee704ca4ee9fb6a5e3c-1",
+      "panel-99dcbfb73d35cee704ca4ee9fb6a5e3c-2",
+      "panel-99dcbfb73d35cee704ca4ee9fb6a5e3c-btn-0",
+      "panel-99dcbfb73d35cee704ca4ee9fb6a5e3c-btn-1",
+      "panel-99dcbfb73d35cee704ca4ee9fb6a5e3c-btn-2",
+      "panel-b06517abb515d4c22a03ca07d577f3de-0",
+      "panel-b06517abb515d4c22a03ca07d577f3de-1",
+      "panel-b06517abb515d4c22a03ca07d577f3de-2",
+      "panel-b06517abb515d4c22a03ca07d577f3de-btn-0",
+      "panel-b06517abb515d4c22a03ca07d577f3de-btn-1",
+      "panel-b06517abb515d4c22a03ca07d577f3de-btn-2",
+      "panel-b434a05f655e7811ee71b4177747a1c0-0",
+      "panel-b434a05f655e7811ee71b4177747a1c0-1",
+      "panel-b434a05f655e7811ee71b4177747a1c0-2",
+      "panel-b434a05f655e7811ee71b4177747a1c0-btn-0",
+      "panel-b434a05f655e7811ee71b4177747a1c0-btn-1",
+      "panel-b434a05f655e7811ee71b4177747a1c0-btn-2",
+      "panel-ba696faaa3c3f34bebc3f1da67a7c8ad-0",
+      "panel-ba696faaa3c3f34bebc3f1da67a7c8ad-1",
+      "panel-ba696faaa3c3f34bebc3f1da67a7c8ad-2",
+      "panel-ba696faaa3c3f34bebc3f1da67a7c8ad-btn-0",
+      "panel-ba696faaa3c3f34bebc3f1da67a7c8ad-btn-1",
+      "panel-ba696faaa3c3f34bebc3f1da67a7c8ad-btn-2",
+      "panel-d80f75f98e8a44fe4164fa76a6afd600-0",
+      "panel-d80f75f98e8a44fe4164fa76a6afd600-1",
+      "panel-d80f75f98e8a44fe4164fa76a6afd600-2",
+      "panel-d80f75f98e8a44fe4164fa76a6afd600-btn-0",
+      "panel-d80f75f98e8a44fe4164fa76a6afd600-btn-1",
+      "panel-d80f75f98e8a44fe4164fa76a6afd600-btn-2",
+      "panel-d8bdd6a5f6d88907f9d6e8b57d921196-0",
+      "panel-d8bdd6a5f6d88907f9d6e8b57d921196-1",
+      "panel-d8bdd6a5f6d88907f9d6e8b57d921196-2",
+      "panel-d8bdd6a5f6d88907f9d6e8b57d921196-btn-0",
+      "panel-d8bdd6a5f6d88907f9d6e8b57d921196-btn-1",
+      "panel-d8bdd6a5f6d88907f9d6e8b57d921196-btn-2",
       "persona",
       "pie-chart",
+      "pills",
       "projecten",
       "projects",
       "projets",
@@ -727,14 +878,20 @@
       "release",
       "requirement-chart",
       "réduire",
+      "second-panel",
       "security",
       "sequence-diagram",
+      "shortcode-with-controls-and-frontmatter",
       "spinner",
+      "stacked-cards-with-an-icon",
+      "stacked-cards-with-an-image",
       "state-diagram",
       "sub",
       "sup",
       "sécurité",
       "table",
+      "tabs",
+      "third-panel",
       "third-party-links--use-of-your-information",
       "timeline",
       "title",
@@ -745,15 +902,18 @@
       "toast-example-2",
       "toast-message-email-4",
       "toc-collapse",
+      "toc-collapse-items",
       "tooltip",
       "types-de-cookies-que-nous-utilisons",
       "types-of-cookies-we-use",
+      "underline",
       "user-journey",
       "video",
       "video-type",
       "vidéo",
       "vos-droits",
       "welcome-to-hinode",
+      "welkom-bij-hinode",
       "what-are-cookies",
       "xy-chart",
       "your-rights"

exampleSite/layouts/_partials/templates/script.html

@@ -0,0 +1,31 @@
+{{/* 
+    Copyright © 2022 - 2025 The Hinode Team / Mark Dumay. All rights reserved.
+    Use of this source code is governed by The MIT License (MIT) that can be found in the LICENSE file.
+    Visit gethinode.com/license for more details.
+*/}}
+
+<!-- TODO: this partial is not properly mounted for the exampleSite, possibly a bug with Hugo -->
+
+{{/* Initialize arguments */}}
+{{- $args := partial "utilities/InitArgs.html" (dict "structure" "script" "args" .) -}}
+{{- if or $args.err $args.warnmsg -}}
+    {{- partial (cond $args.err "utilities/LogErr.html" "utilities/LogWarn.html") (dict 
+        "partial" "templates/script.html" 
+        "warnid"  "warn-invalid-arguments"
+        "msg"     "Invalid arguments"
+        "details" ($args.errmsg | append $args.warnmsg)
+        "file"    page.File
+    ) -}}
+{{- end -}}
+
+{{/* Initialize local arguments */}}
+{{- $category := cond (ne $args.category "other") $args.category "" -}}
+
+{{/* Main code */}}
+{{- if not $args.err -}}
+    <script src="{{ $args.link }}"
+        {{- with $args.scriptType }}{{ printf ` type="%s"` . | safeHTMLAttr }}{{ end -}}
+        {{- with $category }} data-category="{{ . }}"{{ end -}}
+        {{- with $args.integrity }} integrity="{{ . }}" crossorigin="anonymous"{{ end }}
+        {{- with $args.state }} {{ . | safeHTMLAttr }}{{ end -}}></script>
+{{- end -}}

go.mod

@@ -3,22 +3,19 @@ module github.com/gethinode/hinode
 go 1.19
 
 require (
-	github.com/airbnb/lottie-web v5.12.2+incompatible // indirect
-	github.com/cloudcannon/bookshop/hugo/v3 v3.16.1 // indirect
-	github.com/gethinode/mod-bootstrap v1.3.3 // indirect
-	github.com/gethinode/mod-csp v1.0.7 // indirect
-	github.com/gethinode/mod-flexsearch/v2 v2.1.1 // indirect
-	github.com/gethinode/mod-fontawesome/v2 v2.1.1 // indirect
-	github.com/gethinode/mod-google-analytics v1.3.2 // indirect
-	github.com/gethinode/mod-katex v1.1.3 // indirect
-	github.com/gethinode/mod-leaflet v1.3.0 // indirect
-	github.com/gethinode/mod-lottie v1.6.0 // indirect
-	github.com/gethinode/mod-mermaid v1.1.23 // indirect
-	github.com/gethinode/mod-mermaid/v2 v2.0.1 // indirect
-	github.com/gethinode/mod-simple-datatables v1.1.7 // indirect
-	github.com/gethinode/mod-simple-datatables/v2 v2.0.1 // indirect
-	github.com/gethinode/mod-utils/v3 v3.3.1 // indirect
-	github.com/gethinode/mod-utils/v4 v4.8.4 // indirect
-	github.com/nextapps-de/flexsearch v0.0.0-20250606060143-c28f52c09b7a // indirect
-	github.com/twbs/bootstrap v5.3.7+incompatible // indirect
+	github.com/airbnb/lottie-web v5.13.0+incompatible // indirect
+	github.com/cloudcannon/bookshop/hugo/v3 v3.16.4 // indirect
+	github.com/gethinode/mod-bootstrap v1.3.4 // indirect
+	github.com/gethinode/mod-csp v1.0.8 // indirect
+	github.com/gethinode/mod-flexsearch/v3 v3.0.0 // indirect
+	github.com/gethinode/mod-fontawesome/v2 v2.1.2 // indirect
+	github.com/gethinode/mod-google-analytics v1.3.3 // indirect
+	github.com/gethinode/mod-katex v1.1.4 // indirect
+	github.com/gethinode/mod-leaflet v1.3.1 // indirect
+	github.com/gethinode/mod-lottie v1.6.1 // indirect
+	github.com/gethinode/mod-mermaid/v3 v3.0.1 // indirect
+	github.com/gethinode/mod-simple-datatables/v2 v2.0.2 // indirect
+	github.com/gethinode/mod-utils/v4 v4.14.0 // indirect
+	github.com/nextapps-de/flexsearch v0.0.0-20250901122457-99cddafcdc64 // indirect
+	github.com/twbs/bootstrap v5.3.8+incompatible // indirect
 )

go.sum

@@ -1,11 +1,17 @@
 github.com/airbnb/lottie-web v5.12.2+incompatible h1:Ldogtlhiucf7mMsgisyxSBY0qunV44+lpa9Icy2KoQc=
 github.com/airbnb/lottie-web v5.12.2+incompatible/go.mod h1:nTss557UK9FGnp8QYlCMO29tjUHwbdAHG/DprbGfHGE=
+github.com/airbnb/lottie-web v5.13.0+incompatible h1:plBV5Uq/F1kK0EC61Hr0cBGReI9OgUfd/pp0baoDX8o=
+github.com/airbnb/lottie-web v5.13.0+incompatible/go.mod h1:nTss557UK9FGnp8QYlCMO29tjUHwbdAHG/DprbGfHGE=
 github.com/cloudcannon/bookshop/hugo/v3 v3.14.0 h1:QNLtpTINvXkxAG/RQVpdXzxtFjG6YAmnBr7qbOD5GF8=
 github.com/cloudcannon/bookshop/hugo/v3 v3.14.0/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.0 h1:Fb76ABHqTyPl9Z2QqYJCwiMBKPyShOe1EnZxXzW3RVo=
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.0/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.1 h1:WByz6rqg28h94VLVLscu77/CHhi2peig/LqrnVomX0Y=
 github.com/cloudcannon/bookshop/hugo/v3 v3.16.1/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
+github.com/cloudcannon/bookshop/hugo/v3 v3.16.3 h1:/Z66xKILl1SNGQePHZCnxo6vFgED7AGI600OSPotXj4=
+github.com/cloudcannon/bookshop/hugo/v3 v3.16.3/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
+github.com/cloudcannon/bookshop/hugo/v3 v3.16.4 h1:k233xdD3ydE6iN8QB+c37//rSsFVtLIo5OUNRN4E3bc=
+github.com/cloudcannon/bookshop/hugo/v3 v3.16.4/go.mod h1:s7mIonDhtsLcn10ZKuVXyqd6BDHI8vT1WQhZw8rPfY8=
 github.com/gethinode/mod-bootstrap v1.0.1 h1:NDZar+UEL42YHCvzzO+jVgqkZU5INA12BpjX3y6U4I4=
 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=
@@ -34,6 +40,8 @@ github.com/gethinode/mod-bootstrap v1.3.2 h1:mf9Qgr+xHZeHjZGYFdurETfdEKKldB158fp
 github.com/gethinode/mod-bootstrap v1.3.2/go.mod h1:CL9IDot6nbXIWJYE/KxfsTdYYEJIGL17BXbAYPn+wVQ=
 github.com/gethinode/mod-bootstrap v1.3.3 h1:k7RrZM3zstWA5xg55yLedb4T7WRBXvn77gv7OwBQ0d4=
 github.com/gethinode/mod-bootstrap v1.3.3/go.mod h1:MkvQgiA3N2NFiW57TTU60Rn4N6oZjvlBIVgrJE9M0WI=
+github.com/gethinode/mod-bootstrap v1.3.4 h1:rBfyUmdslxL+RX76/5hyJYPacfrt6OYrciNgk/T0NWk=
+github.com/gethinode/mod-bootstrap v1.3.4/go.mod h1:MkvQgiA3N2NFiW57TTU60Rn4N6oZjvlBIVgrJE9M0WI=
 github.com/gethinode/mod-csp v1.0.0 h1:Obp0MVMBjIPZbKDh6Ejl5pImDG7yERMLf2or9UVnwPA=
 github.com/gethinode/mod-csp v1.0.0/go.mod h1:Nb22QMicoUHgZQUKP5TCgVrSI8K3KU7jLuLBShmotjg=
 github.com/gethinode/mod-csp v1.0.1 h1:IUUwPc41UNw7DAFuJ75nNPzhkPExenxXU7susdLaxdQ=
@@ -50,6 +58,8 @@ github.com/gethinode/mod-csp v1.0.6 h1:ufEKQldQe9ZCXbENTpwqVlYnPRgVv3WDhPjur5OLU
 github.com/gethinode/mod-csp v1.0.6/go.mod h1:Nb22QMicoUHgZQUKP5TCgVrSI8K3KU7jLuLBShmotjg=
 github.com/gethinode/mod-csp v1.0.7 h1:V4D8vYA/jJ2Nv9kPz5gt96fkVd3NtT7sBqVhnG5TvAU=
 github.com/gethinode/mod-csp v1.0.7/go.mod h1:Nb22QMicoUHgZQUKP5TCgVrSI8K3KU7jLuLBShmotjg=
+github.com/gethinode/mod-csp v1.0.8 h1:36bWS7oW5KoPp0ywJXKmfMdM33c/7EPBLjzut0njTgE=
+github.com/gethinode/mod-csp v1.0.8/go.mod h1:Nb22QMicoUHgZQUKP5TCgVrSI8K3KU7jLuLBShmotjg=
 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=
@@ -108,6 +118,12 @@ github.com/gethinode/mod-flexsearch/v2 v2.1.0 h1:NzCruYAKQBMM1DwFFoH7/tzqmItR6sK
 github.com/gethinode/mod-flexsearch/v2 v2.1.0/go.mod h1:d7MMkVlz0l6cEk76e0mkveEsDxGfu5Sv+HUIhoGguhE=
 github.com/gethinode/mod-flexsearch/v2 v2.1.1 h1:Vcr0aAkqPdavK183L8nr0dF7ngfY9EUDG4ZpmEK815M=
 github.com/gethinode/mod-flexsearch/v2 v2.1.1/go.mod h1:0IJGZQRv9X+th/gFmFRusEUSv0oJSr3aw5t1w3lfvYg=
+github.com/gethinode/mod-flexsearch/v2 v2.1.2 h1:B/onreHG/qzIqMo9YYiRk4WWM+GgFj1FSGHSgUpCvJ0=
+github.com/gethinode/mod-flexsearch/v2 v2.1.2/go.mod h1:0IJGZQRv9X+th/gFmFRusEUSv0oJSr3aw5t1w3lfvYg=
+github.com/gethinode/mod-flexsearch/v2 v2.1.3 h1:m5I9B7cA1SU99f90yO4OpOcKNPZ5zMF18pEhusLxa80=
+github.com/gethinode/mod-flexsearch/v2 v2.1.3/go.mod h1:0IJGZQRv9X+th/gFmFRusEUSv0oJSr3aw5t1w3lfvYg=
+github.com/gethinode/mod-flexsearch/v3 v3.0.0 h1:xFeo5ovZMIcUttvpOamPAMML5+5Au/hewZz/18C2H6Q=
+github.com/gethinode/mod-flexsearch/v3 v3.0.0/go.mod h1:iYvaBF6Y62pjnCepYAqLxoX1ZdEBoD+9caj4cBC+MxY=
 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=
@@ -160,6 +176,8 @@ github.com/gethinode/mod-fontawesome/v2 v2.1.0 h1:kRQ/4ady4Ih/m3bJ/1+/rkFhunuzjN
 github.com/gethinode/mod-fontawesome/v2 v2.1.0/go.mod h1:Jhwzi3KQI3fYn1hPNPJFCk+kcz80s8ONT4FmwLTXH2c=
 github.com/gethinode/mod-fontawesome/v2 v2.1.1 h1:EieVCvEiT0ulXpEHY4kCLJvZCIvGkupIVyoCRTidrvo=
 github.com/gethinode/mod-fontawesome/v2 v2.1.1/go.mod h1:zukv88wXqquEvTJJ9mWWk8Ia+9INnA41wYqusf2RcHA=
+github.com/gethinode/mod-fontawesome/v2 v2.1.2 h1:v1aHhbLLwe/05zRHnx9qGqh6b3toDzcLzuv61rWAoGU=
+github.com/gethinode/mod-fontawesome/v2 v2.1.2/go.mod h1:zukv88wXqquEvTJJ9mWWk8Ia+9INnA41wYqusf2RcHA=
 github.com/gethinode/mod-google-analytics v1.0.0 h1:fly42RQ69bdyJe8WFefsBIo7WMIXkd3wZn32kyAr4h4=
 github.com/gethinode/mod-google-analytics v1.0.0/go.mod h1:dl628cFozpCvoIMCiV7ujzQipjxcm3eatXrSfLPWNII=
 github.com/gethinode/mod-google-analytics v1.0.1 h1:zbmOdnAhhFCA7qWw7fnR46biWhqW2r06sIaTWyhB5R0=
@@ -188,6 +206,8 @@ github.com/gethinode/mod-google-analytics v1.3.1 h1:WPXrsO6Kpp0k8PYY9a1JyiZgYGMl
 github.com/gethinode/mod-google-analytics v1.3.1/go.mod h1:dl628cFozpCvoIMCiV7ujzQipjxcm3eatXrSfLPWNII=
 github.com/gethinode/mod-google-analytics v1.3.2 h1:W4caxWkSor/BFfOEGDDMp+7RajO/Jh1bE7LXxPqLE3A=
 github.com/gethinode/mod-google-analytics v1.3.2/go.mod h1:dl628cFozpCvoIMCiV7ujzQipjxcm3eatXrSfLPWNII=
+github.com/gethinode/mod-google-analytics v1.3.3 h1:iX2FtXajykfHWJf7MXCQmpezqXgQUADNTeglU81QKpw=
+github.com/gethinode/mod-google-analytics v1.3.3/go.mod h1:dl628cFozpCvoIMCiV7ujzQipjxcm3eatXrSfLPWNII=
 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=
@@ -214,6 +234,8 @@ github.com/gethinode/mod-katex v1.1.2 h1:TbeVIWeG5TqldlVxpM1upOWj11RljXy4fhpOQIw
 github.com/gethinode/mod-katex v1.1.2/go.mod h1:byAfpI3wuqNJIooTGVEGc1cjBhhCy4+CcK1H6495MYg=
 github.com/gethinode/mod-katex v1.1.3 h1:fRgoBZVCJeLUFqGrGweg4FhCcbGsyqNRmd9WezG/CUQ=
 github.com/gethinode/mod-katex v1.1.3/go.mod h1:byAfpI3wuqNJIooTGVEGc1cjBhhCy4+CcK1H6495MYg=
+github.com/gethinode/mod-katex v1.1.4 h1:HWc45uHKX2JhI624UnA46LCZkLGhSbaq+zAHt9e57zw=
+github.com/gethinode/mod-katex v1.1.4/go.mod h1:byAfpI3wuqNJIooTGVEGc1cjBhhCy4+CcK1H6495MYg=
 github.com/gethinode/mod-leaflet v0.2.3 h1:QQI4h+IH0jZ7fx4q0um2YIEiYBoW3OAfW8qHzbRCDPk=
 github.com/gethinode/mod-leaflet v0.2.3/go.mod h1:uGggt87x4Fw7wBoJpSiUvNkYg+s/Ujne7klAX2rxMRk=
 github.com/gethinode/mod-leaflet v0.3.1 h1:H5MaOa+BB1KuVw7abTqfIn/SNzzRsAyx/WQoSe+2Ykc=
@@ -240,6 +262,8 @@ github.com/gethinode/mod-leaflet v1.2.1 h1:p0bKi+F5vbXwYknBvFEN9KymK8PRqKaYhVz5O
 github.com/gethinode/mod-leaflet v1.2.1/go.mod h1:Ei0x9WiL7Dbi4JeG6yI1CE63bT1QJ8sKi67Jea1wFSE=
 github.com/gethinode/mod-leaflet v1.3.0 h1:rRjuuW2KVJjnrBrFIOxxHxkB6RPdmlTivBlvceBG3Fk=
 github.com/gethinode/mod-leaflet v1.3.0/go.mod h1:F/XR1lYKENw91u+IC4NXQT6dbCyJlSJUPClMVpBK8Tw=
+github.com/gethinode/mod-leaflet v1.3.1 h1:nG6lQ7LZ2E/TGok/VGo5FCX+OVoHvxrYszi2FvQimRg=
+github.com/gethinode/mod-leaflet v1.3.1/go.mod h1:F/XR1lYKENw91u+IC4NXQT6dbCyJlSJUPClMVpBK8Tw=
 github.com/gethinode/mod-lottie v1.0.0 h1:1CUZMcgN5FAyjjyuP3qkaOQ6M5sv6HUAbosW4sIT5VE=
 github.com/gethinode/mod-lottie v1.0.0/go.mod h1:erRCgSL2FCfKHI0jQbSpM+g0jXl7SjKVJrh7kWGteKs=
 github.com/gethinode/mod-lottie v1.0.1 h1:+IE7xtnSVQpJS56oBJq9RWKZeFEfxrOZAqE3BSrS/u0=
@@ -298,10 +322,20 @@ github.com/gethinode/mod-lottie v1.5.14 h1:17wmpi4XQzmwSB2HKNVa7c6ZzULrRnpKdowOF
 github.com/gethinode/mod-lottie v1.5.14/go.mod h1:VrjjmrwP/NIrLW7oDQyEAHdbeIRQfbr5BKjgKvI9Al4=
 github.com/gethinode/mod-lottie v1.6.0 h1:O0ld9Q1rBWKb9HzuCuGPBfCegUcIqczMGNW2O/VjVYk=
 github.com/gethinode/mod-lottie v1.6.0/go.mod h1:jZy8EJ6ldLnOXhpzayJ2STZ4hzykqkguFHWpN4aHxMo=
+github.com/gethinode/mod-lottie v1.6.1 h1:0wkQ7yMiwFvkhzsBoO/RhfKJ7ru2EzoQfYrwnC6qoxg=
+github.com/gethinode/mod-lottie v1.6.1/go.mod h1:Buaa3A4fBIE4mkyQhnjMlassQQ5j8gRxQ4QnN7I1oGc=
 github.com/gethinode/mod-mermaid v1.1.23 h1:DA5iIdopb7f3wC+bfZ7J5HhcRUuVI/2j1+W/j5L/wwQ=
 github.com/gethinode/mod-mermaid v1.1.23/go.mod h1:rw6vrY9DpdJblwFwLuXCdy2kBHxMf6gGKWeetwfTSfc=
 github.com/gethinode/mod-mermaid/v2 v2.0.1 h1:QcahIFCgmYAGsukQ0d+/L4IJtDwgXgv0WzilZ9poI9o=
 github.com/gethinode/mod-mermaid/v2 v2.0.1/go.mod h1:kp3oUFAjKxuwzFbwxGWPEx5VQOu2ZHzcrwcNhDv08BI=
+github.com/gethinode/mod-mermaid/v2 v2.0.2 h1:uRHS3RyrMBK/hhDbEX39HnYkypSvSeci0kSyQaSdsKU=
+github.com/gethinode/mod-mermaid/v2 v2.0.2/go.mod h1:kp3oUFAjKxuwzFbwxGWPEx5VQOu2ZHzcrwcNhDv08BI=
+github.com/gethinode/mod-mermaid/v2 v2.0.3 h1:vWiAE640GAzkQCj0NFyn1VtnpFwiJ5Bljm2YgoQ3qG4=
+github.com/gethinode/mod-mermaid/v2 v2.0.3/go.mod h1:kp3oUFAjKxuwzFbwxGWPEx5VQOu2ZHzcrwcNhDv08BI=
+github.com/gethinode/mod-mermaid/v3 v3.0.0 h1:pFF2soB3ZQcY4KuMzDprcSv2zdC3yTKywNId4yhcPOA=
+github.com/gethinode/mod-mermaid/v3 v3.0.0/go.mod h1:+8p5KbFjIkB/I77Gpd8LTQgmNrRBfJpmKGnjclzwJFo=
+github.com/gethinode/mod-mermaid/v3 v3.0.1 h1:h4v3QvGpSln9PDbWccSktULq9FbRZ57JN4Lp+gVjvVI=
+github.com/gethinode/mod-mermaid/v3 v3.0.1/go.mod h1:rbI8IKFfKVGqTY/eJnuNJwzB5kSjaEUNX0NRHc4rBfA=
 github.com/gethinode/mod-simple-datatables v1.0.0 h1:Dj4WGw12OkaimwkCpLn5Jhmd49dvNJW9O2P/W9F+HlQ=
 github.com/gethinode/mod-simple-datatables v1.0.0/go.mod h1:K8T7fIdb8pMOB+OSW4A5lz5IW99+HyzcTgx764fvOGw=
 github.com/gethinode/mod-simple-datatables v1.0.2 h1:zhqxHet3iLQWYCBbGROALpOY9zQlptMycFkz1Tto5bA=
@@ -342,6 +376,8 @@ github.com/gethinode/mod-simple-datatables v1.1.7 h1:wCY2bWFUxRHWbWzb/zefCACooCS
 github.com/gethinode/mod-simple-datatables v1.1.7/go.mod h1:FjkIEuxqeLLEqqDcz/nHAGHsRfV7EJP5Uhk4kYD8okY=
 github.com/gethinode/mod-simple-datatables/v2 v2.0.1 h1:ZwdI96n8dM2VLwdM/x+Vj7sa4tfiAUnkDj39jn+vkXc=
 github.com/gethinode/mod-simple-datatables/v2 v2.0.1/go.mod h1:mmf1AOxpHdSRQnW2k7ExVWKTyzbG2hpsDRssmyASNb8=
+github.com/gethinode/mod-simple-datatables/v2 v2.0.2 h1:6HkJkHg754HG2P5FTXiRePEnx/p65yfuqizB+gixV6k=
+github.com/gethinode/mod-simple-datatables/v2 v2.0.2/go.mod h1:bmXZJeTQ+GZJ83vasFBTS3JSm09Oa/jDX9T187stdnA=
 github.com/gethinode/mod-utils v1.0.0 h1:cqHm2xS5uDiJzRm1KfHaNbq6uMVDKLhQa8/BuTZ1nhY=
 github.com/gethinode/mod-utils v1.0.0/go.mod h1:ONJm3pHCq7nvaPNjusLZNCeCbhOhSBH4HVKHwK1FdYE=
 github.com/gethinode/mod-utils v1.0.1 h1:jhZGlGFHHL1f5HXbBMXfiZ2gCz4TVafAzjnRPTIBSEE=
@@ -452,6 +488,24 @@ github.com/gethinode/mod-utils/v4 v4.8.3 h1:CSaFR/c1cGrSPpH5ZfrNOoMhAbNb8sw0SCRh
 github.com/gethinode/mod-utils/v4 v4.8.3/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
 github.com/gethinode/mod-utils/v4 v4.8.4 h1:ExD2zZCGonAmbIxC9wBU2dp+V4ZfvG46NWaz+LaV3iQ=
 github.com/gethinode/mod-utils/v4 v4.8.4/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.9.0 h1:v7+prGZPETqgI6t/LN0UhrtRKU4mqpJUQu6jEUU5MYg=
+github.com/gethinode/mod-utils/v4 v4.9.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.9.1 h1:9D2AJcrlS5r2moHEoo70GrNBmq1pJHd9oT4G14DsZRs=
+github.com/gethinode/mod-utils/v4 v4.9.1/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.9.2 h1:lzcihwAsm8R2k2v+tWu5nfWvXMA8uRKi0nGIzZCygZ8=
+github.com/gethinode/mod-utils/v4 v4.9.2/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.10.0 h1:CfVa57r52wXd0bUqSJlpux2cloHQNBBe13aeqLJ8FXE=
+github.com/gethinode/mod-utils/v4 v4.10.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.11.0 h1:24RObT99j/jiQnCyHvXahJHIA8e8uQuBb1pUIRJOxpA=
+github.com/gethinode/mod-utils/v4 v4.11.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.11.1 h1:12CzZjyLOb/FSXbX8mDAWqs8y4OCXOEavKww7T4V9jU=
+github.com/gethinode/mod-utils/v4 v4.11.1/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.12.0 h1:5sSfYIxZCeQbXLoZdS//rl6thwLwtXuvM0ujaWKyPmc=
+github.com/gethinode/mod-utils/v4 v4.12.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.13.0 h1:VKAA+wKy4saayXfgJuVBRfhNVWQWmxOjO8LSpQCvLfw=
+github.com/gethinode/mod-utils/v4 v4.13.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
+github.com/gethinode/mod-utils/v4 v4.14.0 h1:CF5dy+HWg22L306bWVhClWK9b1NVinEqtb4Qr2vcl9A=
+github.com/gethinode/mod-utils/v4 v4.14.0/go.mod h1:bYmvRdAo4ICy5MpSGafDvO4p5bTDpsDKFCPL3bH0mN4=
 github.com/nextapps-de/flexsearch v0.0.0-20230711092928-1243fd883ec3 h1:H/qVR5O4BXjRjD+5PZB+r4ug2BSJ2Of4RtwOntd+OKo=
 github.com/nextapps-de/flexsearch v0.0.0-20230711092928-1243fd883ec3/go.mod h1:5GdMfPAXzbA2gXBqTjC6l27kioSYzHlqDMh0+wyx7sU=
 github.com/nextapps-de/flexsearch v0.0.0-20240108021025-afd75f742f22 h1:re7L8FxbXQpnX8BgzkdUnDpsUmloGNyLmiy2ZCln8pg=
@@ -474,6 +528,8 @@ github.com/nextapps-de/flexsearch v0.0.0-20250523180618-1f75f5f9d9b6 h1:vUlZHDX+
 github.com/nextapps-de/flexsearch v0.0.0-20250523180618-1f75f5f9d9b6/go.mod h1:5GdMfPAXzbA2gXBqTjC6l27kioSYzHlqDMh0+wyx7sU=
 github.com/nextapps-de/flexsearch v0.0.0-20250606060143-c28f52c09b7a h1:CF/f62ufhBzNvAgoC6JhuqQxtqz0yDj3IIXYKl+A650=
 github.com/nextapps-de/flexsearch v0.0.0-20250606060143-c28f52c09b7a/go.mod h1:5GdMfPAXzbA2gXBqTjC6l27kioSYzHlqDMh0+wyx7sU=
+github.com/nextapps-de/flexsearch v0.0.0-20250901122457-99cddafcdc64 h1:8gn/7ZfERwknYk63DskhEfkwwpoXubGrzLv5LuSq6hc=
+github.com/nextapps-de/flexsearch v0.0.0-20250901122457-99cddafcdc64/go.mod h1:5GdMfPAXzbA2gXBqTjC6l27kioSYzHlqDMh0+wyx7sU=
 github.com/twbs/bootstrap v5.3.2+incompatible h1:tuiO5acc6xnZUR77Sbi5aKWXxjYxbmsSbJwYrhAKoQQ=
 github.com/twbs/bootstrap v5.3.2+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=
 github.com/twbs/bootstrap v5.3.3+incompatible h1:goFoqinzdHfkeegpFP7pvhbd0g+A3O2hbU3XCjuNrEQ=
@@ -484,3 +540,5 @@ github.com/twbs/bootstrap v5.3.6+incompatible h1:efmXVyq839m5QQ0+JBUdQQ1TrmoBqvQ
 github.com/twbs/bootstrap v5.3.6+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=
 github.com/twbs/bootstrap v5.3.7+incompatible h1:ea1W8TOWZFkqSK2M0McpgzLiUQVru3bz8aHb0j/XtuM=
 github.com/twbs/bootstrap v5.3.7+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=
+github.com/twbs/bootstrap v5.3.8+incompatible h1:eK1fsXP7R/FWFt+sSNmmvUH9usPocf240nWVw7Dh02o=
+github.com/twbs/bootstrap v5.3.8+incompatible/go.mod h1:fZTSrkpSf0/HkL0IIJzvVspTt1r9zuf7XlZau8kpcY0=

hugo_stats.json

@@ -8,6 +8,7 @@
       "footer",
       "form",
       "head",
+      "hr",
       "html",
       "img",
       "input",
@@ -31,9 +32,9 @@
       "use"
     ],
     "classes": [
+      "%!s(<nil>)",
       "active",
       "align-items-center",
-      "align-items-start",
       "align-self-center",
       "align-self-end",
       "ball",
@@ -53,11 +54,10 @@
       "col-12",
       "col-6",
       "col-8",
-      "col-md-1",
-      "col-md-11",
       "col-md-2",
       "col-md-6",
       "col-md-8",
+      "col-md-auto",
       "col-sm-12",
       "collapse",
       "collapsed",
@@ -66,29 +66,32 @@
       "d-flex",
       "d-inline",
       "d-md-block",
+      "d-md-flex",
       "d-md-none",
       "d-none",
       "d-sm-block",
       "d-sm-none",
       "display-1",
       "display-4",
+      "dropdown-divider-bg",
       "emphasis",
       "end-0",
       "fa",
       "fa-10x",
       "fa-2x",
       "fa-angle-left",
-      "fa-book-open",
       "fa-chevron-right",
       "fa-ellipsis",
       "fa-face-frown",
       "fa-fw",
       "fa-github",
       "fa-linkedin",
+      "fa-magnifying-glass",
       "fa-medium",
       "fa-moon",
       "fa-sun",
       "fab",
+      "fade",
       "fas",
       "fixed-top",
       "flex-column",
@@ -100,6 +103,7 @@
       "fw-30",
       "fw-bold",
       "h-100",
+      "h-50",
       "hero",
       "hero-content",
       "hero-image",
@@ -123,15 +127,21 @@
       "main-nav-toggler",
       "me-auto",
       "middle-bar",
+      "modal",
+      "modal-body",
+      "modal-content",
+      "modal-dialog",
+      "modal-dialog-centered",
+      "modal-dialog-scrollable",
+      "modal-header",
+      "modal-lg",
       "mode-switch",
       "ms-auto",
-      "ms-md-3",
       "mt-3",
-      "mt-4",
       "mt-5",
-      "mt-md-0",
       "mx-auto",
       "mx-md-0",
+      "mx-md-2",
       "my-auto",
       "my-md-auto",
       "nav-item",
@@ -142,8 +152,11 @@
       "navbar-container",
       "navbar-expand-md",
       "navbar-fixed-top",
+      "navbar-fs-6",
+      "navbar-md-fs",
       "navbar-mode-selector",
       "navbar-nav",
+      "navbar-nav-scroll",
       "navbar-toggler",
       "no-js",
       "order-0",
@@ -162,24 +175,26 @@
       "pt-md-0",
       "px-4",
       "px-xxl-0",
+      "py-2",
       "py-3",
       "py-4",
+      "py-md-1",
       "rounded",
       "row",
       "row-cols-1",
       "row-cols-2",
       "row-cols-sm-3",
       "search",
+      "search-background",
       "search-input",
+      "search-modal",
       "search-suggestions",
       "section-cover",
-      "shadow",
       "svg-inline--fa",
       "text-",
       "text-body",
       "text-center",
       "text-decoration-none",
-      "text-md-start",
       "text-muted",
       "text-secondary",
       "text-sm-start",
@@ -189,7 +204,9 @@
       "toast-container",
       "toast-header",
       "toggler-icon",
-      "top-bar"
+      "top-bar",
+      "vr",
+      "w-100"
     ],
     "ids": [
       "container",
@@ -198,14 +215,16 @@
       "fab-linkedin",
       "fab-medium",
       "fas-angle-left",
-      "fas-book-open",
       "fas-chevron-right",
       "fas-ellipsis",
+      "fas-magnifying-glass",
       "fas-moon",
       "fas-sun",
       "navbar-0-collapse",
       "navbar-mode",
       "navbar-mode-checkbox",
+      "search-input-modal",
+      "search-modal",
       "toast-container",
       "toast-copied-code-message",
       "welcome-to-hinode"

i18n/en.yaml

@@ -101,6 +101,10 @@
   translation: "See also"
 - id: sectionMenu
   translation: "Select a topic"
+- id: tocShowMore
+  translation: "Show {{ . }} more"
+- id: tocShowLess
+  translation: "Show less"
 
 # Sidebar
 - id: toggleSidebar
@@ -177,3 +181,11 @@
 # Nav & Tab
 - id: clickToExpand
   translation: "Click to expand"
+
+# Contact information
+- id: contactHeaderTopic
+  translation: "Interested in this topic?"
+- id: contactBody
+  translation: "Please leave your contact details so we can get in touch."
+- id: contactAction
+  translation: "Get in touch"