Add mermaid shortcode

[jarrodmillman]

@stefanv I am having trouble figuring out why the example text is being rendered:

• The example is rendered, but it is supposed to show the text.
• The text is also getting clipped in the rendered version. I don't know when this started, but it used to not do this. I know it worked correctly before we switched to scientific-python-hugo-theme, but I don't remember if it ever rendered correctly after we switched.

[netlify]

✔️ Deploy Preview for scientific-python-hugo-theme ready!

🔨 Explore the source changes: eb976eb

🔍 Inspect the deploy log: https://app.netlify.com/sites/scientific-python-hugo-theme/deploys/62157ef298f63700088060f2

😎 Browse the preview: https://deploy-preview-120--scientific-python-hugo-theme.netlify.app

[tupui]

Wooo already! 😉

[tupui]

Seems like it's rendering twice instead of showing the raw input. Also the items do not fit in the boxes.

[tupui]

[jarrodmillman]

@stefanv The example is no longer rendered after adding a space around mermaid and \mermaid. The rendered version still cuts off the text.

If, under Inherited from g, I unselect font-weight: 700; under .label provided by bulma.min.css, then it looks better:

I am not sure what the cleanest way to fix this is...