Jump to content

Template:Infobox sport/styles.css

From the Vrienden Universe, a fictional wiki
/* Light and dark presentation for [[Template:Infobox sport]]. */
.infobox.infobox-sport {
	border-color: #a2a9b1;
	background-color: #f8f9fa;
	color: #202122;
}

.infobox-sport th,
.infobox-sport td {
	border-color: #a2a9b1;
	color: inherit;
}

.infobox-sport .infobox-above,
.infobox-sport .infobox-title,
.infobox-sport .infobox-header,
.infobox-sport .infobox-subheader,
.infobox-sport .infobox-below {
	background-color: #eaf3ff;
	color: #202122;
}

.infobox-sport .infobox-header {
	padding: 0.2em 0.4em;
}

.infobox-sport .infobox-image img {
	max-width: 100%;
	height: auto;
}

@media screen {
	html.skin-theme-clientpref-night .infobox.infobox-sport,
	body.skin-theme-clientpref-night .infobox.infobox-sport {
		border-color: #54595d;
		background-color: #1e1e1e;
		color: #eaecf0;
	}

	html.skin-theme-clientpref-night .infobox-sport th,
	html.skin-theme-clientpref-night .infobox-sport td,
	body.skin-theme-clientpref-night .infobox-sport th,
	body.skin-theme-clientpref-night .infobox-sport td {
		border-color: #54595d;
		background-color: #1e1e1e;
		color: #eaecf0;
	}

	html.skin-theme-clientpref-night .infobox-sport .infobox-above,
	html.skin-theme-clientpref-night .infobox-sport .infobox-title,
	html.skin-theme-clientpref-night .infobox-sport .infobox-header,
	html.skin-theme-clientpref-night .infobox-sport .infobox-subheader,
	html.skin-theme-clientpref-night .infobox-sport .infobox-below,
	body.skin-theme-clientpref-night .infobox-sport .infobox-above,
	body.skin-theme-clientpref-night .infobox-sport .infobox-title,
	body.skin-theme-clientpref-night .infobox-sport .infobox-header,
	body.skin-theme-clientpref-night .infobox-sport .infobox-subheader,
	body.skin-theme-clientpref-night .infobox-sport .infobox-below {
		border-color: #3a506b;
		background-color: #1b223d !important;
		color: #e0f0ff !important;
	}

	html.skin-theme-clientpref-night .infobox-sport a:not(.new),
	body.skin-theme-clientpref-night .infobox-sport a:not(.new) {
		color: #88ccff;
	}

	html.skin-theme-clientpref-night .infobox-sport a.new,
	body.skin-theme-clientpref-night .infobox-sport a.new {
		color: #ff6b6b;
	}
}

@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .infobox.infobox-sport,
	body.skin-theme-clientpref-os .infobox.infobox-sport,
	html.skin-theme-clientpref-os .infobox-sport th,
	html.skin-theme-clientpref-os .infobox-sport td,
	body.skin-theme-clientpref-os .infobox-sport th,
	body.skin-theme-clientpref-os .infobox-sport td {
		border-color: #54595d;
		background-color: #1e1e1e;
		color: #eaecf0;
	}

	html.skin-theme-clientpref-os .infobox-sport .infobox-above,
	html.skin-theme-clientpref-os .infobox-sport .infobox-title,
	html.skin-theme-clientpref-os .infobox-sport .infobox-header,
	html.skin-theme-clientpref-os .infobox-sport .infobox-subheader,
	html.skin-theme-clientpref-os .infobox-sport .infobox-below,
	body.skin-theme-clientpref-os .infobox-sport .infobox-above,
	body.skin-theme-clientpref-os .infobox-sport .infobox-title,
	body.skin-theme-clientpref-os .infobox-sport .infobox-header,
	body.skin-theme-clientpref-os .infobox-sport .infobox-subheader,
	body.skin-theme-clientpref-os .infobox-sport .infobox-below {
		border-color: #3a506b;
		background-color: #1b223d !important;
		color: #e0f0ff !important;
	}

	html.skin-theme-clientpref-os .infobox-sport a:not(.new),
	body.skin-theme-clientpref-os .infobox-sport a:not(.new) {
		color: #88ccff;
	}

	html.skin-theme-clientpref-os .infobox-sport a.new,
	body.skin-theme-clientpref-os .infobox-sport a.new {
		color: #ff6b6b;
	}
}