MediaWiki:Common.less/templates.less

From Brighter Shores Wiki
Jump to navigation Jump to search
/* ==================
       TEMPLATES
   ==================*/
   
:root {
	--keypress-background: @gallery;
	--keypress-border: @silver;
	--keypress-color: @mineshaft;
}

// TOC
.toc {
	border: none;
	
	.toctitle {
		border: 1px solid var(--body-darker);
		
		> * {
			color: @white;
			
			.toctogglelabel {
				color: var(--table-header-link);
			}
		}
	}
	
	> ul {
		border: 1px solid var(--wikitable-border);
		border-top: none;
	}
}

// NAVBOX
.navbox {
	.navbox-title {
		color: @white;
		
		a {
			color: var(--table-header-link);
		}
		
		.mw-collapsible-toggle-collapsed,
		.mw-collapsible-toggle-expanded {
			&::before,
			&::after {
				color: white;
			}
		}
		
		.mw-collapsible-toggle-default .mw-collapsible-text {
			color: var(--table-header-link);
		}
	}
	
	.navbox-list {
		border-bottom: none;
	}
}

// Template:Archive list
.archivelist {
	background-color: @infobox-background;
	border: solid 1px @infobox-border-color;
	box-shadow: @box-shadow;
	float: right;
	margin: 5px;
	padding: 5px;
	text-align: center;
	width: 120px;
}

// Template:Shortcut
.shortcut {
	border: 1px solid @infobox-border-color;
	background: @infobox-background;
	float: right;
	font-size: .8em;
	margin: 0.5em 0em 0.5em 1em;
	padding: 0.5em;
	text-align: center;
}

// Hatnotes: [[Module:Hatnote]]
.hatnote,
.seealso {
	font-style: italic;

	i {
		font-style: normal;
	}
}

// two classes - hatnote gets much customisation in minerva but seealso doesnt
div.hatnote,
div.seealso {
	// 0.5em is <p>'s top and bottom margin
	// 1.6em to match <dd>/<ul> indent
	margin: .5em 1.6em;

	& + & {
		margin-top: -0.5em;
	}
}

// Template:Key press
.keypress {
	background: var(--keypress-background);
	color: var(--keypress-color);
	font-family: inherit;
	border: 1px solid var(--keypress-border);
	border-radius: @border-radius;
	font-size: 0.9em;
	margin: 0 0.1em;
	padding: 0.1em 0.4em;
	white-space: nowrap;
}

// Template:Relative location
.relative-location {
	background: @infobox-background;
	border: 1px solid @infobox-border-color;
	border-spacing: 0;
	box-shadow: @box-shadow;
	text-align: center;
	
	&-header {
		background: @infobox-header-color;
		color: @white;
		font-weight: bold;
	}
}