Mermaid entity relation diagram styling

[MarkAureliy]

Im new to mermaid and come accross possible inaccuracy in the documentaion.
I've read the styling section in entity relation diagram but still have no idea how to apply any style for my ER diagram.
What is the actual syntax for ER styling?

other graph types has examples of styling but ER no. So I would like to have examples for ER too ( if any styles can be applied at all)

[MarkAureliy]

I found the answer. The important part of the documentation is "Config options" section. this mean the styles should be placed accordinly. Mermaid config could be placed into mermaid.initialize() or inline on the first line of your digram with %%{init: { }}%% expression. You can see details here https://mermaid-js.github.io/mermaid/#/./directives.

example for ER diagram styling:

%%{init: {'themeCSS': '.er.attributeBoxEven { fill: #f2f2f2; }' }}%%

[ig-or-pf]

How did you make it work, could you please send an example?

I tried to following using your code, however, no changes to the style

%%{init: {'themeCSS': '.er.attributeBoxEven { fill: #f2f2f2; }' }}%%
erDiagram
    CUSTOMER }|..|{ DELIVERY-ADDRESS : has
    CUSTOMER ||--o{ ORDER : places
    CUSTOMER ||--o{ INVOICE : "liable for"
    DELIVERY-ADDRESS ||--o{ ORDER : receives
    INVOICE ||--|{ ORDER : covers
    ORDER ||--|{ ORDER-ITEM : includes
    PRODUCT-CATEGORY ||--|{ PRODUCT : contains
    PRODUCT ||--o{ ORDER-ITEM : "ordered in"

%%{init: {'themeCSS': '.er.attributeBoxEven { fill: #f2f2f2; }' }}%%
erDiagram
    CUSTOMER }|..|{ DELIVERY-ADDRESS : has
    CUSTOMER ||--o{ ORDER : places
    CUSTOMER ||--o{ INVOICE : "liable for"
    DELIVERY-ADDRESS ||--o{ ORDER : receives
    INVOICE ||--|{ ORDER : covers
    ORDER ||--|{ ORDER-ITEM : includes
    PRODUCT-CATEGORY ||--|{ PRODUCT : contains
    PRODUCT ||--o{ ORDER-ITEM : "ordered in"

[MarkAureliy]

actually it works, but not as your expected. attributeBoxEven controls style of even lines in the entity table.
Just add the following code to your diagramm and you'll notice that lines in teh table have different colors across odd/even lines

CUSTOMER {
    GUID ID PK
    STRING NAME
    STRING EMAIL
    STRING ADDRESS
}

[ig-or-pf]

Thanks for the response Mark!

I see, that's really not what I expected.

Did you figure out how to color a specific entity? I'd like to make it based on the table schema and the documentation does mention:

fill | Background color of an entity or attribute
stroke | Border color of an entity or attribute, line color of a relationship

[MarkAureliy]

According to my understanding it is not possible to to fill/stroke particular entity. You can inspect html elements with browser dev tool and notice that all entities boxes have the same class "er.entityBox" and this is the exact class specified in the documentation. And there is no any syntax to modify styles of entities as it works in flowchart diagrams. Im not sure if many people tried to style their ER diagrams because I found only few questions about stylyng across all internet. This makes me think that we should not expect styling syntax in the nearest future

[ig-or-pf]

I came to the same conclusion but hoped that there might be some magic behind it. Ah, it is what it is! Thanks anyway!