Skip to content

Commit baea66d

Browse files
committed
#2303 adding Mermaid diagram
1 parent 838c072 commit baea66d

File tree

2 files changed

+24
-1
lines changed

2 files changed

+24
-1
lines changed

_includes/head/custom.html

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,15 @@
1212
<meta name="theme-color" content="#ffffff"/>
1313
<link rel="stylesheet" href="{{ base_path }}/assets/css/academicons.css"/>
1414

15-
1615
<!-- Support for MatJax -->
1716
<script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?features=es6"></script>
1817
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
1918

19+
<!-- Support for Mermaid -->
20+
<script type="module">
21+
import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';
22+
mermaid.initialize({startOnLoad:true,theme:'neutral'})
23+
await mermaid.run({querySelector:'code.language-mermaid'})
24+
</script>
25+
2026
<!-- end custom head snippets -->

_pages/markdown.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,23 @@ The default delimiters of `$$...$$` and `\\[...\\]` are supported for displayed
6363

6464
**Note** that since Academic Pages uses Markdown which cases some interference with MathJax and LaTeX for escaping characters and new lines, although [some workarounds exist](https://math.codidact.com/posts/278763/278772#answer-278772). In some cases, such as when you are including MathJax in a `citation` field for publications, it may be necessary to use `\(...\)` for inline delineation.
6565

66+
## Mermaid diagrams
67+
Academic Pages includes support for [Mermaid diagrams](https://mermaid.js.org/) and in addition to their [tutorials](https://mermaid.js.org/ecosystem/tutorials.html) and [GitHub documentation](https://github.com/mermaid-js/mermaid) the basic syntax is as follows:
68+
69+
```markdown
70+
```mermaid
71+
graph LR
72+
A-->B
73+
```
74+
```
75+
76+
Which produces the following plot:
77+
78+
```mermaid
79+
graph LR
80+
A-->B
81+
```
82+
6683
## Markdown guide
6784

6885
Academic Pages uses [kramdown](https://kramdown.gettalong.org/index.html) for Markdown rendering, which has some differences from other Markdown implementations such as GitHub's. In addition to this guide, please see the [kramdown Syntax page](https://kramdown.gettalong.org/syntax.html) for full documentation.

0 commit comments

Comments
 (0)