Jump to content

MediaWiki:Common.css: Difference between revisions

From Manath's Campaign Wiki
Story box styles with a dark mode version
 
m Dimmer story text in dark mode
Line 28: Line 28:
border: 1px solid #4a3e2e;
border: 1px solid #4a3e2e;
box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
color: #d6c9ae;
color: #bcb096;
}
}
html.skin-theme-clientpref-night .story-box .story-title {
html.skin-theme-clientpref-night .story-box .story-title {
color: #e6d5ae;
color: #c9b78f;
border-bottom-color: #8a7350;
border-bottom-color: #8a7350;
}
}
Line 39: Line 39:
border: 1px solid #4a3e2e;
border: 1px solid #4a3e2e;
box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
color: #d6c9ae;
color: #bcb096;
}
}
html.skin-theme-clientpref-os .story-box .story-title {
html.skin-theme-clientpref-os .story-box .story-title {
color: #e6d5ae;
color: #c9b78f;
border-bottom-color: #8a7350;
border-bottom-color: #8a7350;
}
}
}
}

Revision as of 16:54, 1 November 2026

/* The Story So Far: parchment boxes. Light parchment in light mode, dark parchment in dark mode. */
.story-box {
	max-width: 700px;
	margin: 20px auto;
	padding: 30px;
	background: linear-gradient(to bottom right, #f0e6d2, #d3c7a6);
	border-radius: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	color: #4a3f35;
	font-family: 'Times New Roman', serif;
	font-size: 18px;
	font-style: italic;
	line-height: 1.8;
	text-align: justify;
}
.story-box .story-title {
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	color: #2a1f15;
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 2px solid #2a1f15;
}

html.skin-theme-clientpref-night .story-box {
	background: linear-gradient(to bottom right, #2b241b, #1e1a15);
	border: 1px solid #4a3e2e;
	box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
	color: #bcb096;
}
html.skin-theme-clientpref-night .story-box .story-title {
	color: #c9b78f;
	border-bottom-color: #8a7350;
}
@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .story-box {
		background: linear-gradient(to bottom right, #2b241b, #1e1a15);
		border: 1px solid #4a3e2e;
		box-shadow: 0 0 12px rgba(0, 0, 0, 0.5);
		color: #bcb096;
	}
	html.skin-theme-clientpref-os .story-box .story-title {
		color: #c9b78f;
		border-bottom-color: #8a7350;
	}
}