Template:Infobox world/styles.css: Difference between revisions

Revision as of 21:16, 22 August 2026

.loka-world-title-with-icon {
	/* Genuinely inline, not inline-flex -- the icon is meant to read as
	   part of the title's own text flow (like a leading emoji), not a
	   separately laid-out box beside it. */
	display: inline;
	white-space: nowrap;
}

.loka-world-titleicon {
	margin-right: .35em;
}

/* Sized in em, not a fixed px, so it scales together with the title text
   like a character rather than a separately-sized graphic next to it --
   same reasoning as Infobox rank's own titleicon. */
.loka-world-titleicon img {
	width: 1.3em;
	height: 1.3em;
}

/* The img itself is display:block (Template:Icon's own .loka-icon--bare
   img rule), so vertical-align on IT is inert -- .loka-icon--bare (the
   span actually wrapping it) is the inline element vertical-align needs
   to target instead. Its own base rule ships -2.5px, tuned for ordinary
   ~16px body text; this title's font-size is much larger (the shared
   1.25em infobox title style), so that same offset read as visibly low
   here. Re-measured live against "The End"'s own title text: 0px (plain
   baseline) is what actually centres it at this size, not -2.5px. */
.loka-world-titleicon .loka-icon--bare {
	vertical-align: 0px;
}