From 59fbf3cc1db8763a9003013d9ecb1758e67abb7e Mon Sep 17 00:00:00 2001 From: zzossig Date: Thu, 14 Nov 2019 12:31:02 +0900 Subject: [PATCH] missing resource added, mermaid, math type with katex support. flowchartjs in progress --- README.md | 1 + archetypes/math.md | 13 +++++ assets/sass/components/_mermaid.scss | 6 ++ assets/sass/main.scss | 1 + data/_config/_default/params.toml | 1 + data/lib.toml | 25 +++++++++ exampleSite/config.toml | 1 + .../content/posts/math-typesetting.mmark | 12 +--- layouts/_default/single.html | 3 +- layouts/partials/body/lib.html | 55 +++++++++++++++++++ layouts/partials/footer/select-theme.html | 11 ++++ layouts/partials/sidebar/sidebar-single.html | 10 ++-- layouts/shortcodes/flowchartjs.html | 3 + ...s_e680761d791774b6351b18d537b957bb.content | 2 +- 14 files changed, 128 insertions(+), 16 deletions(-) create mode 100644 archetypes/math.md create mode 100644 assets/sass/components/_mermaid.scss create mode 100644 data/lib.toml create mode 100644 layouts/partials/body/lib.html create mode 100644 layouts/shortcodes/flowchartjs.html diff --git a/README.md b/README.md index a5d7726..d1510dd 100644 --- a/README.md +++ b/README.md @@ -237,6 +237,7 @@ enableSidebarTags = true enableSidebarSeries = true enableSidebarCategories = true enableToc = true +enableTocSwitch = true itemsPerCategory = 5 enableSideSubscribe = false diff --git a/archetypes/math.md b/archetypes/math.md new file mode 100644 index 0000000..c94c069 --- /dev/null +++ b/archetypes/math.md @@ -0,0 +1,13 @@ +--- +title: "{{ replace .Name "-" " " | title }}" +date: {{ .Date }} +description: +tags: +- +series: +- +categories: +- +libraries: +- katex +--- diff --git a/assets/sass/components/_mermaid.scss b/assets/sass/components/_mermaid.scss new file mode 100644 index 0000000..1ef6094 --- /dev/null +++ b/assets/sass/components/_mermaid.scss @@ -0,0 +1,6 @@ +/* Mermaid.js div */ +div.mermaid { + width: 100%; + text-align: center; + margin-bottom: 1rem; +} diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 57b6950..59d1328 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -162,6 +162,7 @@ $gallery_mask_background_color: {{ $scr.Get "gallery_mask_background_color" }}; @import 'components/whoami'; @import 'components/switch'; @import 'components/subs'; +@import 'components/mermaid'; @import 'pages/body'; @import 'pages/home'; diff --git a/data/_config/_default/params.toml b/data/_config/_default/params.toml index 35dd588..0f41a3f 100644 --- a/data/_config/_default/params.toml +++ b/data/_config/_default/params.toml @@ -21,6 +21,7 @@ enableSidebarTags = true enableSidebarSeries = true enableSidebarCategories = true enableToc = true +enableTocSwitch = true itemsPerCategory = 5 enableSideSubscribe = false diff --git a/data/lib.toml b/data/lib.toml new file mode 100644 index 0000000..ac9bc10 --- /dev/null +++ b/data/lib.toml @@ -0,0 +1,25 @@ +# js +[js.mermaid] + sri = "sha256-yJ19uNiJfpYvIw0kAA8Io4TByKjEG2xX+7l9nItQw4o=" + url = "https://cdn.jsdelivr.net/npm/mermaid@8.4.2/dist/mermaid.min.js" + +[js.katex] + sri = "sha256-F/Xda58SPdcUCr+xhSGz9MA2zQBPb0ASEYKohl8UCHc=" + url = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" + +[js.katex_auto_render] + sri = "sha256-90d2pnfw0r4K8CZAWPko4rpFXQsZvJhTBGYNkipDprI=" + url = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" + +[js.flowchartjs] + sri = "sha256-xghRsaOFJXNxT9sgANknngHh3FjUQWrJUae7GP+2Atc=" + url = "https://cdn.jsdelivr.net/npm/flowchart.js@1.12.0/release/flowchart.min.js" + +[js.raphael] + sri = "sha256-TabprKdeNXbSesCWLMrcbWSDzUhpAdcNPe5Q53rn9Yg=" + url = "https://cdn.jsdelivr.net/npm/raphael@2.3.0/raphael.min.js" + +# css +[css.katex] + sri = "sha256-V8SV2MO1FUb63Bwht5Wx9x6PVHNa02gv8BgH/uH3ung=" + url = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" \ No newline at end of file diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 0c29270..ffe9bc3 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -47,6 +47,7 @@ rssLimit = 100 enableSidebarSeries = true enableSidebarCategories = true enableToc = true + enableTocSwitch = true itemsPerCategory = 5 enableSideSubscribe = false diff --git a/exampleSite/content/posts/math-typesetting.mmark b/exampleSite/content/posts/math-typesetting.mmark index 71cf582..32c82d4 100644 --- a/exampleSite/content/posts/math-typesetting.mmark +++ b/exampleSite/content/posts/math-typesetting.mmark @@ -3,8 +3,8 @@ author: Hugo Authors title: Math Typesetting date: 2019-03-08 description: A brief guide to setup KaTeX -markup: mmark -math: true +libraries: +- katex --- Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries. @@ -25,14 +25,6 @@ In this example we will be using [KaTeX](https://katex.org/) - To enable KaTex on a per page basis include the parameter `math: true` in content files. **Note:** Use the online reference of [Supported TeX Functions](https://katex.org/docs/supported.html) -{{< math.inline >}} -{{ if or .Page.Params.math .Site.Params.math }} - - - - -{{ end }} -{{}} ### Examples diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 6f99b58..d044c2b 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -7,7 +7,7 @@

{{ .Title }}

🕓 {{ .Date.Format (i18n "single-dateformat") }} · ☕{{ .ReadingTime }} min read
-
+
{{ .Content }}
@@ -17,6 +17,7 @@ {{ partial "body/related" . }} {{ partial "pagination/pagination-single" . }} {{ partial "body/photoswipe" . }} + {{ partial "body/lib" . }} diff --git a/layouts/partials/body/lib.html b/layouts/partials/body/lib.html new file mode 100644 index 0000000..fad4d06 --- /dev/null +++ b/layouts/partials/body/lib.html @@ -0,0 +1,55 @@ +{{ $js := .Site.Data.lib.js }} +{{ $css := .Site.Data.lib.css }} + +{{ if in .Params.Libraries "mermaid" }} + {{ printf "" $js.mermaid.url $js.mermaid.sri | safeHTML }} + +{{ end }} + +{{ if in .Params.Libraries "katex" }} + {{ printf "" $css.katex.url $css.katex.sri | safeHTML }} + {{ printf "" $js.katex.url $js.katex.sri | safeHTML }} + {{ printf "" $js.katex_auto_render.url $js.katex_auto_render.sri | safeHTML }} + +{{ end }} + +{{ if in .Params.Libraries "flowchartjs" }} + {{ printf "" $js.flowchartjs.url $js.flowchartjs.sri | safeHTML }} + {{ printf "" $js.raphael.url $js.raphael.sri | safeHTML }} + +{{ end }} \ No newline at end of file diff --git a/layouts/partials/footer/select-theme.html b/layouts/partials/footer/select-theme.html index e939460..7c318d2 100644 --- a/layouts/partials/footer/select-theme.html +++ b/layouts/partials/footer/select-theme.html @@ -49,5 +49,16 @@ } } }); + + if (mermaid) { + if (selectedThemeVariant === "dark" || selectedThemeVariant === "hacker") { + mermaid.initialize({ theme: 'dark' }); + location.reload(); + } else { + mermaid.initialize({ theme: 'default' }); + location.reload(); + } + + } }); \ No newline at end of file diff --git a/layouts/partials/sidebar/sidebar-single.html b/layouts/partials/sidebar/sidebar-single.html index dd96490..d30c5d5 100644 --- a/layouts/partials/sidebar/sidebar-single.html +++ b/layouts/partials/sidebar/sidebar-single.html @@ -4,10 +4,12 @@