Post image and homepage card color change by theme change

[some-natalie]

Checklist

• I have read and accepted the contributing guidelines.

Is your feature request related to a problem? Please describe

No.

Describe the solution you'd like

The preview image for a post that's in the home page, as well as the post's image, changes based on if the user is in light or dark mode.

I did a quick implementation of this for myself on my website. It can either specify the light and dark images, or if there's only one uses the same default behavior.

• home page - https://some-natalie.dev
• post that uses this - https://some-natalie.dev/blog/runtime-funtime/

Just toggle between light and dark mode to see the changes.

Happy to contribute these back if it's helpful. 😄

Describe alternatives you've considered

No response

Additional context

No response

[Slavetomints]

I could try and integrate this into #2553, and make that PR more as just an addition of some new features for images. I really like this idea and your implementation looks very smooth.

[cotes2020]

Besides being displayed on our own website, the preview image also plays an important role as the preview image on social media. Switching the image by theme within the site won't take effect on social media, so at this stage I'm inclined not to add this feature.

[some-natalie]

Ooooh, I completely missed the social preview part. I updated the PR with a quick little Ruby script to create one, default to light if both are specified, and it doesn't appear to affect the behavior when only one image is declared as page.image. My site's been updated to use that script now too. I verified the behavior using <opengraph.io/link-preview> on my site, but happy to figure out what additional test coverage may look like.

[cotes2020]

My point is that this feature doesn’t bring much benefit beyond increasing the project’s complexity. Preserving universal web standards is the goal worth pursuing. Therefore I won’t consider adding this feature. :)

[some-natalie]

Sounds good! I'll close the PR as unmerged, this issue, and keep this little change myself because I like it. 💖

Thank you so much for the clear feedback and fast responses, @cotes2020 :)