From 57452565197ea1c7710f4b4592a1570bedda2945 Mon Sep 17 00:00:00 2001 From: Andreas Deininger Date: Mon, 31 Oct 2022 11:29:05 +0100 Subject: [PATCH 1/2] Mermaid diagrams: allow passing of parameters with codefence syntax --- exampleSite/content/shortcodes/mermaid.en.md | 9 +++++---- layouts/_default/_markup/render-codeblock-mermaid.html | 2 ++ 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/exampleSite/content/shortcodes/mermaid.en.md b/exampleSite/content/shortcodes/mermaid.en.md index 8944840bc3..07fa90a019 100644 --- a/exampleSite/content/shortcodes/mermaid.en.md +++ b/exampleSite/content/shortcodes/mermaid.en.md @@ -5,7 +5,7 @@ title = "Mermaid" The `mermaid` shortcode generates diagrams and flowcharts from text, in a similar manner as Markdown using the [Mermaid](https://mermaidjs.github.io/) library. -{{< mermaid >}} +{{< mermaid align="center" >}} graph LR; If --> Then Then --> Else @@ -33,7 +33,7 @@ To use codefence syntax you have to turn off `guessSyntax` for the `markup.highl {{% tab name="codefence" %}} ````md -```mermaid +```mermaid { align="center" } graph LR; If --> Then Then --> Else @@ -44,7 +44,7 @@ graph LR; {{% tab name="shortcode" %}} ````go -{{}} +{{}} graph LR; If --> Then Then --> Else @@ -58,6 +58,7 @@ graph LR; {{ partial "shortcodes/mermaid.html" (dict "context" . "content" "graph LR;\nIf --> Then\nThen --> Else" + "align" "center" )}} ```` @@ -69,7 +70,7 @@ The generated graphs can be be panned by dragging them and zoomed by using the m ### Parameter -Parameter are only supported when using shortcode or partial syntax. Defaults are used when using codefence syntax. +Passing parameters is supported for each available syntax (codefence, shortcode and partial). | Name | Default | Notes | |:----------------------|:-----------------|:------------| diff --git a/layouts/_default/_markup/render-codeblock-mermaid.html b/layouts/_default/_markup/render-codeblock-mermaid.html index e58431185b..005c4f1fda 100644 --- a/layouts/_default/_markup/render-codeblock-mermaid.html +++ b/layouts/_default/_markup/render-codeblock-mermaid.html @@ -1,4 +1,6 @@ +{{ .Attributes }} {{- partial "shortcodes/mermaid.html" (dict "context" . "content" .Inner + "align" (index .Attributes "align") ) }} \ No newline at end of file From 1f040fa2628ff117d36c21333b39a592f68357ee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=B6ren=20Weber?= Date: Mon, 31 Oct 2022 15:15:50 +0100 Subject: [PATCH 2/2] mermaid: allow passing of parameters with codefence syntax #360 --- exampleSite/content/shortcodes/mermaid.en.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/exampleSite/content/shortcodes/mermaid.en.md b/exampleSite/content/shortcodes/mermaid.en.md index 07fa90a019..be77ba2071 100644 --- a/exampleSite/content/shortcodes/mermaid.en.md +++ b/exampleSite/content/shortcodes/mermaid.en.md @@ -70,8 +70,6 @@ The generated graphs can be be panned by dragging them and zoomed by using the m ### Parameter -Passing parameters is supported for each available syntax (codefence, shortcode and partial). - | Name | Default | Notes | |:----------------------|:-----------------|:------------| | **align** | `center` | Allowed values are `left`, `center` or `right`. |