feat(layouts/shortcodes/mermaid.html-layouts/_default/baseof.html): A… (#595)

james_lin

26.47.2022 4de8eed657f5756d96e1cd3a3a6926c700f942e0

feat(layouts/shortcodes/mermaid.html-layouts/_default/baseof.html): A… (#595)

* feat(layouts/shortcodes/mermaid.html-layouts/_default/baseof.html): Add mermaid js support for theme

* docs(CONTRIBUTORS.md): Add jneo8 to CONTRIBUTORS.md

* feat(exampleSite,layouts): Add mermaid js example content and update mermaid js settings in layout

* Update CONTRIBUTORS.md

Co-authored-by: Luiz F. A. de Prá <luizdepra@users.noreply.github.com>

 CONTRIBUTORS.md

@@ -114,3 +114,4 @@
- [George Tsiokos](https://george.tsiokos.com)
- [Eltjo](https://github.com/eltjo)
- [Saurmandal](https://saur.neocities.org)
- [Jneo8](https://github.com/jneo8)

 exampleSite/content/posts/mermaid-support.md

New file
@@ -0,0 +1,33 @@
+++
date = "2022-07-25"
title = "Mermaid JS support"
description = "The post demonstrates Mermaid JS support"
series = ["Theme", "Hugo"]
+++

If you want to use [Mermaid-JS](https://mermaid-js.github.io/mermaid/#/) on your website.
Provide `mermaid` as [Shortcode](https://gohugo.io/content-management/shortcodes/#readout) in your markdown file.


{{<mermaid>}}
flowchart LR

    A --> B

    B --> C

    C --> D 

    D --> B
{{</mermaid>}}

{{<mermaid>}}
sequenceDiagram
    participant Alice
    participant Bob
    Alice->>Bob: Hi Bob
    Bob->>Alice: Hi Alice
{{</mermaid>}}


Find more example on [Mermaid-JS](https://mermaid-js.github.io/mermaid/#/) website.

 layouts/_default/baseof.html

@@ -67,7 +67,7 @@

  {{ if and .Site.Params.applicationInsights .Site.Params.applicationInsights.connectionString }}
    {{- partial "analytics/applicationinsights" . -}}
  {{ end }}   
  {{ end }}

  {{- partial "body/extensions" . -}}
</body>

 layouts/shortcodes/mermaid.html

New file
@@ -0,0 +1,3 @@
<div class="mermaid">
  {{- .Inner | safeHTML }}
</div>