Black lines for namespaces in Class diagrams difficult to see in dark theme

[heaths]

Description

The black lines (strokes) in a class diagram for namespaces are very difficult to see in a dark theme. I've tried setting every plausible themeVariables value but nothing helps that, and in GitHub any <style> tags are encoded (not kept as-is) so I can't restyle them according to your docs. It would be great if these were the same stroke color, by default, as other rects.

Steps to reproduce

1. Define a class diagram e.g.,

   classDiagram
   namespace foo {
      class bar
   }

2. View in a dark theme.

Screenshots

See https://gist.github.com/heaths/4f22611744e97c5768bf34fe92894cd3:

Code Sample

https://mermaid.live/edit#pako:eNptVE2P2jAQ_SuRz8lKsMBCtNpD22tPlXqoIlWziZNYxB7vxGlLKf-9zgfgSQgS4Jfn9-bD47PIsZAiFXkDbftFQUWgM2NAy9ZCLqMSsYjOmYn8M3Cikjrl2hD5JSvp4L2RHr1khm0fyFwArB2odwQJTMUh7RFkiEMNDjnrHYz_LG3vEXFri26hkSMZxpHA3wMRuqUHGKWhmRlo0D0YQiStU7OErXwgOO2dFeujA6dyXj8uVne-WAxpPzpFJHkcFdpa0oM8Rgdu-7uGWcgFNrZW3EervAbZ_PTCjV0qXzPn0q2BI5cuCSve6o7co9M04bOSj0H0J6hBVniw_QuehAEnG85rpEepwIVd3yXuVcwCzYFPQqnamoWA-fGaxtimKElwkun7OCxHlf57WF772bOi1yR5mwiBwOgTAJNRgFzLHEC3sk7Y678kWfQw4F8HNYBukxpg96EKwNvUBFnOkWl6RSy0JA2q8PfQUO5MuFpqmYnU_y2AjpmIA_w7kBqvG0-Y-pMJS34e6fQJqZD0GRukcb-GShoHmeiJvhMX7wedw28nk4vUUSdjQdhVtUhLP35-1dnCn5LpMryhslAO6et0XfY_sbBgfiDeOX4t0rP4I9LV4engn-3z_nl72O-221icRLperZ4O6_Vht97sd5uXzcv6Eou_g8Lq8h9NLO0H

Setup

• Mermaid version: 10.9.1
• Browser and Version: Edge 128.0.2730.0 (Official build) dev (64-bit)

Suggested Solutions

Make the namespace line the same color as class lines.

Additional Context

GitHub seems to use a darker theme than the online editor, but even in the latter the black lines are hard to see. If the dark theme had more visible lines it wouldn't matter in either host.

[heaths]

Using F12 tools I see that namespaces use the cluster class but none of the documented cluster* theme variables work e.g.,

---
config:
    theme: base
    themeVariables:
        clusterBkg: magenta
        clusterBorder: magenta
---

I've tried every theme variable even for other charts to no avail. Seems like a classDiagram's namespace border and background just isn't themeable without having to use CSS, which doesn't work on GitHub.

[jacbz]

Still an issue in the new v3 unified renderer.

@yari-dewalt Previously this was possible to override by CSS. Now, the namespace's stroke gets !important so even that is not possible anymore. Is there some other way to set the color? Thanks!

[heaths]

I wanted to add that CSS on GitHub doesn't work but seemingly only for Safari. See https://github.com/heaths/ordinal-rs/blob/main/README.md#performance in Edge (source: https://github.com/heaths/ordinal-rs/blob/main/docs/suffix_violin_plot.svg) (white text, polylines) vs. Safari (black text, polylines).

Still, if the theming was correct I wouldn't need to resort to CSS, which appears to have its own problems...and I tried several ways of inlining the CSS, all to no avail.

[yari-dewalt]

Just created a fix for this issue where the theming will work as expected #6026. @jacbz As far as I know and have tested there aren't any other ways possible for now due to what you said with the !important keyword. This was a result of how the new rendering method applies styles. Once this fix is in we won't have to resort to using CSS.

[heaths]

@yari-dewalt thanks! Any guess as to how long after the fix is merged - and perhaps a release created - would GitHub pick it up? Does this project have a contact to alert them of the fix or do they pick up regular updates?

[yari-dewalt]

@heaths From what I've seen GitHub typically picks up new releases about a month after they are released. I'm not aware of any contact, so I assume they just pick up regular updates but I can ask around!

[heaths]

A month or so isn't so bad. This isn't critical. I just figured if it was, like, a year or "with cause" we could reach out. I know a few people there as well that could probably forward on a request to update to the right team.