Now with mermaid

I just came across mermaid and thought it seemed quite cool. I wanted to implement support for it on my blog, but there wasn't any mention of how to do this with Middleman. Turns out it wasn't that hard, I just added an import tag to the main page template, then modified the Markdown renderer to create a proper <pre class="mermaid"> tag around any ```mermaid code blocks. You can see the full commit of this change here. Now I can create cool charts and graphs with ease within my markdown. For example:

pie title Pets adopted by volunteers
    "Dogs" : 386
    "Cats" : 85
    "Rats" : 15

If you want to see exactly what this markdown source looks like: As always, you can find a link to the source in the footer of this article. Cheers.

What do you think? I'd love to hear from you. Here is a link to the source for this article on github. Please open an issue, send me a pull-request, or just email me at jubi@jubishop.com