Jump to content

Wikipedia:Featured articles/styles.css

Page semi-protected
From Wikipedia, the free encyclopedia
/* {{pp|small=y}} */
.wp-fa-about,
.wp-fa-nav {
	padding: 1em;
	border: 1px solid #A3B1BF;
	background-color: #E6F2FF;
	margin: 1px 0;
}

.wp-fa-about-title {
	font-size: 16pt;
}

.wp-fa-toc {
	padding: 1em;
	border: 1px solid #A3B1BF;
	background-color: #D8E4F2;
	margin: 1px 0;
}

.wp-fa-toc-title {
	font-size: 14pt;
	text-align: center;
}

.wp-fa-toc-toc {
	font-size: 11pt;
	text-align: center;
}

.wp-fa-toc-random,
.wp-fa-toc-tfa {
	font-weight: bold;
}

.wp-fa-contents {
	margin: 1px 0;
	padding: 1em;
	border: 1px solid #A3B1BF;
	background-color: #F1F6FB;
}

@media (min-width: 720px) {
	.wp-fa-about-nav {
		display: flex;
		gap: 2px;
	}

	.wp-fa-about {
		flex: 1 1 60%;
	}
	
	.wp-fa-nav {
		flex: 1 1 40%;
	}
	
	.wp-fa-toc {
		margin: 1px 1px 2px;
	}
	
	.wp-fa-contents {
		margin: 1px;
	}
}

@media screen {
	html.skin-theme-clientpref-night .wp-fa-contents {
		background-color: #0d1a27;
	}
	
	html.skin-theme-clientpref-night .wp-fa-about,
	html.skin-theme-clientpref-night .wp-fa-nav {
		background-color: #082849;
	}
	
	html.skin-theme-clientpref-night .wp-fa-toc {
		background-color: #001933; /* hue/saturation of fa color, but darker */
	}
}

@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .wp-fa-contents {
		background-color: #0d1a27;
	}
	
	html.skin-theme-clientpref-os .wp-fa-about,
	html.skin-theme-clientpref-os .wp-fa-nav {
		background-color: #082849;
	}
	
	html.skin-theme-clientpref-os .wp-fa-toc {
		background-color: #001933; /* hue/saturation of fa color, but darker */
	}
}