Adjust diagrams for dark theme

[matevz]

Go through all diagrams and check that they are readable in the dark theme:

• [ ] for SVG images drawn with drawio.com, reexport them with "Automatic" Appearance option and "Transparent background"
• [ ] for SVG images generated by mermaidjs, write a theme-sensitive CSS
• [ ] get rid of the enforced white background for all images

Transparent PNGs (do we have any?) should either be redrawn/reexported in SVG or designed in such a way that the text is readable regardless of the background. Non-transparent PNGs and JPEGs could maybe use Docuaurus' themed images in the future?

[matevz]

Possible solution would be the following:

• for any image (png, svg, jpeg) use the default myimage.png filename for light themes. For dark themes, check, if myimage_dark.png exists and use it instead. Otherwise keep the original image. So something like the ThemedImage, but automated.
• for .svg files, instead of having another image, cool kids now detect the theme and change coloring with inline CSS. For example check out the current favicon or the ROFL diagram.

[matevz]

drawio.com which we use for most of the hand-drawn diagrams now has theming support for SVG export. Selecting the "Automatic" theme option in the export dialog adds theme-sensitive CSS snippet in the SVG. This, and enabling transparent background gives best results in our docs.

Final result:	Light	Dark

[aefhm]

TODO

• [ ] Update SVG in oasis-sdk https://github.com/oasisprotocol/oasis-sdk/pull/2068/files
• [ ] Update SVG in sapphire-paratime https://github.com/oasisprotocol/sapphire-paratime/pull/457
• [ ] Update SVG in docs https://github.com/oasisprotocol/docs/pull/1024