Enable external styling for vector graphics in HTML documentation

Current state and problem description:

The HTML documentation, e.g. as shown on https://doc.qt.io/qt-6 , has some very distinctive styling. Further it allows to switch between dark and light mode.

This leads to the issue that embedded graphics and diagrams feel out of place or are unreadable.

The documentation writer can try to fit the graphics to our current style but that will be outdated as some point and not fit into dark and light mode at the same time.

I think with SVG we have the technology to solve this issue and make a very good looking documentation. I tried to do that here: https://codereview.qt-project.org/c/qt/qtbase/+/642481 but the solution requires some adaptions to qdoc or our online documentation.

What I wish for: Allow us to have both dark and light mode graphics

It would be great to have light and dark versions of every graphic, without needless duplications.

Our online documentation defines an attribute "data-theme" that is either "dark" or "light". If this attribute is forwarded to the SVG, the documentation writer can switch styling within the SVG as I tried to demonstrate here: https://codereview.qt-project.org/c/qt/qtbase/+/642481. SVG files are included with <img src="images/string_class_api.svg"> into the HTML documentation, and the data-theme attribute is not forwarded to the SVG. However, if the SVG is directly embedded into the HTML page, the data-theme attribute is forwarded and the diagram fits both into light and dark mode (I tried this by editing the page sources in the browser and it works. I think this could also be done with some javascript code (e.g. in the code that switches between dark and light) so we don't have to embed all SVGs). It would be a good start to have some attributes defined that we can use in SVGs and "dark-theme" is a great candidate!

We would need a documentation of which attributes we can rely on and how to use them in an SVG, and more generally, how to generate an SVG such that it fits well into our documentation. The default styling (outside the <style> element) should be a reasonable fallback and be used when the output of qdoc is not HTML.

A suggestion I got was to use the \raw command to include the svg (https://doc.qt.io/qt-6/12-0-qdoc-commands-miscellaneous.html#raw-avoid) directly into the HTML document. I think that might work but I would prefer a custom command.

We could add more attributes, "text-color", "highlight-color", "font" etc. to make sure our diagrams stay up to date with our online documentation. Even further, we could define or inject some of the definitions graphics and diagrams often use, e.g. <path id="lozenge" /> element in these graphics: https://codereview.qt-project.org/c/qt/qtbase/+/642481