clair-de-lune-obsidian-theme icon indicating copy to clipboard operation
clair-de-lune-obsidian-theme copied to clipboard

Add styling for mermaid diagrams

Open Cito opened this issue 5 years ago • 3 comments
trafficstars

This is a very nice theme. However, it does not play well with mermaid diagrams, because the background and borders of shapes in graphs have the same or similar color as the page background. You can test it with this small diagram:

```mermaid
graph LR
A --> B
```

We could make the background of the diagrams lighter like this:

.mermaid {
    background-color: #555;
}

But it would be better to change only the background and line color of the shapes. Unfortunately, so far I found not simple way to achieve this.

Cito avatar Oct 22 '20 11:10 Cito

Ah I never use the mermaid diagrams so I forgot they existed!

I'll have a look at styling these for the next release :grin:

jamiebrynes7 avatar Oct 22 '20 12:10 jamiebrynes7

Nice - looks much better now. Thank you!

I still found a small issue - the color of arrows in state diagrams.

The color of ER diagrams is also a bit strange. But it's not better in the original theme.

Cito avatar Oct 25 '20 19:10 Cito

Oh I may have missed out a few of the arrow headings on the state diagrams. 😕

I haven't done the entity representation or the user journey diagrams yet, I forgot the Git automation would close this issue once the linked PR was merged. 🤦‍♂️


I'll have a look at these things in the next pass 😄

jamiebrynes7 avatar Oct 26 '20 19:10 jamiebrynes7