Template:Infobox graph/styles.css

From Wikipedia, the free encyclopedia
This is the current revision of this page, as edited by imported>JAlone at 06:21, 6 March 2025 (Improve dark mode display). The present address (URL) is a permanent link to this version.
(diff) ← Previous revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search
/* A safe image background that works for almost all images in dark mode
(via skin-theme-clientpref-night) */
@media screen {
	html.skin-theme-clientpref-night .infobox-image img {
		background-color: var(--background-color-inverted, #f8f9fa);
	}
	html.skin-theme-clientpref-night .infobox-image img[src$="svg.png"]{
		filter: invert(1);
		background-color: transparent;
	}
}

/* A safe image background that works for almost all images in dark mode
(via operating system opt-in) */
@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .infobox-image img { 
		background-color: var(--background-color-inverted, #f8f9fa);
	}
	html.skin-theme-clientpref-os .infobox-image img[src$="svg.png"]{
		filter: invert(1);
		background-color: transparent;
	}
}