From 811e770e9c7aaea52524a418cd46244d9766b2b6 Mon Sep 17 00:00:00 2001
From: Jon Robson <jdlrobson@gmail.com>
Date: Fri, 2 Aug 2024 16:42:38 -0700
Subject: [PATCH] Dark mode: Images should have background

Bug: T370074
Change-Id: I694778f6458ab13266bee4b88622a914f21c6b50
---
 .../content/images.less                       | 34 +++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/resources/skins.minerva.base.styles/content/images.less b/resources/skins.minerva.base.styles/content/images.less
index 292fdaa25..9e527a2f5 100644
--- a/resources/skins.minerva.base.styles/content/images.less
+++ b/resources/skins.minerva.base.styles/content/images.less
@@ -111,3 +111,37 @@
 		}
 	}
 }
+
+.dark-mode-image-styles() {
+	/* Desktop legacy HTML */
+	.mw-parser-output,
+	/* Parsoid HTML (mobile) */
+	section .mw-heading ~ div,
+	/* Parsoid HTML (desktop) and mobile legacy HTML */
+	section,
+	/* e.g. https://en.wikipedia.org/wiki/Pullback_(category_theory)#Universal_property */
+	dd,
+	/* For targeting p span.mw-default-size */
+	p {
+		> span.mw-default-size,
+		> figure[ typeof='mw:File' ],
+		> figure[ typeof='mw:File/Thumb' ],
+		> figure[ typeof='mw:File/Frameless' ] {
+			img {
+				background-color: #c8ccd1;
+			}
+		}
+	}
+}
+
+@media screen {
+	html.skin-theme-clientpref-night {
+		.dark-mode-image-styles();
+	}
+
+	@media ( prefers-color-scheme: dark ) {
+		html.skin-theme-clientpref-os {
+			.dark-mode-image-styles();
+		}
+	}
+}