Context

The color of Mermaid sequence diagram notes looks a bit off IMO (see, e.g., https://squidfunk.github.io/mkdocs-material/reference/diagrams/#using-sequence-diagrams), at least not as nicely integrated with the rest of the theme colors.

Description

mkdocs-material overrides some Mermaid colors with own CSS variables but not the "note" node. How about introducing new CSS variables, e.g. --md-mermaid-note-bg-color as the fill color and --md-mermaid-note-fg-color as the stroke color (consistent with existing naming), and add an override for Mermaid's note CSS class? The default colors could be based on the info admonition color.

There exists some customization for note text, so perhaps not customizing the note rect itself was an oversight.

Related links

• Using sequence diagrams

Use Cases

Having a nicely integrated Mermaid diagram makes documentation more pleasant to read. It's mostly good already, but sequence diagram notes look a bit off.

Visuals

No response

Before submitting

• I have read and followed the change request guidelines.
• I have verified that my idea is a change request and not a bug report.
• I have ensured that, to the best of my knowledge, my idea will benefit the entire community.
• I have included relevant links to the documentation, related issues, and discussions to underline the need for my idea.