💄 Add Mermaid theming to match colour scheme

pull/24/head
James Panther 2021-10-28 15:01:19 +11:00
parent acbcfacd6f
commit 6d1c51c037
No known key found for this signature in database
GPG Key ID: D36F789E45745D17
2 changed files with 5 additions and 1 deletions

View File

@ -15,6 +15,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
- Site name, author and menus will now render Markdown and Emoji - Site name, author and menus will now render Markdown and Emoji
- Bundled Mermaid for better vendor dependency management - Bundled Mermaid for better vendor dependency management
- Mermaid diagrams are now themed to match the configured colour scheme
## [1.4.0] - 2021-10-20 ## [1.4.0] - 2021-10-20

View File

@ -108,7 +108,10 @@
<script defer src="{{ $mermaidJS.RelPermalink }}" integrity="{{ $mermaidJS.Data.Integrity }}"></script> <script defer src="{{ $mermaidJS.RelPermalink }}" integrity="{{ $mermaidJS.Data.Integrity }}"></script>
<script> <script>
document.addEventListener('DOMContentLoaded', (event) => { document.addEventListener('DOMContentLoaded', (event) => {
mermaid.initialize({ theme: "default" }); function css(name) {
return getComputedStyle(document.documentElement).getPropertyValue(name);
}
mermaid.initialize({ theme: "base", themeVariables: { background: css("--color-neutral"), primaryColor: css("--color-primary-200"), secondaryColor: css("--color-secondary-200"), tertiaryColor: css("--color-neutral-100"), primaryBorderColor: css("--color-primary-400"), secondaryBorderColor: css("--color-secondary-400"), tertiaryBorderColor: css("--color-neutral-400"), lineColor: css("--color-neutral-600"), fontFamily: "ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,noto sans,sans-serif", fontSize: "16px" }});
}); });
</script> </script>
{{ end }} {{ end }}