Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Styling: classes aren't applied to elements. #582

Closed
joostas opened this issue Oct 1, 2017 · 10 comments
Closed

Styling: classes aren't applied to elements. #582

joostas opened this issue Oct 1, 2017 · 10 comments

Comments

@joostas
Copy link

joostas commented Oct 1, 2017

Styling: classDef and classes aren't applied to elements.
Example:

graph TD
A-->B
C-->D
classDef def fill:#00f
class A def
Loading

Element A is green, but should be blue.

@amazing-gao
Copy link

I have the some issue.

@aaroncalderon
Copy link

It's weird, because the demo: Larger flowchart with some styling works, but it does not when I try the same thing on the live editor.

Any Ideas?

@marceloboeira
Copy link

@aaroncalderon same here...

@ghost
Copy link

ghost commented Feb 28, 2018

Same here. I am being able to style each node individually:

screenshot_2

But when I try doing it with classDef nothing happens:

screenshot_1

Naming it default does nothing as well:

screenshot_3

@cryodream
Copy link

I spent hours trying to get this to work in VS Code.
Hope it'll get fixed, because defining styles individually is a pita.

@calve
Copy link

calve commented Mar 5, 2018

Same here. Looking at the generated HTML, nodes do get classes attributes, but I cannot find any css rules matching the class, nor find any occurence of my classname in the generated document. I believe there is a bug preventing the CSS rules to be set.

This regression seems to appear between releases 7.0.14 and 7.0.15 which lead me to commit 72493b7.

   graph TD

     hello --> world;
     classDef someclass fill:#f96;
     class hello someclass;

Please note that the ordering do matter. Also this is processed by sphinx-mermaid but this is not relevant here.

Before (7.0.14) screenshot_20180305_204032

After (7.0.15) screenshot_20180305_202955

@tylerlong would be glad if you could shed us some light on this ? 🙃

@tylerlong
Copy link
Collaborator

Hi guys, I am here. I will take a look tonight.

@calve thank you for figuring out the commit which brought this regression.

@tylerlong
Copy link
Collaborator

Fixed: a8e49a0...0d0f793

image

@marceloboeira
Copy link

@tylerlong thanks!

@LeDuble
Copy link

LeDuble commented Mar 15, 2022

@tylerlong thank you!

mgenereu pushed a commit to mgenereu/mermaid that referenced this issue Jun 25, 2022
…yarn/develop/eslint-plugin-svelte3-3.4.0

chore(deps-dev): bump eslint-plugin-svelte3 from 3.2.1 to 3.4.0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants