diff --git a/docs/usage/mermaid-diagrams.md b/docs/usage/mermaid-diagrams.md index b414b9fd..f13c3090 100644 --- a/docs/usage/mermaid-diagrams.md +++ b/docs/usage/mermaid-diagrams.md @@ -12,16 +12,27 @@ Either from [this link](https://marketplace.visualstudio.com/items?itemName=bier ### Put the following syntax in a Markdown block -
-::: mermaid
+````text
+```mermaid
 graph TD;
 A-->B;
 A-->C;
 B-->D;
 C-->D;
-:::
-
+``` +```` ### You should get a diagram rendering, like the following: -![Mermaid example](/img/mermaid.png) +![Mermaid example](/img/mermaid.svg) + +### If you need to render the source of a Mermaid diagram, add the following annotation: +````text +```mermaid {"transform":"false"} +graph TD; +A-->B; +A-->C; +B-->D; +C-->D; +``` +```` diff --git a/static/img/mermaid.png b/static/img/mermaid.png deleted file mode 100644 index 8a45ebf1..00000000 Binary files a/static/img/mermaid.png and /dev/null differ diff --git a/static/img/mermaid.svg b/static/img/mermaid.svg new file mode 100644 index 00000000..b046efd6 --- /dev/null +++ b/static/img/mermaid.svg @@ -0,0 +1,3 @@ + + +

A

B

C

D

 \ No newline at end of file