Fixing figures in dark-mode

[martin-raden]

Hi,

when switching to dark-mode (in different browsers, ie. MS Edge and Firefox) images are "inverted".
While this is fine for most, some images of your tutorial are getting less illustrating in my opinion:

The only fix I found was to counter the CSS-induced "color invertion" with a dedicated CSS-statement for images that are to be kept in original coloring also in dark mode, i.e. adding style="filter:invert(0);" within the image's Markdown code.

I changed the invertion for

• the comic
• the 3 SVG images explaing changes in e01
• the SVG explaining merging in e09

Hope that helps.

Best,
Martin

[github-actions]

🆗 Pre-flight checks passed 😃

This pull request has been checked and contains no modified workflow files, spoofing, or invalid commits.

It should be safe to Approve and Run the workflows that need maintainer approval.

[froggleston]

Hey @martin-raden - there is a mechanism for using light-version images in dark mode, by providing the same light-mode image as a.png and a-dark.png, as per this issue: carpentries/varnish#153

We acknowledge that this isn't easily findable or documented, so it's on our list to do, but this would be our preferred solution. As such, I'll close this PR as we'd prefer to have explicit image versions for each mode. This also means you can have your own custom images for each mode, and not a simple colour invert.