MediaWiki:Minerva.less

//

/* ------------------------------------------------------------------------------------------------------
 * This is the root Less file that is parsed to produce MediaWiki:Minerva.css,
 * which affects users of the mobile skin (mw:Extension:MobileFrontend).
 *
 * To update MediaWiki:Minerva.css from here, click the "Update CSS" button at the top.
 * ------------------------------------------------------------------------------------------------------
 * Less documentation:    <http://lesscss.org/features/>
 * Gadget:                <https://meta.weirdgloop.org/w/MediaWiki:Gadget-Less.js>
 * Core Less JS:          <https://meta.weirdgloop.org/w/MediaWiki:Gadget-Less-core.js>
 * Non-standard mixins:   <https://meta.weirdgloop.org/w/MediaWiki:Gadget-LessMixins.less>
 * Online Less tester:    <http://lesstester.com/>
 * ------------------------------------------------------------------------------------------------------ */

/* =============
      IMPORTS
   ============= */

@dir: 'MediaWiki:Minerva.less';
@common: 'MediaWiki:Common.less';

@import '@{common}/mixins.less';
@import '@{dir}/fonts.less';              // font imports and font stack definitions
@import '@{common}/variables.less';       // colors, shadows, etc.
@import '@{dir}/elements.less';           // HTML elements

// skin modifications
@import '@{dir}/interface.less';          // skin/chrome changes
@import '@{dir}/specials.less';           // special pages
@import '@{dir}/diff.less';               // Special:MobileDiff

// templates
@import '@{dir}/templates.less';
@import '@{dir}/infobox.less';
@import '@{dir}/storage.less';
@import '@{dir}/tiles.less';
@import '@{dir}/navbox.less';
@import '@{dir}/questdetails.less';

// page-specific styles
@import '@{dir}/mainpage.less';           // main page (obviously)
@import '@{dir}/transcripts.less';        // Transcript pages

@import '@{dir}/gecharts.less'; 

/* =============
       OTHER
   ============= */

// minerva doesnt set a bg since it 100%s all tables
.wikitable {
	background: none;
	box-shadow: none;
	
	tbody {
		background: var(--body-light);
	}
}

// Table of Contents
.toc {
	background-color: var(--body-light);
	border-color: var(--body-border);
}

#filetoc li {
	display: inline;
	padding-right: 2em;
}

// Sitenotice stuff
.mw-dismissable-notice-body {
	margin: 0;
	
	.mw-dismissable-notice-close-parent {
		border-radius: 0 !important;
		font-size: .75em;
	}
}

:root {
	--thumb-image-background: var(--body-light);
	--thumb-caption-background: var(--body-mid);
}

.content {
	// image thumbnails
	.thumbimage {
		background-color: var(--thumb-image-background);
		border: 1px solid transparent;
		border-bottom: none;
	}
	
	.thumbcaption {
		margin: 0;
		padding: 4px 6px !important; // minerva has !important
		color: inherit;
		background: var(--thumb-caption-background);
	}
	
	// minerva sets a margin: 1em 0 to all tables
	table.messagebox {
		margin: 0.5em auto;
	}
	
	// fix for plink/table images often shrinking into nothingness
	table a > img {
		max-width: inherit !important;
		height: inherit !important;
	}
	
	// the above would make images inside infobox really large
	// if they don't have a specified width/height
	.infobox a > img {
		max-width: 100% !important;
		height: auto !important;
	}
	
	// override above to make infobox-bonuses scrollable
	.infobox-bonuses a > img {
		max-width: inherit !important;
		height: inherit !important;
	}
}