MikhailKravets / mkdocs_puml

Inline PlantUML diagrams in your MkDocs documentation
MIT License
26 stars 5 forks source link

Dynamically show light/dark mode SVGs #33

Open ari-noumena opened 10 months ago

ari-noumena commented 10 months ago

Is your feature request related to a problem? Please describe.

SVG files generated by plantuml.com using the default URL do not look good when embedded in documentation sites that use a dark theme.

A (relatively) simple fix for that would be to add an option for specifying the file-type path, i.e. letting the user specify dsvg instead of svg as a plugin option, for modifying the part of the URL (in the case of plantuml.com) that follows /plantuml/.

That fix does not take into consideration sites (like those with typical MkDocs+Material configs) that allow the user to change the theme.

Describe the solution you'd like

It would be wonderful if the plugin could fetch both the regular and the dark mode SVGs and then dynamically display the correct one depending on which theme is active.

Describe alternatives you've considered

A plugin option for simply specifying the entire path parameter, as described above.

MikhailKravets commented 9 months ago

Hi @ari-noumena! That's a great idea. I think about light / dark theme implementation too but I didn't come up with the good solution yet.

We need to add themed styles to the svg generated by PlangUML (this will be ideal and correct solution). This way we'll be able to use material design theme toggle to change theme of our diagrams. There is already a method _stylize_svg:115 that's designed to post-process svg styles. The problem is that we need to define all the rules by which PlangUML generates svg and use them to add dark theme to the svg element before placing it in the documentation page.

This way we don't even need any additional option.