Text not showing properly in mermaid diagram

jonathanyeung / mark-sharp

Mark Sharp WYSIWYG Markdown Editor for VS Code

36 stars 0 forks source link

Text not showing properly in mermaid diagram #15

Closed MahmoodKhalil57 closed 1 month ago

MahmoodKhalil57 commented 3 months ago

Describe the bug.

Hello, I am using marksharp pro, the arrows and text in mermaid diagram are not visible, I tried multiple dark themes and none of them look quite right, then I tried changing the theme color myself, but I couldnt find the name of the color I need to modify to have this fixed, please assist on this issue.

Repro Steps

Use vscode "One Dark Pro" theme
Create a markdown file with mermaid diagram
Open Markdown file with marksharp

Edit: The names here are wonky as well

Edit2: State diagrams also

Version

No response

What platform are you seeing the problem on?

Windows

jonathanyeung commented 3 months ago

Hi @MahmoodKhalil57 - thanks for the support and for reporting this issue!

I'm aware of several issues around Mermaid theming that I'm looking to improve on soon - the colors out of the box don't look good on some themes, and there are some issues as well when trying to override the color theme. I'll try to address these issues shortly.

MahmoodKhalil57 commented 3 months ago

Hi @MahmoodKhalil57 - thanks for the support and for reporting this issue!

I'm aware of several issues around Mermaid theming that I'm looking to improve on soon - the colors out of the box don't look good on some themes, and there are some issues as well when trying to override the color theme. I'll try to address these issues shortly.

Thank you for the quick response, in general marksharp is very nice and arguably much better than the side by side alternatives. Other than not being able to customize the colors, its been a pleasure to use.

Edit: Thanks for the hard work!

jonathanyeung commented 3 months ago

Hi @MahmoodKhalil57 - 1.3.2 was just released that has a few changes that should help with this:

The contrast of the colors has been increased to improve text readability.
There's a new setting that lets you use Mermaid's built in themes instead.
A few general issues around Mermaid diagrams were fixed and the Mermaid version was upgraded to the latest; this should help with setting custom color overrides.

For full details, see the user guide.

Having said this, I wasn't able to repro the exact issue from your screenshots, so it's possible the issue you were encountering is still there. Let me know if this is the case, and I'll continue investigating. Thanks!

jonathanyeung commented 1 month ago

A quick heads up @MahmoodKhalil57 - in case you were using the mark-sharp.mermaidTheme setting to force the use of default Mermaid colors, I just released version 1.5.0 which has a breaking change that renames this setting to mark-sharp.display.mermaidTheme. If you had changed this setting, you'll need to update it again - apologies for any inconvenience caused.

Otherwise, I'll go ahead and close this issue. If you're still having theming issues with Mermaid, please reopen and let me know. Thanks!