MediaWiki:Citizen.css: Difference between revisions

Latest revision as of 20:45, 19 October 2025

/* All CSS here will be loaded for users of the Citizen skin */
:root {
	--width-layout: 1280px; /* Slightly wider content */
}

html

.citizen-body a.image:hover > img {
 	transform: scale(1) !important;
}

.citizen-footer__content {
 	padding-top: 0px; !important;
 	padding-bottom: 0px; !important;
}
.citizen-footer__bottom {
 	display: none !important;
}

.skin-theme-clientpref-night {
	--background-color-warning: #bd951b;

}

/* selected dark mode */
@media screen {
	.skin-theme-clientpref-night {
		--color-surface-0: #14181f !important;
		--color-destructive: #a40a0a; !important;
		--footer-color-1: #303030; !important;
		--footer-color-2: #202020; !important;
		--footer-color-3: #181818; !important;
	}
}

/* automatic dark mode */
@media screen and (prefers-color-scheme: dark) {
	.skin-theme-clientpref-os {
		--color-surface-0: #14181f !important;
		--color-destructive: #a40a0a; !important;
		--footer-color-1: #303030; !important;
		--footer-color-2: #202020; !important;
		--footer-color-3: #181818; !important;
	}
}

@media screen {
	.skin-theme-clientpref-day {
		--footer-color-1: #E4E8FE; !important;
		--footer-color-2: #E4E8FE; !important;
		--footer-color-3: #E4E8FE; !important;
}

/* automatic light mode */
@media screen and (prefers-color-scheme: light) {
	.skin-theme-clientpref-os {
		--footer-color-1: #E4E8FE; !important;
		--footer-color-2: #E4E8FE; !important;
		--footer-color-3: #E4E8FE; !important;
	}
}

.footer-color-1 {
	background: var(--footer-color-1);
}


.footer-color-2 {
	background: var(--footer-color-2);
}


.footer-color-3 {
	background: var(--footer-color-3);
}