The need for mermaid.css should be mentioned explicitly in the intro docs...

[manor]

The section introducing simple usage on a web page doesn't mention the need for mermaid.css, which means that if one is following the docs literally, the resulting network renders incorrectly... Maybe it is obvious that CSS will be necessary, but I, for one, had to generate this:

without CSS	with CSS

before realizing that there was something missing :-)

It's a shame that there is no way to package things such that the CSS file is rendered unnecessary by default, but I don't know if there is a way to do this without clobbering user-provided customization. At any rate, it is a little jarring to have the nodes appear black and the edges disappear entirely in the absence of mermaid.css.

<script src="https://cdn.rawgit.com/knsv/mermaid/0.5.6/dist/mermaid.min.js"></script>
<link rel="stylesheet" href="https://cdn.rawgit.com/knsv/mermaid/0.5.6/dist/mermaid.css">
<script>mermaid.initialize({startOnLoad:true});</script>
<div class="mermaid">
graph TD;
    A-->B(B)
    A-->C>C]
    B-->D((D))
    C-->D
classDef eco fill:green;
class A,B,C,D eco
</div>

[mniinio]

I also spent some time before I found 4 things related to the styling because they were not documented at all or clearly:

• what was the latest version (had to understand to click the link "example mermaid x.x.x." in the docs, where the link was actually saying an old version
• mermaid.css (finally found it in the list of files from the cdn)
• how to solve issue with configuration where all html styles were copied which broke all other styles in my page Inline css by "mermaid" #157 cloneCssStyles: false
• and here in this issue finally found the proper example of how to use my own styles with classDef - but none of the examples (even in this issue) are working for me (version 0.5.6) either with css-classes or classes. Using "style" works just like documented (edit: actually I got the classes to work when I figured out I had taken forest -theme together with the other css from the CDN. The theme was overriding everything else, so I think the fact that there is a theme available and that it overrides stuff should be mentioned in docs)

[knsv]

Thanks, good feedback! Hard to know what is clear/unclear in the docs

[Jmuccigr]

+1.

But what's the version of other css to use from my local install? There are three of mermaid.forest, for example:

./mermaid/dist/mermaid.forest.css
./mermaid/dist/www/stylesheets/mermaid.forest.css
./mermaid/docs/site/stylesheets/mermaid.forest.css

[nrfm]

+1