Jump to content

Template:Infobox crop/styles.css

From StepHarvest Wiki
Revision as of 14:52, 11 June 2026 by Admin (talk | contribs) (Initial StepHarvest theme setup)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
/* Crop infobox: the signature wooden frame panel.
   TemplateStyles does not allow CSS variables, so hex values are repeated
   here. They match the palette in MediaWiki:Common.css. */

.sh-infobox {
	float: right;
	clear: right;
	width: 280px;
	margin: 0 0 1em 1em;
	background: #FBF1E1;
	color: #2C1810;
	border: 6px solid #8B5A2B;
	border-radius: 10px;
	box-shadow: 3px 4px 0 rgba(93, 58, 26, 0.5);
	font-size: 0.92em;
	line-height: 1.4;
}

@media (max-width: 720px) {
	.sh-infobox {
		float: none;
		clear: none;
		width: auto;
		max-width: 380px;
		margin: 0 auto 1em;
	}
}

.sh-infobox-title {
	background: #8B5A2B;
	color: #FFF8F0;
	font-family: 'VT323', monospace;
	font-size: 1.7em;
	line-height: 1.2;
	letter-spacing: 0.5px;
	text-align: center;
	padding: 3px 10px;
}

.sh-infobox-image {
	text-align: center;
	padding: 10px 10px 4px;
}

.sh-infobox-image img {
	image-rendering: pixelated;
}

.sh-infobox-rows {
	padding: 4px 10px 10px;
}

.sh-infobox-section {
	font-family: 'VT323', monospace;
	font-size: 1.3em;
	letter-spacing: 0.5px;
	color: #5D3A1A;
	background: rgba(201, 166, 107, 0.35);
	border-radius: 4px;
	text-align: center;
	margin: 8px 0 2px;
	padding: 0 6px;
}

.sh-infobox-row {
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding: 4px 2px;
	border-bottom: 2px solid #C9A66B;
}

.sh-infobox-row:last-child {
	border-bottom: none;
}

.sh-infobox-label {
	flex: 0 0 42%;
	font-family: 'VT323', monospace;
	font-size: 1.15em;
	color: #5D3A1A;
}

.sh-infobox-value {
	flex: 1;
}

.sh-infobox-id {
	font-size: 0.85em;
	color: #8D7E72;
}