diff --git a/.gitignore b/.gitignore
index 2042e769..f36f822b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -9,6 +9,7 @@
 /exampleSite/public/
 /exampleSite/config/development/
 CHANGELOG.md
+VERSION
 
 # translation envs
 exampleSite/content/de
diff --git a/README.md b/README.md
index 3b67dda5..3c0b5093 100644
--- a/README.md
+++ b/README.md
@@ -22,6 +22,12 @@ npm install
 
 # run the build script to build required assets
 npm run build
+
+# build release tarball
+echo "${VERSION:-development}" > VERSION
+tar czf "dist/hugo-geekdoc-${VERSION:-development}.tar.gz" \
+  archetypes assets data i18n images layouts static \
+  theme.toml LICENSE README.md VERSION
 ```
 
 See the [Getting Started Guide](https://geekdocs.de/usage/getting-started/) for details about the different setup options.
diff --git a/layouts/_default/_markup/render-codeblock-mermaid.html b/layouts/_default/_markup/render-codeblock-mermaid.html
new file mode 100644
index 00000000..79a2f05e
--- /dev/null
+++ b/layouts/_default/_markup/render-codeblock-mermaid.html
@@ -0,0 +1,12 @@
+<!-- prettier-ignore-start -->
+{{ if not (.Page.Scratch.Get "mermaid") }}
+  <!-- Include mermaid only first time -->
+  <script defer src="{{ index (index .Site.Data.assets "mermaid.js") "src" | relURL }}"></script>
+  {{ .Page.Scratch.Set "mermaid" true }}
+{{ end }}
+<!-- prettier-ignore-end -->
+
+{{ .Page.Scratch.Set "mermaid" true }}
+<pre class="gdoc-mermaid mermaid">
+  {{- .Inner -}}
+</pre>
diff --git a/src/js/mermaid.js b/src/js/mermaid.js
index 178d0297..263dd6df 100644
--- a/src/js/mermaid.js
+++ b/src/js/mermaid.js
@@ -23,6 +23,12 @@ document.addEventListener("DOMContentLoaded", function (event) {
         theme: theme,
         themeVariables: {
           darkMode: darkMode
+        },
+        mermaid: {
+          // Fix height of mermaid SVG elements (see https://github.com/mermaid-js/mermaid/issues/2481)
+          callback: (id) => {
+            document.getElementById(id).setAttribute("height", "100%")
+          }
         }
       })
     })