Merge remote-tracking branch 'upstream/main'

.chglog/CHANGELOG.tpl.md

@@ -1,23 +0,0 @@
-# Changelog
-
-{{ range .Versions -}}
-## {{ if .Tag.Previous }}[{{ .Tag.Name }}]({{ $.Info.RepositoryURL }}/compare/{{ .Tag.Previous.Name }}...{{ .Tag.Name }}){{ else }}{{ .Tag.Name }}{{ end }} ({{ datetime "2006-01-02" .Tag.Date }})
-
-{{ range .CommitGroups -}}
-### {{ .Title }}
-
-{{ range .Commits -}}
-- {{ if .Scope }}**{{ .Scope }}:** {{ end }}{{ (regexReplaceAll "(.*)/issues/(.*)" (regexReplaceAll "(Co-\\w*-by.*)" .Subject "") "${1}/pull/${2}") | trim }}
-{{ end }}
-{{- end -}}
-
-{{- if .NoteGroups -}}
-{{ range .NoteGroups -}}
-### {{ .Title }}
-
-{{ range .Notes }}
-{{ .Body }}
-{{ end }}
-{{ end -}}
-{{ end -}}
-{{ end -}}

.chglog/config.yml

@@ -1,25 +0,0 @@
-style: github
-template: CHANGELOG.tpl.md
-info:
-  title: CHANGELOG
-  repository_url: https://github.com/thegeeklab/hugo-geekdoc
-options:
-  commit_groups:
-    title_maps:
-      feat: Features
-      fix: Bug Fixes
-      perf: Performance Improvements
-      refactor: Code Refactoring
-      chore: Others
-      test: Testing
-      ci: CI Pipeline
-      docs: Documentation
-  header:
-    pattern: "^(\\w*)(?:\\(([\\w\\$\\.\\-\\*\\s]*)\\))?\\:\\s(.*)$"
-    pattern_maps:
-      - Type
-      - Scope
-      - Subject
-  notes:
-    keywords:
-      - BREAKING CHANGE

.eslintrc.json

@@ -1,22 +1,13 @@
 {
   "env": {
     "browser": true,
-    "es6": true,
-    "amd": true
+    "es2017": true
   },
   "extends": ["plugin:prettier/recommended"],
   "parser": "@babel/eslint-parser",
   "parserOptions": {
     "sourceType": "module",
-    "requireConfigFile": false,
-    "allowImportExportEverywhere": true
+    "requireConfigFile": false
   },
-  "plugins": ["prettier"],
-  "rules": {
-    "require-await": "warn"
-  },
-  "globals": {
-    "require": false,
-    "requirejs": false
-  }
+  "plugins": ["prettier"]
 }

.gitsv/config.yml

@@ -0,0 +1,47 @@
+---
+version: "1.1"
+
+versioning:
+  update-major: []
+  update-minor: [feat]
+  update-patch: [fix, perf, refactor, chore, test, ci, docs]
+
+tag:
+  pattern: "v%d.%d.%d"
+
+release-notes:
+  sections:
+    - name: Features
+      commit-types: [feat]
+      section-type: commits
+    - name: Bug Fixes
+      commit-types: [fix]
+      section-type: commits
+    - name: Performance Improvements
+      commit-types: [perf]
+      section-type: commits
+    - name: Code Refactoring
+      commit-types: [refactor]
+      section-type: commits
+    - name: Others
+      commit-types: [chore]
+      section-type: commits
+    - name: Testing
+      commit-types: [test]
+      section-type: commits
+    - name: CI Pipeline
+      commit-types: [ci]
+      section-type: commits
+    - name: Documentation
+      commit-types: [docs]
+      section-type: commits
+    - name: BREAKING CHANGES
+      section-type: breaking-changes
+
+commit-message:
+  footer:
+    issue:
+      key: issue
+      add-value-prefix: "#"
+  issue:
+    regex: "#?[0-9]+"

.htmlvalidate.json

@@ -0,0 +1,8 @@
+{
+  "extends": ["html-validate:standard"],
+  "rules": {
+    "element-required-content": "off",
+    "element-permitted-content": "off",
+    "no-raw-characters": "off"
+  }
+}

.lighthouserc.yml

@@ -9,8 +9,18 @@ ci:
       - http://localhost/usage/getting-started/
     settings:
       chromeFlags: "--no-sandbox"
-      onlyCategories: ['performance', 'accessibility', 'best-practices', 'seo']
-      skipAudits: ["color-contrast", "uses-long-cache-ttl", "csp-xss", "bf-cache", "is-crawlable", "image-size-responsive"]
+      onlyCategories: ["performance", "accessibility", "best-practices", "seo"]
+      skipAudits:
+        [
+          "color-contrast",
+          "uses-long-cache-ttl",
+          "csp-xss",
+          "bf-cache",
+          "is-crawlable",
+          "image-size-responsive",
+          "render-blocking-resources",
+          "largest-contentful-paint"
+        ]
   assert:
     preset: "lighthouse:no-pwa"
     assertions:
@@ -21,6 +31,10 @@ ci:
       bf-cache: off
       is-crawlable: off
       image-size-responsive: off
+      render-blocking-resources: off
+      largest-contentful-paint: off
+      total-byte-weight: warn
+      identical-links-same-purpose: warn
       tap-targets: warn
       unsized-images: warn
       # FIXME: https://github.com/GoogleChrome/lighthouse/issues/11460

.lycheeignore

@@ -0,0 +1,3 @@
+https://github.com/thegeeklab/.+/edit/main/.*
+https://unsplash.com.*
+https://www.color-hex.com.*

.markdownlint.yml

@@ -5,3 +5,5 @@ MD041: False
 MD042: False
 MD004:
   style: dash
+MD010:
+  code_blocks: False

.tarignore

@@ -9,8 +9,8 @@
 .jsbeautify*
 .prettier*
 .eslintrc*
-.chglog
-.vnuignore
+.htmlvalidate*
+.lycheeignore*
 example*
 webpack*
 svgsprite*

.vnuignore

@@ -1,2 +0,0 @@
-.*border-content.*
-.*Duplicate ID.*

.woodpecker/build-package.yml

@@ -6,43 +6,35 @@ when:
       - ${CI_REPO_DEFAULT_BRANCH}
 
 steps:
-  assets:
+  - name: assets
     image: docker.io/library/node:lts
     commands:
-      - git fetch -tq
-      - npm install > /dev/null
+      - npm install --quiet --no-progress
       - npm run build
       - cat VERSION
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
 
-  package:
+  - name: package
     image: docker.io/library/node:lts
     commands:
       - npm run pack
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
 
-  checksum:
+  - name: checksum
     image: quay.io/thegeeklab/alpine-tools
     commands:
       - cd dist/ && sha256sum * > ../sha256sum.txt
 
-  changelog-generate:
-    image: quay.io/thegeeklab/git-chglog
+  - name: changelog
+    image: quay.io/thegeeklab/git-sv
     commands:
-      - git fetch -tq
-      - git-chglog --no-color --no-emoji -o CHANGELOG.md ${CI_COMMIT_TAG:---next-tag unreleased unreleased}
+      - git sv current-version
+      - git sv release-notes -t ${CI_COMMIT_TAG:-next} -o CHANGELOG.md
+      - cat CHANGELOG.md
 
-  changelog-format:
-    image: quay.io/thegeeklab/alpine-tools
-    commands:
-      - prettier CHANGELOG.md
-      - prettier -w CHANGELOG.md
-
-  publish-github:
+  - name: publish-github
     image: docker.io/plugins/github-release
     settings:
       api_key:

.woodpecker/docs.yml

@@ -6,23 +6,22 @@ when:
       - ${CI_REPO_DEFAULT_BRANCH}
 
 steps:
-  markdownlint:
+  - name: markdownlint
     image: quay.io/thegeeklab/markdownlint-cli
     commands:
       - markdownlint 'exampleSite/content/**/*.md' 'README.md' 'CONTRIBUTING.md'
 
-  spellcheck:
+  - name: spellcheck
     image: quay.io/thegeeklab/alpine-tools
     commands:
       - spellchecker --files 'exampleSite/content/**/*.md' 'README.md' -d .dictionary -p spell indefinite-article syntax-urls frontmatter --frontmatter-keys title
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
 
-  assets:
+  - name: assets
     image: docker.io/library/node:lts
     commands:
-      - npm install > /dev/null
+      - npm install --quiet --no-progress
       - npm run svg-sprite-list
       - mkdir -p exampleSite/themes/${CI_REPO_NAME}
       - curl -sSL https://github.com/${CI_REPO}/releases/latest/download/${CI_REPO_NAME}.tar.gz | tar -xz -C exampleSite/themes/${CI_REPO_NAME}/ --strip-components=1
@@ -32,40 +31,39 @@ steps:
         branch:
           - ${CI_REPO_DEFAULT_BRANCH}
 
-  assets-main:
+  - name: assets-main
     image: docker.io/library/node:lts
     commands:
-      - npm install > /dev/null
+      - npm install --quiet --no-progress
       - npm run build
       - npm run svg-sprite-list
       - mkdir -p exampleSite/themes/ && ln -s $(pwd)/ exampleSite/themes/${CI_REPO_NAME}
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
     when:
       - event: [pull_request]
 
-  build:
-    image: quay.io/thegeeklab/hugo:0.115.2
+  - name: build
+    image: quay.io/thegeeklab/hugo:0.124.1
     commands:
       - hugo --panicOnWarning -s exampleSite/
 
-  beautify:
+  - name: beautify
     image: quay.io/thegeeklab/alpine-tools
     commands:
       - html-beautify -r -f 'exampleSite/public/**/*.html'
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
 
-  publish:
+  - name: publish
     image: quay.io/thegeeklab/wp-s3-action
     settings:
       access_key:
         from_secret: s3_access_key
       bucket: geekdocs-root
       delete: true
-      endpoint: https://sp.rknet.org
+      endpoint:
+        from_secret: s3_endpoint
       path_style: true
       secret_key:
         from_secret: s3_secret_access_key
@@ -76,6 +74,7 @@ steps:
       - event: [push, manual]
         branch:
           - ${CI_REPO_DEFAULT_BRANCH}
+        status: [success, failure]
 
 depends_on:
   - build-package

.woodpecker/notify.yml

@@ -8,7 +8,7 @@ when:
 runs_on: [success, failure]
 
 steps:
-  matrix:
+  - name: matrix
     image: quay.io/thegeeklab/wp-matrix
     settings:
       homeserver:

.woodpecker/test.yml

@@ -6,49 +6,47 @@ when:
       - ${CI_REPO_DEFAULT_BRANCH}
 
 steps:
-  eslint:
+  - name: eslint
     image: docker.io/library/node:lts
     commands:
-      - npm install > /dev/null
-      - npm run lint
+      - npm install --quiet --no-progress
+      - npm run lint:js
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
 
-  assets:
+  - name: assets
     image: docker.io/library/node:lts
     commands:
-      - npm install > /dev/null
+      - npm install --quiet --no-progress
       - npm run build
     environment:
       FORCE_COLOR: "true"
-      NPM_CONFIG_LOGLEVEL: error
 
-  testbuild:
-    image: quay.io/thegeeklab/hugo:0.115.2
+  - name: testbuild
+    image: quay.io/thegeeklab/hugo:0.124.1
     commands:
       - mkdir -p exampleSite/themes/ && ln -s $(pwd)/ exampleSite/themes/${CI_REPO_NAME}
       - hugo --panicOnWarning -s exampleSite/ -b http://localhost:8000/
 
-  html-validation:
-    image: quay.io/thegeeklab/vnu
+  - name: html-validation
+    image: docker.io/library/node:lts
     group: test
     commands:
-      - vnu --skip-non-html --also-check-css --errors-only --filterfile .vnuignore exampleSite/public
-
-  link-validation:
-    image: quay.io/thegeeklab/link-validator
-    group: test
-    commands:
-      - link-validator --color=always --rate-limit 10 --timeout 60 -e https://github.com/thegeeklab/${CI_REPO_NAME}/edit/main/.* -e https://unsplash.com.*
+      - npm install --quiet --no-progress
+      - npm run lint:html
     environment:
-      LINK_VALIDATOR_BASE_DIR: exampleSite/public
-      LINK_VALIDATOR_RETRIES: "3"
+      FORCE_COLOR: "true"
 
-  page-validation:
-    image: quay.io/thegeeklab/lhci:0.12
+  - name: link-validation
+    image: docker.io/lycheeverse/lychee
+    group: test
+    commands:
+      - lychee --no-progress --format detailed exampleSite/content/ README.md
+
+  - name: page-validation
+    image: quay.io/thegeeklab/lhci:0.13
     group: test
     commands:
       - lhci autorun
     environment:
-      LHCI_SERVER_URL: https://drone-artifact.rknet.org/${CI_REPO_NAME}/
+      LHCI_SERVER_URL: https://ci-artifact.rknet.org/${CI_REPO_NAME}/

exampleSite/content/en/shortcodes/avatar/_index.md

@@ -0,0 +1,46 @@
+---
+title: Avatar
+resources:
+  - name: avatar
+    src: "avatar.jpg"
+    title: "Avatar"
+---
+
+The avatar shortcode is another custom image shortcode.
+
+<!--more-->
+
+## Usage
+
+Define a resource in the page front matter.
+
+<!-- spellchecker-disable -->
+
+```md
+---
+resources:
+  - name: avatar
+    src: "images/avatar.jpg"
+    title: "Avatar"
+---
+
+{{</* avatar name="avatar" */>}}
+```
+
+<!-- spellchecker-enable -->
+
+## Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-avatar sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
+## Example
+
+<!-- spellchecker-disable -->
+
+{{< avatar name=avatar size="small" >}}
+
+<!-- spellchecker-enable -->

exampleSite/content/en/shortcodes/buttons.md

@@ -4,11 +4,20 @@ title: Buttons
 
 Buttons are styled links that can lead to local page or external link.
 
-<!-- prettier-ignore-start -->
+## Usage
+
+<!-- prettier-ignore -->
 ```tpl
 {{</* button relref="/" [class="...", size="large|regular"] */>}}Get Home{{</* /button */>}}
 {{</* button href="https://github.com/thegeeklab/hugo-geekdoc" */>}}Contribute{{</* /button */>}}
 ```
+
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-buttons sort=name order=asc >}}
+<!-- spellchecker-enable -->
 <!-- prettier-ignore-end -->
 
 ## Example

exampleSite/content/en/shortcodes/columns.md

@@ -4,12 +4,6 @@ title: Columns
 
 The Columns shortcode can be used to organize content side-by-side (horizontally) for better readability.
 
-## Attributes
-
-| Name            | Description                                      | default |
-| --------------- | ------------------------------------------------ | ------- |
-| size (optional) | size of the first column (small\|regular\|large) | regular |
-
 ## Usage
 
 ```html
@@ -29,11 +23,19 @@ Dolor sit, sumo unique argument um no ...
 {{</* /columns */>}}
 ```
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-columns sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
 ## Example
 
 {{< columns >}}
 
-## Left
+### Left
 
 Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
 investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
@@ -42,14 +44,14 @@ copious quo ad. Stet probates in duo.
 
 <--->
 
-## Mid Content
+### Mid Content
 
 Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
 investiture. Ornateness bland it ex enc, est yeti am bongo detract re.
 
 <--->
 
-## Right Content
+### Right Content
 
 Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
 investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts

exampleSite/content/en/shortcodes/expand.md

@@ -4,40 +4,38 @@ title: Expand
 
 Expand shortcode can help to decrease clutter on screen by hiding part of text. Expand content by clicking on it.
 
-## Example
+## Usage
 
-### Default
-
-<!-- prettier-ignore-start -->
 ```tpl
 {{</* expand */>}}
-## Markdown content
+### Markdown content
 Dolor sit, sumo unique ...
 {{</* /expand */>}}
 ```
-<!-- prettier-ignore-end -->
+
+It is also possible to use a custom label and symbol.
+
+<!-- prettier-ignore-start -->
+
+```tpl
+{{</* expand "Custom Label" "..." */>}}
+### More markdown
+Dolor sit, sumo unique ...
+{{</* /expand */>}}
+```
+
+## Example
 
 {{< expand >}}
 
-## Markdown content
+### Markdown content
 
 Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture. Ornateness bland it ex enc, est yeti am bongo detract re.
 {{< /expand >}}
 
-### With Custom Label
-
-<!-- prettier-ignore-start -->
-```tpl
-{{</* expand "Custom Label" "..." */>}}
-## Markdown content
-Dolor sit, sumo unique ...
-{{</* /expand */>}}
-```
-<!-- prettier-ignore-end -->
-
 {{< expand "Custom Label" "..." >}}
 
-## More markdown
+### More markdown
 
 Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
 investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts

exampleSite/content/en/shortcodes/hints.md

@@ -4,14 +4,6 @@ title: Hints
 
 Hint shortcode can be used as hint/alerts/notification block.
 
-## Attributes
-
-| Name             | Description                                                                      | default   |
-| ---------------- | -------------------------------------------------------------------------------- | --------- |
-| type             | hint type                                                                        | note      |
-| icon (optional)  | custom icon to use,need to be an icon from an [SVG sprite](/features/icon-sets/) | undefined |
-| title (optional) | hint title                                                                       | undefined |
-
 ## Usage
 
 <!-- prettier-ignore-start -->
@@ -24,6 +16,14 @@ Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclima
 ```
 <!-- prettier-ignore-end -->
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-hints sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
 ## Example
 
 {{< hint type=note >}}

exampleSite/content/en/shortcodes/icons.md

@@ -4,15 +4,17 @@ title: Icons
 
 Simple shortcode to include icons from SVG sprites outside of menus.
 
+## Usage
+
 <!-- prettier-ignore-start -->
 ```tpl
 {{</* icon "thumbs-up" */>}}
 ```
 <!-- prettier-ignore-end -->
 
-## Usage
+## Example
 
-| Result                     | Usage                            |
+| Output                     | Code                             |
 | -------------------------- | -------------------------------- |
 | {{< icon "thumbs-up" >}}   | `{{</* icon "thumbs-up" */>}}`   |
 | {{< icon "thumbs-down" >}} | `{{</* icon "thumbs-down" */>}}` |

exampleSite/content/en/shortcodes/images/_index.md

@@ -46,15 +46,6 @@ resources:
 If you need more flexibility for your embedded images, you could use the `img` shortcode. It is using Hugo's
 [page resources](https://gohugo.io/content-management/page-resources/) and supports lazy loading of your images.
 
-## Attributes
-
-| Name | Description                                                  | default           |
-| ---- | ------------------------------------------------------------ | ----------------- |
-| name | name of the image resource defined in your front matter      | empty             |
-| alt  | description for displayed image                              | resource `.Title` |
-| size | Thumbnail size (origin\|profile\|tiny\|small\|medium\|large) | empty             |
-| lazy | enable or disable image lazy loading                         | true              |
-
 ## Usage
 
 Define your resources in the page front matter, custom parameter `params.credits` is optional.
@@ -74,6 +65,14 @@ resources:
 {{</* img name="forest-1" size="large" lazy=false */>}}
 ```
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-images sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
 <!-- spellchecker-enable -->
 
 ## Example

exampleSite/content/en/shortcodes/includes.md

@@ -2,28 +2,27 @@
 title: Includes
 ---
 
-{{< toc >}}
-
 Include shortcode can include files of different types. By specifying a language, the included file will have syntax highlighting.
 
+## Usage
+
 <!-- prettier-ignore-start -->
 ```tpl
 {{</* include file="relative/path/from/hugo/root" language="go" */>}}
 ```
 <!-- prettier-ignore-end -->
 
-Attributes:
+### Attributes
 
-| Name     | Description                                                                                                                         | Default                          |
-| -------- | ----------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- |
-| file     | path to the included file relative to the Hugo root                                                                                 | undefined                        |
-| language | language for [syntax highlighting](https://gohugo.io/content-management/syntax-highlighting/#list-of-chroma-highlighting-languages) | undefined                        |
-| type     | special include type (`html,page`)                                                                                                  | undefined (rendered as markdown) |
-| options  | highlighting [options](https://gohugo.io/content-management/syntax-highlighting/#highlight-shortcode)                               | `linenos=table`                  |
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-includes sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
 
-## Examples
+## Example
 
-### Markdown file (default)
+### Example 1: Markdown file (default)
 
 If no other options are specified, files will be rendered as Markdown using the `RenderString` [function](https://gohugo.io/functions/renderstring/).
 
@@ -43,7 +42,7 @@ If you include markdown files that should not get a menu entry, place them outsi
 <!-- spellchecker-enable -->
 <!-- prettier-ignore-end -->
 
-### Language files
+### Example 2: Language files
 
 This method can be used to include source code files and keep them automatically up to date.
 
@@ -60,9 +59,7 @@ Result:
 <!-- spellchecker-enable -->
 <!-- prettier-ignore-end -->
 
-### Special include types
-
-#### HTML
+### Example 3: HTML
 
 HTML content will be filtered by the `safeHTML` filter and added to the rendered page output.
 
@@ -73,9 +70,9 @@ HTML content will be filtered by the `safeHTML` filter and added to the rendered
 
 {{< include file="/static/_includes/example.html.part" type="html" >}}
 
-#### Pages
+### Example 4: Hugo Pages
 
-In some situations, it can be helpful to include Markdown files that also contain shortcodes. While the [default method](#markdown-file-default) works fine to render plain Markdown, shortcodes are not parsed. The only way to get this to work is to use Hugo pages. There are several ways to structure these include pages, so whatever you do, keep in mind that Hugo needs to be able to render and serve these files as regular pages! How it works:
+In some situations, it can be helpful to include Markdown files that also contain shortcodes. While the [default method](#example-1-markdown-file-default) works fine to render plain Markdown, shortcodes are not parsed. The only way to get this to work is to use Hugo pages. There are several ways to structure these include pages, so whatever you do, keep in mind that Hugo needs to be able to render and serve these files as regular pages! How it works:
 
 1. First you need to create a directory **within** your content directory. For this example site `_includes` is used.
 2. To prevent the theme from embedding the page in the navigation, create a file `_includes/_index.md` and add `geekdocHidden: true` to the front matter.

exampleSite/content/en/shortcodes/katex.md

@@ -4,7 +4,7 @@ title: KaTeX
 
 [KaTeX](https://katex.org/) shortcode let you render math typesetting in markdown document.
 
-## Example
+## Usage
 
 ```latex
 {{</* katex [display] [class="text-center"] */>}}
@@ -12,6 +12,16 @@ f(x) = \int_{-\infty}^\infty\hat f(\xi)\,e^{2 \pi i \xi x}\,d\xi
 {{</* /katex */>}}
 ```
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-katex sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
+## Example
+
 <!-- spellchecker-disable -->
 <!-- prettier-ignore -->
 {{< katex display >}}
@@ -20,4 +30,4 @@ f(x) = \int_{-\infty}^\infty\hat f(\xi)\,e^{2 \pi i \xi x}\,d\xi
 
 <!-- spellchecker-enable -->
 
-KaTeX can be used inline, for example {{< katex >}}\pi(x){{< /katex >}} or used with the `display` parameter (see above).
+KaTeX can be used inline, for example {{< katex >}}\pi(x){{< /katex >}} or used with the `display` parameter as above.

exampleSite/content/en/shortcodes/mermaid.md

@@ -4,7 +4,7 @@ title: Mermaid
 
 [Mermaid](https://mermaidjs.github.io/) is library for generating SVG charts and diagrams from text.
 
-## Example
+## Usage
 
 <!-- prettier-ignore -->
 ```tpl
@@ -22,6 +22,16 @@ sequenceDiagram
 {{</* /mermaid */>}}
 ```
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-mermaid sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
+## Example
+
 <!-- spellchecker-disable -->
 <!-- prettier-ignore -->
 {{< mermaid class="text-center" >}}

exampleSite/content/en/shortcodes/progress.md

@@ -4,20 +4,19 @@ title: Progress
 
 A progress bar shows how far a process has progressed.
 
-## Attributes
-
-| Name             | Description                                                                | default   |
-| ---------------- | -------------------------------------------------------------------------- | --------- |
-| value            | progress value                                                             | 0         |
-| icon (optional)  | icon to use, need to be an icon from an [SVG sprite](/features/icon-sets/) | undefined |
-| title (optional) | progress title                                                             | undefined |
-
 ## Usage
 
-<!-- prettier-ignore-start -->
+<!-- prettier-ignore -->
 ```tpl
 {{</* progress title=Eating value=65 icon=gdoc_heart */>}}
 ```
+
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-progress sort=name order=asc >}}
+<!-- spellchecker-enable -->
 <!-- prettier-ignore-end -->
 
 ## Example

exampleSite/content/en/shortcodes/propertylist.md

@@ -4,14 +4,6 @@ title: Properties
 
 The property list shortcode creates a custom HTML description list that can be used to display properties or variables and general dependent information. The shortcode requires a data file in `data/properties/`, e.g. `data/properties/demo.yaml`.
 
-## Attributes
-
-| Name             | Description                                            | default   |
-| ---------------- | ------------------------------------------------------ | --------- |
-| name             | name of the file from the `data/properties/` directory | undefined |
-| sort (optional)  | field name to use for sorting                          | undefined |
-| order (optional) | sort order, only applied if `sort` is set              | `asc`     |
-
 ## Usage
 
 <!-- prettier-ignore-start -->
@@ -28,6 +20,14 @@ The supported attributes can be taken from the following example:
 <!-- spellchecker-enable -->
 <!-- prettier-ignore-end -->
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-buttons sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
 ## Example
 
 <!-- prettier-ignore-start -->

exampleSite/content/en/shortcodes/tabs.md

@@ -4,6 +4,8 @@ title: Tabs
 
 Tabs let you organize content by context, for example installation instructions for each supported platform.
 
+## Usage
+
 <!-- prettier-ignore-start -->
 ```tpl
 {{</* tabs "uniqueid" */>}}

exampleSite/content/en/shortcodes/toc-tree.md

@@ -4,12 +4,22 @@ title: ToC-Tree
 
 The `toc-tree` shortcode will generate a Table of Content from a section file tree of your content directory. The root of the resulting ToC will be the page on which you define the shortcode.
 
+## Usage
+
 <!-- prettier-ignore-start -->
 ```tpl
-{{</* toc-tree */>}}
+{{</* toc-tree [sortBy="title"] */>}}
 ```
 <!-- prettier-ignore-end -->
 
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-toc-tree sort=name order=asc >}}
+<!-- spellchecker-enable -->
+<!-- prettier-ignore-end -->
+
 ## Example
 
 As said, the root will be the site on which the shortcode was used, you can see a demo including nesting in the [ToC Tree](/toc-tree/) section.

exampleSite/content/en/shortcodes/toc.md

@@ -4,21 +4,22 @@ title: ToC
 
 Simple wrapper to generate a page Table of Content from a shortcode.
 
-**Attributes:**
+## Usage
 
-| Name   | Description                | Default                                                       |
-| ------ | -------------------------- | ------------------------------------------------------------- |
-| format | format of the returned ToC | <!-- spellchecker-disable -->html<!-- spellchecker-enable --> |
-
-**Usage:**
-
-<!-- prettier-ignore-start -->
+<!-- prettier-ignore -->
 ```tpl
 {{</* toc (format=[html|raw]) */>}}
 ```
+
+### Attributes
+
+<!-- prettier-ignore-start -->
+<!-- spellchecker-disable -->
+{{< propertylist name=shortcode-toc sort=name order=asc >}}
+<!-- spellchecker-enable -->
 <!-- prettier-ignore-end -->
 
-**Example:**
+## Example
 
 {{< toc >}}
 

exampleSite/content/en/usage/configuration.md

@@ -26,7 +26,8 @@ enableRobotsTXT = true
 
 [markup]
   [markup.goldmark.renderer]
-    # Needed for mermaid shortcode
+    # Needed for mermaid shortcode or when nesting shortcodes (e.g. img within
+    # columns or tabs)
     unsafe = true
   [markup.tableOfContents]
     startLevel = 1
@@ -53,8 +54,7 @@ enableRobotsTXT = true
   # per page if enabled. Can be enabled per page via 'geekdocCollapseSection'.
   geekdocCollapseAllSections = true
 
-  # (Optional, default true) Show page navigation links at the bottom of each
-  # docs page (bundle menu only).
+  # (Optional, default true) Show page navigation links at the bottom of each docs page.
   geekdocNextPrev = false
 
   # (Optional, default true) Show a breadcrumb navigation bar at the top of each docs page.
@@ -97,7 +97,7 @@ enableRobotsTXT = true
   # by the 'img' shortcode.
   geekdocImageLazyLoading = true
 
-  # (Optional, default false) Set HTMl <base> to .Site.BaseURL if enabled. It might be required
+  # (Optional, default false) Set HTMl <base> to .Site.Home.Permalink if enabled. It might be required
   # if a subdirectory is used within Hugos BaseURL.
   # See https://developer.mozilla.org/de/docs/Web/HTML/Element/base.
   geekdocOverwriteHTMLBase = false
@@ -151,7 +151,8 @@ enableRobotsTXT: true
 
 markup:
   goldmark:
-    # Needed for mermaid shortcode
+    # Needed for mermaid shortcode or when nesting shortcodes (e.g. img within
+    # columns or tabs)
     renderer:
       unsafe: true
   tableOfContents:
@@ -179,8 +180,7 @@ params:
   # per page if enabled. Can be enabled per page via 'geekdocCollapseSection'.
   geekdocCollapseAllSections: true
 
-  # (Optional, default true) Show page navigation links at the bottom of each
-  # docs page (bundle menu only).
+  # (Optional, default true) Show page navigation links at the bottom of each docs page.
   geekdocNextPrev: false
 
   # (Optional, default true) Show a breadcrumb navigation bar at the top of each docs page.
@@ -223,7 +223,7 @@ params:
   # by the 'img' shortcode.
   geekdocImageLazyLoading: true
 
-  # (Optional, default false) Set HTMl <base> to .Site.BaseURL if enabled. It might be required
+  # (Optional, default false) Set HTMl <base> to .Site.Home.Permalink if enabled. It might be required
   # if a subdirectory is used within Hugos BaseURL.
   # See https://developer.mozilla.org/de/docs/Web/HTML/Element/base.
   geekdocOverwriteHTMLBase: false

exampleSite/content/en/usage/getting-started.md

@@ -44,7 +44,7 @@ To prepare your new site environment just a few steps are required:
 
 3. Install the Geekdoc theme from a [release bundle](#option-1-download-pre-build-release-bundle) (recommended) or from [Git branch](#option-2-clone-the-github-repository).
 
-4. Create the minimal required Hugo configuration `config.toml`. For all configuration options take a look at the [configuration](/usage/configuration/) page.
+4. Create the minimal required Hugo configuration `config.toml`. For all configuration options take a look at the [configuration page](/usage/configuration/).
 
    ```toml
    baseURL = "http://localhost"
@@ -64,7 +64,8 @@ To prepare your new site environment just a few steps are required:
    # Needed for mermaid shortcodes
    [markup]
      [markup.goldmark.renderer]
-       # Needed for mermaid shortcode
+       # Needed for mermaid shortcode or when nesting shortcodes (e.g. img within
+       # columns or tabs)
        unsafe = true
      [markup.tableOfContents]
        startLevel = 1
@@ -80,6 +81,8 @@ To prepare your new site environment just a few steps are required:
    hugo server -D
    ```
 
+   The `-D` or `--buildDrafts` option is used to include content marked as draft during the build. It is used because content pages created with the `hugo new content` command have the `draft` flag set by default and this can lead to build errors in newly created projects. For projects with a production-ready content structure, this flag is not required in most cases and can be omitted.
+
 ### Option 1: Download pre-build release bundle
 
 Download and extract the latest release bundle into the theme directory.
@@ -92,7 +95,6 @@ curl -L https://github.com/thegeeklab/hugo-geekdoc/releases/latest/download/hugo
 ### Option 2: Clone the GitHub repository
 
 {{< hint type=note >}}
-**Info**\
 Keep in mind this method is not recommended and needs some extra steps to get it working.
 If you want to use the Theme as submodule keep in mind that your build process need to
 run the described steps as well.
@@ -119,12 +121,17 @@ There are several ways to deploy your site with this theme on Netlify. Regardles
 
 Here are some possible solutions:
 
-**Use a Makefile:**
+#### Use a Makefile
 
 Add a Makefile to your repository to bundle the required steps.
 
+{{< hint type=important >}}
+The `Makefile` is only an example. Depending on your project structure, `BASEDIR` or `THEMEDIR` may need to be adapted.
+{{< /hint >}}
+
 ```makefile
-THEME_VERSION := v0.8.2
+# Please change the theme version to the latest release version.
+THEME_VERSION := v0.44.1
 THEME := hugo-geekdoc
 BASEDIR := docs
 THEMEDIR := $(BASEDIR)/themes
@@ -147,7 +154,7 @@ clean:
 	rm -rf $(BASEDIR)/public
 ```
 
-This Makefile can be used in your `netlify.toml`, take a look at the Netlify [example](https://docs.netlify.com/configure-builds/file-based-configuration/#sample-netlify-toml-file) for more information:
+This Makefile can be used in your `netlify.toml`, take a look at the [Netlify example](https://docs.netlify.com/configure-builds/file-based-configuration/#sample-netlify-toml-file) for more information:
 
 ```toml
 [build]
@@ -155,7 +162,7 @@ publish = "docs/public"
 command = "make doc"
 ```
 
-**Chain required commands:**
+#### Chain required commands
 
 Chain all required commands to prepare the theme and build your site on the `command` option in your `netlify.toml` like this:
 
@@ -168,7 +175,6 @@ command = "command1 && command 2 && command3 && hugo"
 ### Subdirectories
 
 {{< hint type=important >}}
-**Warning**\
 As deploying Hugo sites on subdirectories is not as robust as on subdomains, we do not recommend this.
 If you have a choice, using a domain/subdomain should always be the preferred solution!
 {{< /hint >}}
@@ -193,7 +199,7 @@ Using `hugo --minify` without further configuration or using other minify tools
 
 After some testing we decided to not spend effort to fix this issue for now as the benefit is very low. There are some parts of the theme where spaces between HTML elements matters but were stripped by minify tools. Some of these issues are related to <!-- spellchecker-disable -->[gohugoio/hugo#6892](https://github.com/gohugoio/hugo/issues/6892).<!-- spellchecker-enable --> While recommendation like "don't depend on whitespace in your layout" sounds reasonable, it seems to be not that straight forward especially for something like embedded icons into the text flow.
 
-If you still want to use Hugo's minify flag you should at least exclude HTML file in your site [configuration](https://gohugo.io/getting-started/configuration/#configure-minify):
+If you still want to use Hugo's minify flag you should at least exclude HTML files in your site configuration as described in the [Hugo documentation](https://gohugo.io/getting-started/configuration/#configure-minify):
 
 ```toml
 [minify]

exampleSite/data/properties/shortcode-avatar.yaml

@@ -0,0 +1,18 @@
+---
+properties:
+  - name: name
+    type: string
+    description: Name of the image resource defined in page front matter.
+    required: true
+  - name: alt
+    type: string
+    description: Description text for the image.
+    required: false
+  - name: size
+    type: string
+    description: Thumbnail size. Supported values are `origin|tiny|small|medium|large`.
+    required: false
+  - name: anchor
+    type: string
+    description: "[Anchor](https://gohugo.io/content-management/image-processing/#anchor) to determine the placement of the crop box."
+    required: false

exampleSite/data/properties/shortcode-buttons.yaml

@@ -0,0 +1,19 @@
+---
+properties:
+  - name: href
+    type: string
+    description: The URL to use as target of the button.
+    required: false
+  - name: relref
+    type: string
+    description: Executes the [relref](https://gohugo.io/functions/urls/relref/) Hugo function to resolve the relative permalink of the specified page. The result is set as the target of the button.
+    required: false
+  - name: class
+    type: list
+    description: List of space-separated CSS class names to apply.
+    required: false
+  - name: size
+    type: string
+    description: Preset of different button sizes. Supported values are `regular|large`.
+    required: false
+    devaultValue: regular

exampleSite/data/properties/shortcode-columns.yaml

@@ -0,0 +1,7 @@
+---
+properties:
+  - name: size
+    type: string
+    description: Preset of different sizes for the _first_ column. Supported values are `small|regular|large`.
+    required: false
+    defaultValue: regular

exampleSite/data/properties/shortcode-hints.yaml

@@ -0,0 +1,15 @@
+---
+properties:
+  - name: type
+    type: string
+    description: Type of the hint. Supported values are `note|tip|important|caution|warning`.
+    required: false
+    defaultValue: note
+  - name: icon
+    type: string
+    description: Icon to use. The value need to be an icon from an [SVG sprite](/features/icon-sets/).
+    required: false
+  - name: title
+    type: string
+    description: Title text of the hint.
+    required: false

exampleSite/data/properties/shortcode-images.yaml

@@ -0,0 +1,19 @@
+---
+properties:
+  - name: name
+    type: string
+    description: Name of the image resource defined in page front matter.
+    required: true
+  - name: alt
+    type: string
+    description: Description text for the image.
+    required: false
+  - name: size
+    type: string
+    description: Thumbnail size. Supported values are `origin|tiny|small|medium|large`.
+    required: false
+  - name: lazy
+    type: bool
+    description: Enable/disable lazy loading for the image.
+    required: false
+    defaultValue: true

exampleSite/data/properties/shortcode-includes.yaml

@@ -0,0 +1,19 @@
+---
+properties:
+  - name: file
+    type: string
+    description: Path of the file (relative to the Hugo root) to include.
+    required: true
+  - name: language
+    type: string
+    description: Language for [syntax highlighting](https://gohugo.io/content-management/syntax-highlighting/#list-of-chroma-highlighting-languages).
+    required: false
+  - name: type
+    type: string
+    description: Special include type. Supported values are `html|page`. If not set the included file is rendered as markdown.
+    required: false
+  - name: options
+    type: bool
+    description: highlighting [options](https://gohugo.io/content-management/syntax-highlighting/#highlight-shortcode).
+    required: false
+    defaultValue: linenos=table

exampleSite/data/properties/shortcode-katex.yaml

@@ -0,0 +1,6 @@
+---
+properties:
+  - name: class
+    type: list
+    description: List of space-separated CSS class names to apply.
+    required: false

exampleSite/data/properties/shortcode-mermaid.yaml

@@ -0,0 +1,6 @@
+---
+properties:
+  - name: class
+    type: list
+    description: List of space-separated CSS class names to apply.
+    required: false

exampleSite/data/properties/shortcode-progress.yaml

@@ -0,0 +1,15 @@
+---
+properties:
+  - name: value
+    type: integer
+    description: Progress value.
+    required: false
+    defaultValue: 0
+  - name: icon
+    type: string
+    description: Icon to use. The value need to be an icon from an [SVG sprite](/features/icon-sets/).
+    required: false
+  - name: title
+    type: string
+    description: Title text of the progress bar.
+    required: false

exampleSite/data/properties/shortcode-propertylist.yaml

@@ -0,0 +1,15 @@
+---
+properties:
+  - name: name
+    type: string
+    description: Name of the file from the `data/properties/` directory.
+    required: true
+  - name: sort
+    type: string
+    description: Field name to use for sorting.
+    required: false
+  - name: order
+    type: string
+    description: Sort order, only applied if `sort` is set. Supported values are `asc|desc`.
+    required: false
+    defaultValue: asc

exampleSite/data/properties/shortcode-toc-tree.yaml

@@ -0,0 +1,8 @@
+---
+properties:
+  - name: sortBy
+    type: string
+    description: |
+      Override the default sort parameter set by [`geekdocFileTreeSortBy`](/usage/configuration/#site-configuration).
+    required: false
+    defaultValue: .Site.Params.geekdocFileTreeSortBy

exampleSite/data/properties/shortcode-toc.yaml

@@ -0,0 +1,10 @@
+---
+properties:
+  - name: format
+    type: string
+    description: |
+      Format of the returned ToC. The `html` format creates an HTML wrapper to enable the `geekdocToC` parameter that limits
+      the maximum ToC level to be displayed. This variant also automatically inserts a horizontal line after the ToC. The `raw` format
+      returns the unformatted ToC, the parameter `geekdocToC` does not work in this mode. Supported values are `html|raw`.
+    required: false
+    defaultValue: html

i18n/am.yaml

@@ -0,0 +1,52 @@
+---
+edit_page: ገጹን ማስተካከያ
+
+nav_navigation: መሄጃ
+nav_tags: መለያዎች
+nav_more: ተጨማሪ
+nav_top: ወደ ላይ ተመለስ
+
+form_placeholder_search: ፈልግ
+
+error_page_title: ጠፋብዎት? አይጨነቁ።
+error_message_title: ጠፋብዎት?
+error_message_code: አልተገኘም
+error_message_text: >
+  ገጹን ማግኘት አልተቻለም፤ ነገር ግን አይጨነቁ፤ በዚህ <a class="gdoc-error__link" href="{{ . }}">ገጽ</a> መመለስ ይችላሉ።
+
+button_toggle_dark: ብሩህ/ጨለማ መቀያየሪያ
+button_nav_open: መሄጃውን ክፈት
+button_nav_close: መሄጃውን ዝጋ
+button_menu_open: ምርጫዎችን ክፈት
+button_menu_close: ምርጫዎችን ዝጋ
+button_homepage: ወደ መጀመሪያ ገጽ ተመለስ
+
+title_anchor_prefix: "ማያያዣ ወደ:"
+
+posts_read_more: ሙሉውን ያንብቡ
+posts_read_time:
+  one: "ለማንበብ አንድ ደቂቃ"
+  other: "{{ . }} ደቂቃዎች ለማንበብ"
+posts_update_prefix: መጨረሻ የዘመነው
+posts_count:
+  one: "አንድ ጽሑፍ"
+  other: "{{ . }} ጽሑፎች"
+posts_tagged_with: ከ '{{ . }}' ጋር የተዛመዱ ጽሑፎች በሙሉ
+
+footer_build_with: >
+  በ <a href="https://gohugo.io/" class="gdoc-footer__link">Hugo</a> የተገነባ ከ
+  <svg class="gdoc-icon gdoc_heart"><use xlink:href="#gdoc_heart"></use></svg> ጋር
+footer_legal_notice: ሕጋዊ መረጃዎች
+footer_privacy_policy: ስለ መረጃዎ አያያዝ ያለን አቋም
+footer_content_license_prefix: >
+  ስለ ይዘቱ ባለመብትነት መረጃ
+
+language_switch_no_tranlation_prefix: "ያልተተረጐመ ገጽ:"
+
+propertylist_required: ግድ የሚያስፈልግ
+propertylist_optional: ግድ ያልሆነ
+propertylist_default: በባዶ ፈንታ
+
+pagination_page_prev: ያለፈው
+pagination_page_next: ቀጣይ
+pagination_page_state: "{{ .PageNumber }}/{{ .TotalPages }}"

i18n/fr.yaml

@@ -0,0 +1,53 @@
+---
+edit_page: Editer la page
+
+nav_navigation: Navigation
+nav_tags: Tags
+nav_more: Plus
+nav_top: Retour au haut de page
+
+form_placeholder_search: Chercher
+
+error_page_title: Perdu? Ne t'inquiète pas
+error_message_title: Perdu?
+error_message_code: Error 404
+error_message_text: >
+  On dirait que ce que vous cherchez est introuvable. Ne vous inquiétez pas, nous pouvons
+  vous ramèner à la <a class="gdoc-error__link" href="{{ . }}">page d'accueil</a>.
+
+button_toggle_dark: Basculer le mode Sombre/Clair/Auto
+button_nav_open: Ouvrir la navigation
+button_nav_close: Fermer la navigation
+button_menu_open: Ouvrir la barre de menus
+button_menu_close: Fermer la barre de menus
+button_homepage: retour à la page d'accueil
+
+title_anchor_prefix: "Ancrer à :"
+
+posts_read_more: Lire l'article complet
+posts_read_time:
+  one: "Une minute pour lire"
+  other: "{{ . }} minutes à lire"
+posts_update_prefix: Mis à jour le
+posts_count:
+  one: "Un billet"
+  other: "{{ . }} billets"
+posts_tagged_with: Tous les articles marqués avec '{{ . }}'
+
+footer_build_with: >
+  Construit avec <a href="https://gohugo.io/" class="gdoc-footer__link">Hugo</a> et
+  <svg class="gdoc-icon gdoc_heart"><use xlink:href="#gdoc_heart"></use></svg>
+footer_legal_notice: Mentions légales
+footer_privacy_policy: Politique de confidentialité
+footer_content_license_prefix: >
+  Contenu sous licence
+
+language_switch_no_tranlation_prefix: "Page non traduite:"
+
+propertylist_required: requis
+propertylist_optional: facultatif
+propertylist_default: défaut
+
+pagination_page_prev: précédent
+pagination_page_next: suivant
+pagination_page_state: "{{ .PageNumber }}/{{ .TotalPages }}"

layouts/404.html

@@ -27,7 +27,7 @@
             <div class="gdoc-error__line gdoc-error__title">{{ i18n "error_message_title" }}</div>
             <div class="gdoc-error__line gdoc-error__code">{{ i18n "error_message_code" }}</div>
             <div class="gdoc-error__line gdoc-error__help">
-              {{ i18n "error_message_text" .Site.BaseURL | safeHTML }}
+              {{ i18n "error_message_text" .Site.Home.Permalink | safeHTML }}
             </div>
           </div>
         </div>

layouts/_default/baseof.html

@@ -48,9 +48,16 @@
           {{ template "main" . }}
 
 
+          {{ $showPrevNext := (default true .Site.Params.geekdocNextPrev) }}
+          {{ if $showPrevNext }}
           <div class="gdoc-page__footer flex flex-wrap justify-between">
-            {{ partial "menu-nextprev" . }}
+            {{ if .Site.Params.geekdocMenuBundle }}
+              {{ partial "menu-bundle-np" . }}
+            {{ else }}
+              {{ partial "menu-filetree-np" . }}
+            {{ end }}
           </div>
+          {{ end }}
         </div>
       </main>
 

layouts/partials/head/others.html

@@ -67,7 +67,7 @@
 {{- end }}
 
 {{- if (default false $.Site.Params.geekdocOverwriteHTMLBase) }}
-  <base href="{{ .Site.BaseURL }}" />
+  <base href="{{ .Site.Home.Permalink }}" />
 {{- end }}
 
 {{ printf "<!-- %s -->" "Made with Geekdoc theme https://github.com/thegeeklab/hugo-geekdoc" | safeHTML }}

layouts/partials/menu-bundle-np.html

@@ -6,9 +6,9 @@
 {{ $current.Scratch.Set "nextPage" false }}
 {{ $current.Scratch.Set "prevPage" false }}
 
-{{ template "menu_nextprev" dict "sect" $.Site.Data.menu.main.main "current" $current "site" $site }}
+{{ template "menu-bundle-np" dict "sect" $.Site.Data.menu.main.main "current" $current "site" $site }}
 
-{{ define "menu_nextprev" }}
+{{ define "menu-bundle-np" }}
   {{ $current := .current }}
   {{ $site := .site }}
 
@@ -44,13 +44,11 @@
 
     {{ $sub := default false .sub }}
     {{ if $sub }}
-      {{ template "menu_nextprev" dict "sect" $sub "current" ($current.Scratch.Get "current") "site" ($current.Scratch.Get "site") }}
+      {{ template "menu-bundle-np" dict "sect" $sub "current" ($current.Scratch.Get "current") "site" ($current.Scratch.Get "site") }}
     {{ end }}
   {{ end }}
 {{ end }}
 
-{{ $showPrevNext := (and (default true .Site.Params.geekdocNextPrev) .Site.Params.geekdocMenuBundle) }}
-{{ if $showPrevNext }}
 <span class="gdoc-page__nav">
   {{ with ($current.Scratch.Get "prevPage") }}
     <a
@@ -75,4 +73,3 @@
     </a>
   {{ end }}
 </span>
-{{ end }}

layouts/partials/menu-bundle.html

@@ -52,7 +52,7 @@
                   <svg class="gdoc-icon {{ .icon }}"><use xlink:href="#{{ .icon }}"></use></svg>
                 {{ end }}
                 <a
-                  href="{{ if .external }}
+                  href="{{ if .external -}}
                     {{ .ref }}
                   {{- else -}}
                     {{ path.Join $this.RelPermalink $anchor }}

layouts/partials/menu-extra.html

@@ -27,11 +27,11 @@
       {{ if eq $target "header" }}
         <span>
           <a
-            href="{{ if .external }}
+            href="{{ if .external -}}
               {{ .ref }}
-            {{ else }}
+            {{- else -}}
               {{ relref $current .ref }}
-            {{ end }}"
+            {{- end }}"
             class="gdoc-header__link"
           >
             <svg class="gdoc-icon {{ .icon }}">

layouts/partials/menu-filetree-np.html

@@ -0,0 +1,107 @@
+{{ $current := . }}
+{{ $site := .Site }}
+{{ $current.Scratch.Set "prev" false }}
+{{ $current.Scratch.Set "getNext" false }}
+
+{{ $current.Scratch.Set "nextPage" false }}
+{{ $current.Scratch.Set "prevPage" false }}
+
+{{ template "menu-filetree-np" dict "sect" .Site.Home.Sections "current" $current "site" $site }}
+
+{{ define "menu-filetree-np" }}
+  {{ $current := .current }}
+  {{ $site := .site }}
+
+  {{ $sortBy := (default "title" .current.Site.Params.geekdocFileTreeSortBy | lower) }}
+  {{ range .sect.GroupBy "Weight" }}
+    {{ $rangeBy := .ByTitle }}
+
+    {{ if eq $sortBy "title" }}
+      {{ $rangeBy = .ByTitle }}
+    {{ else if eq $sortBy "linktitle" }}
+      {{ $rangeBy = .ByLinkTitle }}
+    {{ else if eq $sortBy "date" }}
+      {{ $rangeBy = .ByDate }}
+    {{ else if eq $sortBy "publishdate" }}
+      {{ $rangeBy = .ByPublishDate }}
+    {{ else if eq $sortBy "expirydate" }}
+      {{ $rangeBy = .ByExpiryDate }}
+    {{ else if eq $sortBy "lastmod" }}
+      {{ $rangeBy = .ByLastmod }}
+    {{ else if eq $sortBy "title_reverse" }}
+      {{ $rangeBy = .ByTitle.Reverse }}
+    {{ else if eq $sortBy "linktitle_reverse" }}
+      {{ $rangeBy = .ByLinkTitle.Reverse }}
+    {{ else if eq $sortBy "date_reverse" }}
+      {{ $rangeBy = .ByDate.Reverse }}
+    {{ else if eq $sortBy "publishdate_reverse" }}
+      {{ $rangeBy = .ByPublishDate.Reverse }}
+    {{ else if eq $sortBy "expirydate_reverse" }}
+      {{ $rangeBy = .ByExpiryDate.Reverse }}
+    {{ else if eq $sortBy "lastmod_reverse" }}
+      {{ $rangeBy = .ByLastmod.Reverse }}
+    {{ end }}
+
+    {{ range $rangeBy }}
+      {{ $current.Scratch.Set "current" $current }}
+      {{ $current.Scratch.Set "site" $site }}
+
+      {{ if not .Params.geekdocHidden }}
+        {{ $numberOfPages := (add (len .Pages) (len .Sections)) }}
+        {{ $site := $current.Scratch.Get "site" }}
+        {{ $this := . }}
+        {{ $current := $current.Scratch.Get "current" }}
+
+        {{ $current.Scratch.Set "refName" (partial "utils/title" .) }}
+        {{ $name := $current.Scratch.Get "refName" }}
+
+        {{ if $current.Scratch.Get "getNext" }}
+          {{ if or $this.Content $this.Params.geekdocFlatSection }}
+            {{ $current.Scratch.Set "nextPage" (dict "name" $name "this" $this) }}
+            {{ $current.Scratch.Set "getNext" false }}
+          {{ end }}
+        {{ end }}
+
+        {{ if eq $current.RelPermalink $this.RelPermalink }}
+          {{ $current.Scratch.Set "prevPage" ($current.Scratch.Get "prev") }}
+          {{ $current.Scratch.Set "getNext" true }}
+        {{ end }}
+
+        {{ if or $this.Content $this.Params.geekdocFlatSection }}
+          {{ $current.Scratch.Set "prev" (dict "name" $name "this" $this) }}
+        {{ end }}
+
+        {{ $sub := and (ne $numberOfPages 0) (not .Params.geekdocFlatSection) }}
+        {{ if $sub }}
+          {{ template "menu-filetree-np" dict "sect" .Pages "current" $current }}
+        {{ end }}
+      {{ end }}
+    {{ end }}
+
+  {{ end }}
+{{ end }}
+
+<span class="gdoc-page__nav">
+  {{ with ($current.Scratch.Get "prevPage") }}
+    <a
+      class="gdoc-page__nav--prev flex align-center"
+      href="{{ .this.RelPermalink }}"
+      title="{{ .name }}"
+    >
+      <i class="gdoc-icon">gdoc_arrow_left_alt</i>
+      {{ .name }}
+    </a>
+  {{ end }}
+</span>
+<span class="gdoc-page__nav">
+  {{ with ($current.Scratch.Get "nextPage") }}
+    <a
+      class="gdoc-page__nav--next flex align-center"
+      href="{{ .this.RelPermalink }}"
+      title="{{ .name }}"
+    >
+      {{ .name }}
+      <i class="gdoc-icon">gdoc_arrow_right_alt</i>
+    </a>
+  {{ end }}
+</span>

layouts/partials/microformats/schema.html

@@ -5,7 +5,7 @@
       "@context": "http://schema.org",
       "@type": "WebSite",
       "name": {{ .Site.Title }},
-      "url": {{ .Site.BaseURL }},
+      "url": {{ .Site.Home.Permalink }},
       {{- with partial "utils/description" . }}
       "description": "{{ . | plainify | htmlUnescape | chomp }}",
       {{- end }}
@@ -57,7 +57,7 @@
       "publisher":{
           "@type":"Organization",
           "name": {{ .Site.Title }},
-          "url": {{ .Site.BaseURL }},
+          "url": {{ .Site.Home.Permalink }},
           "logo": {
               "@type": "ImageObject",
               "url": {{ (default "brand.svg" .Site.Params.logo) | absURL }},

layouts/partials/search.html

@@ -8,7 +8,7 @@
       placeholder="{{ i18n "form_placeholder_search" }}..."
       aria-label="{{ i18n "form_placeholder_search" }}"
       maxlength="64"
-      data-site-base-url="{{ .Site.BaseURL }}"
+      data-site-base-url="{{ "" | absURL }}"
       data-site-lang="{{ .Site.Language.Lang }}"
     />
     <ul id="gdoc-search-results" class="gdoc-search__list"></ul>

layouts/partials/site-header.html

@@ -13,7 +13,7 @@
       </label>
     {{ end }}
     <div>
-      <a class="gdoc-brand gdoc-header__link" href="{{ .Root.Site.BaseURL }}">
+      <a class="gdoc-brand gdoc-header__link" href="{{ .Root.Site.Home.Permalink }}">
         <span class="flex align-center">
           <img
             class="gdoc-brand__img"
@@ -47,7 +47,7 @@
         </span>
 
         <span class="gdoc-menu-header__home">
-          <a href="{{ .Root.Site.BaseURL }}" class="gdoc-header__link">
+          <a href="{{ .Root.Site.Home.Permalink }}" class="gdoc-header__link">
             <svg class="gdoc-icon gdoc_home">
               <title>{{ i18n "button_homepage" }}</title>
               <use xlink:href="#gdoc_home"></use>

layouts/shortcodes/avatar.html

@@ -0,0 +1,57 @@
+{{- $source := ($.Page.Resources.ByType "image").GetMatch (printf "%s" (.Get "name")) }}
+{{- $customAlt := .Get "alt" }}
+{{- $customSize := .Get "size" | lower }}
+{{- $customAnchor := default "smart" (.Get "anchor") | title }}
+{{- $data := newScratch }}
+
+{{- with $source }}
+  {{- $caption := default .Title $customAlt }}
+  {{- $isSVG := (eq .MediaType.SubType "svg") }}
+  {{- $origin := . -}}
+
+  {{- if $isSVG }}
+    {{- $data.SetInMap "size" "tiny" "160" }}
+    {{- $data.SetInMap "size" "small" "300" }}
+    {{- $data.SetInMap "size" "medium" "600" }}
+    {{- $data.SetInMap "size" "large" "900" }}
+  {{- else }}
+    {{- $data.SetInMap "size" "tiny" (printf "160x160 %s" $customAnchor) }}
+    {{- $data.SetInMap "size" "small" (printf "300x300 %s" $customAnchor) }}
+    {{- $data.SetInMap "size" "medium" (printf "600x600 %s" $customAnchor) }}
+    {{- $data.SetInMap "size" "large" (printf "900x900 %s" $customAnchor) }}
+  {{- end -}}
+
+  <div class="flex justify-center">
+    <figure
+      class="gdoc-markdown__figure gdoc-markdown__figure--round">
+      <a class="gdoc-markdown__link--raw" href="{{ .Permalink }}">
+        <picture>
+          {{- $size := $data.Get "size" }}
+          {{- if not $isSVG }}
+            {{- if ne $customSize "origin" }}
+            <source
+              {{- if $customSize }}
+                srcset="{{ ($origin.Fill (index $size $customSize)).Permalink }}"
+              {{- else }}
+                srcset="{{ ($origin.Fill (index $size "small")).Permalink }} 600w, {{ ($origin.Fill (index $size "medium")).Permalink }} 1200w" sizes="100vw"
+              {{- end }}
+            />
+            {{- end }}
+          {{- end }}
+          <img
+          {{- if $isSVG }}
+            src="{{ $origin.Permalink }}" width="{{ index $size (default "medium" $customSize) }}"
+          {{- else }}
+            {{- if eq $customSize "origin" }}
+              src="{{ $origin.Permalink }}"
+            {{- else }}
+              src="{{ ($origin.Fill (index $size "large")).Permalink }}"
+            {{- end }}
+            alt="{{ $caption }}"
+          {{- end }}
+          />
+        </picture>
+      </a>
+    </figure>
+  </div>
+{{- end }}

layouts/shortcodes/img.html

@@ -7,56 +7,51 @@
 {{- with $source }}
   {{- $caption := default .Title $customAlt }}
   {{- $isSVG := (eq .MediaType.SubType "svg") }}
+  {{- $origin := . }}
 
-  {{- $origin := .Permalink }}
   {{- if $isSVG }}
-    {{- $data.SetInMap "size" "profile" "180" }}
     {{- $data.SetInMap "size" "tiny" "320" }}
     {{- $data.SetInMap "size" "small" "600" }}
     {{- $data.SetInMap "size" "medium" "1200" }}
     {{- $data.SetInMap "size" "large" "1800" }}
   {{- else }}
-    {{- $data.SetInMap "size" "profile" (.Fill "180x180 Center").Permalink }}
-    {{- $data.SetInMap "size" "tiny" (.Resize "320x").Permalink }}
-    {{- $data.SetInMap "size" "small" (.Resize "600x").Permalink }}
-    {{- $data.SetInMap "size" "medium" (.Resize "1200x").Permalink }}
-    {{- $data.SetInMap "size" "large" (.Resize "1800x").Permalink }}
-  {{- end }}
-
+    {{- $data.SetInMap "size" "tiny" "320x"}}
+    {{- $data.SetInMap "size" "small" "600x" }}
+    {{- $data.SetInMap "size" "medium" "1200x" }}
+    {{- $data.SetInMap "size" "large" "1800x" }}
+  {{- end -}}
 
   <div class="flex justify-center">
-    <figure
-      class="gdoc-markdown__figure
-      {{- if eq $customSize "profile" }}{{ print " gdoc-post__figure--round" }}{{ end }}"
-    >
+    <figure class="gdoc-markdown__figure">
       <a class="gdoc-markdown__link--raw" href="{{ .Permalink }}">
         <picture>
           {{- $size := $data.Get "size" }}
           {{- if not $isSVG }}
+            {{- if ne $customSize "origin" }}
             <source
-              {{- with $customSize }}
-                srcset="{{ index $size $customSize }}"
+              {{- if $customSize }}
+                srcset="{{ ($origin.Resize (index $size $customSize)).Permalink }}"
               {{- else }}
-                srcset="{{ $size.small }} 600w, {{ $size.medium }} 1200w" sizes="100vw"
+                srcset="{{ ($origin.Resize (index $size "small")).Permalink }} 600w, {{ ($origin.Resize (index $size "medium")).Permalink }} 1200w" sizes="100vw"
               {{- end }}
             />
             {{- end }}
+          {{- end }}
           <img
             {{- if $isSVG }}
-              src="{{ $origin }}" width="{{ index $size (default "medium" $customSize) }}"
+              src="{{ $origin.Permalink }}" width="{{ index $size (default "medium" $customSize) }}"
             {{- else }}
               {{- if $lazyLoad }}{{ print " loading=\"lazy\"" | safeHTMLAttr }}{{- end }}
               {{- if eq $customSize "origin" }}
-                src="{{ $origin }}"
+                src="{{ $origin.Permalink }}"
               {{- else }}
-                src="{{ $size.large }}"
+                src="{{ ($origin.Resize (index $size "large")).Permalink }}"
               {{- end }}
               alt="{{ $caption }}"
             {{- end }}
           />
         </picture>
       </a>
-      {{- if not (eq $customSize "profile") }}
       {{- with $caption }}
         <figcaption>
           {{ . }}
@@ -65,7 +60,6 @@
           {{- end }}
         </figcaption>
       {{- end }}
-      {{- end }}
     </figure>
   </div>
 {{- end }}

layouts/shortcodes/propertylist.html

@@ -11,7 +11,8 @@
         {{- $properties = (sort $properties . $order) }}
       {{- end }}
       {{- range $properties }}
-        <dt class="flex flex-wrap align-center gdoc-props__meta"{{ if $showAnchor }} id="{{ anchorize .name }}"{{ end }}>
+        {{- $uniqueAnchor := anchorize (printf "%s-%s" $name .name) | safeHTML }}
+        <dt class="flex flex-wrap align-center gdoc-props__meta"{{ if $showAnchor }} id="{{ $uniqueAnchor }}"{{ end }}>
           <span class="gdoc-props__title">{{ .name }}</span>
           {{- if .required }}
             <span class="gdoc-props__tag warning">{{ i18n "propertylist_required" | lower }}</span>
@@ -32,7 +33,7 @@
             {{- end }}
           {{- end }}
           {{- if $showAnchor }}
-          <a data-clipboard-text="{{ .Page.Permalink }}#{{ anchorize .name | safeHTML }}" class="gdoc-page__anchor clip flex align-center" title="{{ i18n "title_anchor_prefix" }} {{ .name | safeHTML }}" aria-label="{{ i18n "title_anchor_prefix" }} {{ .name | safeHTML }}" href="#{{ anchorize .name | safeHTML }}">
+          <a data-clipboard-text="{{ .Page.Permalink }}#{{ $uniqueAnchor }}" class="gdoc-page__anchor clip flex align-center" title="{{ i18n "title_anchor_prefix" }} {{ .name | safeHTML }}" aria-label="{{ i18n "title_anchor_prefix" }} {{ .name | safeHTML }}" href="#{{ $uniqueAnchor }}">
             <svg class="gdoc-icon gdoc_link"><use xlink:href="#gdoc_link"></use></svg>
           </a>
           {{- end }}

layouts/shortcodes/toc-tree.html

@@ -1,8 +1,10 @@
+{{- $current := . }}
 {{- $tocLevels := default (default 6 .Site.Params.geekdocToC) .Page.Params.geekdocToC }}
+{{- $sortBy := (default (default "title" .Site.Params.geekdocFileTreeSortBy) (.Get "sortBy") | lower) }}
 
 {{- if $tocLevels }}
   <div class="gdoc-toc gdoc-toc__level--{{ $tocLevels }}">
-    {{ template "toc-tree" dict "sect" .Page.Pages }}
+    {{ template "toc-tree" dict "sect" .Page.Pages "current" $current "sortBy" $sortBy }}
   </div>
 {{- end }}
 
@@ -10,8 +12,36 @@
 <!-- templates -->
 {{- define "toc-tree" }}
   <ul>
-    {{- range .sect.GroupBy "Weight" }}
-      {{- range .ByTitle }}
+    {{ range .sect.GroupBy "Weight" }}
+      {{ $rangeBy := .ByTitle }}
+
+      {{ if eq $.sortBy "title" }}
+        {{ $rangeBy = .ByTitle }}
+      {{ else if eq $.sortBy "linktitle" }}
+        {{ $rangeBy = .ByLinkTitle }}
+      {{ else if eq $.sortBy "date" }}
+        {{ $rangeBy = .ByDate }}
+      {{ else if eq $.sortBy "publishdate" }}
+        {{ $rangeBy = .ByPublishDate }}
+      {{ else if eq $.sortBy "expirydate" }}
+        {{ $rangeBy = .ByExpiryDate }}
+      {{ else if eq $.sortBy "lastmod" }}
+        {{ $rangeBy = .ByLastmod }}
+      {{ else if eq $.sortBy "title_reverse" }}
+        {{ $rangeBy = .ByTitle.Reverse }}
+      {{ else if eq $.sortBy "linktitle_reverse" }}
+        {{ $rangeBy = .ByLinkTitle.Reverse }}
+      {{ else if eq $.sortBy "date_reverse" }}
+        {{ $rangeBy = .ByDate.Reverse }}
+      {{ else if eq $.sortBy "publishdate_reverse" }}
+        {{ $rangeBy = .ByPublishDate.Reverse }}
+      {{ else if eq $.sortBy "expirydate_reverse" }}
+        {{ $rangeBy = .ByExpiryDate.Reverse }}
+      {{ else if eq $.sortBy "lastmod_reverse" }}
+        {{ $rangeBy = .ByLastmod.Reverse }}
+      {{ end }}
+
+      {{ range $rangeBy }}
         {{- if or (not .Params.geekdocHidden) (not (default true .Params.geekdocHiddenTocTree)) }}
           <li>
             {{- if or .Content .Params.geekdocFlatSection }}

package.json

@@ -19,7 +19,9 @@
     "prep:clean-all": "shx rm -rf VERSION .lighthouseci/ lhci_reports/ build/ dist/ static/ data/ assets/sprites/ exampleSite/data/sprites/ exampleSite/public/ exampleSite/resources/ exampleSite/.hugo_build.lock",
     "prep:make": "shx mkdir -p build/icons/ build/fonts/ dist/",
     "svg-sprite-list": "run-s prep:make svg ; shx mkdir -p exampleSite/data/sprites/ ; shx cp build/fonts/GeekdocIcons.json exampleSite/data/sprites/geekdoc.json",
-    "lint": "eslint src/js/ --color"
+    "lint": "run-p lint:js lint:html",
+    "lint:js": "eslint src/js/ --color",
+    "lint:html": "html-validate exampleSite/public"
   },
   "repository": {
     "type": "git",
@@ -28,38 +30,40 @@
   "author": "Robert Kaussow",
   "license": "MIT",
   "engines": {
-    "node": ">=16.15 <=18"
+    "node": ">=18 <=20"
   },
   "dependencies": {
-    "@cfworker/json-schema": "1.12.7",
+    "@cfworker/json-schema": "1.12.8",
     "clipboard": "2.0.11",
-    "flexsearch": "0.7.31",
-    "katex": "0.16.8",
+    "flexsearch": "0.7.43",
+    "katex": "0.16.10",
     "lodash": "4.17.21",
-    "mermaid": "10.4.0",
-    "store2": "2.14.2"
+    "mermaid": "10.9.0",
+    "store2": "2.14.3",
+    "uuid": "9.0.1"
   },
   "devDependencies": {
-    "@babel/eslint-parser": "7.22.11",
+    "@babel/eslint-parser": "7.24.1",
     "@eloquent/git-version-webpack-plugin": "5.0.1",
-    "autoprefixer": "10.4.15",
-    "copy-webpack-plugin": "11.0.0",
-    "css-loader": "6.8.1",
-    "eslint": "8.48.0",
-    "eslint-config-prettier": "9.0.0",
-    "eslint-plugin-prettier": "5.0.0",
-    "favicons": "7.1.4",
-    "npm-run-all": "4.1.5",
-    "postcss-loader": "7.3.3",
-    "prettier": "3.0.3",
-    "sass": "1.66.1",
-    "sass-loader": "13.3.2",
+    "autoprefixer": "10.4.19",
+    "copy-webpack-plugin": "12.0.2",
+    "css-loader": "7.1.1",
+    "eslint": "8.57.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-prettier": "5.1.3",
+    "favicons": "7.2.0",
+    "favicons-webpack-plugin": "6.0.1",
+    "html-validate": "8.18.1",
+    "npm-run-all2": "6.1.2",
+    "postcss-loader": "8.1.1",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.0",
     "shx": "0.3.4",
-    "svg-sprite": "2.0.2",
-    "svgtofont": "4.0.0",
-    "webpack": "5.88.2",
+    "svg-sprite": "2.0.4",
+    "svgtofont": "4.2.0",
+    "webpack": "5.91.0",
     "webpack-cli": "5.1.4",
-    "webpack-favicons": "1.3.8",
     "webpack-manifest-plugin": "5.0.0",
     "webpack-remove-empty-scripts": "1.0.4"
   },

src/js/app.js

@@ -1,26 +0,0 @@
-const { createCopyButton } = require("./copycode.js")
-const Clipboard = require("clipboard")
-
-document.addEventListener("DOMContentLoaded", function (event) {
-  let clipboard = new Clipboard(".clip")
-
-  clipboard.on("success", function (e) {
-    const trigger = e.trigger
-
-    if (trigger.hasAttribute("data-copy-feedback")) {
-      trigger.classList.add("gdoc-post__codecopy--success", "gdoc-post__codecopy--out")
-      trigger.querySelector(".gdoc-icon.copy").classList.add("hidden")
-      trigger.querySelector(".gdoc-icon.check").classList.remove("hidden")
-
-      setTimeout(function () {
-        trigger.classList.remove("gdoc-post__codecopy--success", "gdoc-post__codecopy--out")
-        trigger.querySelector(".gdoc-icon.copy").classList.remove("hidden")
-        trigger.querySelector(".gdoc-icon.check").classList.add("hidden")
-      }, 3000)
-    }
-
-    e.clearSelection()
-  })
-
-  document.querySelectorAll(".highlight").forEach((highlightDiv) => createCopyButton(highlightDiv))
-})

src/js/colorTheme.js

@@ -1,6 +1,5 @@
-const Storage = require("store2")
-const { TOGGLE_COLOR_THEMES, THEME, COLOR_THEME_AUTO } = require("./config.js")
-
+import Storage from "store2"
+import { TOGGLE_COLOR_THEMES, THEME, COLOR_THEME_AUTO } from "./config.js"
 ;(() => {
   applyTheme()
 })()

src/js/index.js

@@ -1,4 +1,30 @@
-export function createCopyButton(highlightDiv) {
+import Clipboard from "clipboard"
+
+document.addEventListener("DOMContentLoaded", function (event) {
+  let clipboard = new Clipboard(".clip")
+
+  clipboard.on("success", function (e) {
+    const trigger = e.trigger
+
+    if (trigger.hasAttribute("data-copy-feedback")) {
+      trigger.classList.add("gdoc-post__codecopy--success", "gdoc-post__codecopy--out")
+      trigger.querySelector(".gdoc-icon.copy").classList.add("hidden")
+      trigger.querySelector(".gdoc-icon.check").classList.remove("hidden")
+
+      setTimeout(function () {
+        trigger.classList.remove("gdoc-post__codecopy--success", "gdoc-post__codecopy--out")
+        trigger.querySelector(".gdoc-icon.copy").classList.remove("hidden")
+        trigger.querySelector(".gdoc-icon.check").classList.add("hidden")
+      }, 3000)
+    }
+
+    e.clearSelection()
+  })
+
+  document.querySelectorAll(".highlight").forEach((highlightDiv) => createCopyButton(highlightDiv))
+})
+
+function createCopyButton(highlightDiv) {
   const button = document.createElement("span")
 
   let codeSelector = "pre > code"

src/js/katex.js

@@ -1,9 +1,4 @@
 import "katex/dist/katex.css"
+import renderMathInElement from "katex/dist/contrib/auto-render.mjs"
 
-document.addEventListener("DOMContentLoaded", function () {
-  import("katex/dist/contrib/auto-render")
-    .then(({ default: renderMathInElement }) => {
 renderMathInElement(document.body)
-    })
-    .catch((error) => console.error(error))
-})

src/js/mermaid.js

@@ -1,5 +1,8 @@
-const Storage = require("store2")
-const { COLOR_THEME_DARK, THEME, COLOR_THEME_AUTO } = require("./config.js")
+import Storage from "store2"
+import { v4 as uuidv4 } from "uuid"
+import { COLOR_THEME_DARK, THEME, COLOR_THEME_AUTO } from "./config.js"
+
+import mermaid from "mermaid"
 
 document.addEventListener("DOMContentLoaded", function (event) {
   let lstore = Storage.namespace(THEME)
@@ -16,15 +19,21 @@ document.addEventListener("DOMContentLoaded", function (event) {
     theme = "dark"
   }
 
-  import("mermaid")
-    .then(({ default: md }) => {
-      md.initialize({
+  mermaid.initialize({
+    startOnLoad: false,
     flowchart: { useMaxWidth: true },
     theme: theme,
     themeVariables: {
       darkMode: darkMode
     }
   })
+
+  document.querySelectorAll(".mermaid").forEach(function (el) {
+    let id = "graph-" + uuidv4()
+
+    mermaid.render(id, el.innerText).then(({ svg, bindFunctions }) => {
+      el.innerHTML = svg
+      bindFunctions?.(el)
+    })
   })
-    .catch((error) => console.error(error))
 })

src/js/search.js

@@ -1,7 +1,7 @@
-const groupBy = require("lodash/groupBy")
-const truncate = require("lodash/truncate")
-const { FlexSearch } = require("flexsearch/dist/flexsearch.compact")
-const { Validator } = require("@cfworker/json-schema")
+import groupBy from "lodash/groupBy"
+import truncate from "lodash/truncate"
+import Document from "flexsearch/dist/module/document"
+import { Validator } from "@cfworker/json-schema"
 
 document.addEventListener("DOMContentLoaded", function (event) {
   const input = document.querySelector("#gdoc-search-input")
@@ -66,7 +66,7 @@ function init(input, searchConfig) {
     store: ["title", "href", "parent", "description"]
   }
 
-  const index = new FlexSearch.Document(indexCfg)
+  const index = new Document(indexCfg)
   window.geekdocSearchIndex = index
 
   getJson(dataUrl, function (data) {

src/sass/_base.scss

@@ -577,9 +577,13 @@ svg.gdoc-icon {
   background: var(--footer-background);
   color: var(--footer-font-color);
 
-  .fake-link:hover {
+  .fake-link {
+    text-decoration: none;
+
+    &:hover {
       background-image: linear-gradient(var(--footer-link-color), var(--footer-link-color));
     }
+  }
 
   &__item {
     line-height: $padding-32;
@@ -590,6 +594,7 @@ svg.gdoc-icon {
   }
 
   &__link {
+    text-decoration: underline;
     color: var(--footer-link-color);
 
     &:visited {
@@ -764,6 +769,7 @@ svg.gdoc-icon {
 
   &__link,
   &__link:visited {
+    text-decoration: underline;
     color: var(--link-color);
   }
 
@@ -803,6 +809,7 @@ svg.gdoc-icon {
 
   a,
   a:visited {
+    text-decoration: none !important;
     color: var(--link-color);
   }
 }

src/sass/_markdown.scss

@@ -31,7 +31,7 @@
 
   a,
   &__link {
-    text-decoration: none;
+    text-decoration: underline;
     border-bottom: $border-1 solid transparent;
     line-height: normal;
 

src/sass/_shortcodes.scss

@@ -96,7 +96,7 @@
     box-shadow: 0 15px 60px var(--accent-color-light);
   }
 
-  .gdoc-post__anchor {
+  .gdoc-page__anchor {
     display: none;
   }
 }

webpack.config.js

@@ -3,7 +3,7 @@ const glob = require("glob")
 
 const { WebpackManifestPlugin } = require("webpack-manifest-plugin")
 const GitVersionPlugin = require("@eloquent/git-version-webpack-plugin")
-const WebpackFavicons = require("webpack-favicons")
+const FaviconsWebpackPlugin = require("favicons-webpack-plugin")
 const RemoveEmptyScriptsPlugin = require("webpack-remove-empty-scripts")
 const CopyPlugin = require("copy-webpack-plugin")
 const SRIPlugin = require("./webpack.plugins")
@@ -17,7 +17,7 @@ var config = {
       path.resolve("src", "sass", "mobile.scss"),
       path.resolve("src", "sass", "print.scss")
     ],
-    main: path.resolve("src", "js", "app.js"),
+    main: path.resolve("src", "js", "index.js"),
     colortheme: path.resolve("src", "js", "colorTheme.js"),
     mermaid: path.resolve("src", "js", "mermaid.js"),
     katex: [path.resolve("src", "js", "katex.js")].concat(
@@ -34,6 +34,7 @@ var config = {
   watchOptions: {
     ignored: ["/exampleSite/", "/node_modules/"]
   },
+  target: ["web", "es2017"],
   plugins: [
     new CopyPlugin({
       patterns: [
@@ -57,9 +58,11 @@ var config = {
       ]
     }),
 
-    new WebpackFavicons({
-      src: path.resolve("src", "static", "favicon", "favicon.svg"),
-      path: "favicon/",
+    new FaviconsWebpackPlugin({
+      logo: path.resolve("src", "static", "favicon", "favicon.svg"),
+      prefix: "favicon/",
+      inject: false,
+      favicons: {
         background: "#efefef",
         theme_color: "#efefef",
         icons: {
@@ -68,8 +71,8 @@ var config = {
           appleStartup: { offset: 10 },
           favicons: true,
           windows: { offset: 10 },
-        yandex: false,
-        coast: false
+          yandex: false
+        }
       }
     }),