MediaWiki:Common.css: Difference between revisions

Latest revision as of 20:22, 14 October 2025

/** CSS placed here will be applied to all skins */

/*
{{TOCright}}
CSS placed here will be applied to all skins

Tools: [http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fsarna.net%2Fwiki%2Findex.php%3Ftitle%3DMediaWiki%3ACommon.css%26action%3Draw%26ctype%3Dtext%2Fcss&usermedium=all W3C CSS Validation Service] | [http://sarna.net/wiki/index.php?title=MediaWiki:Common.css&action=raw&ctype=text/css&smaxage=18000 reload cache]
<br style="clear: both"/>

===CSS Hacks===
This one is to get around the default skin screwing up font sizes.

&nbsp;*/

a, a:active, a:hover, a:link, a:visited {
 font-size: inherit;
 font-family: inherit;
}

/*

===CSS for Navigation Bar===


&nbsp;*/

a.topbar, a.topbar:link, a.topbar:active, a.topbar:visited, a.topbar:hover {
 background-color: inherit;
 color: black;
 font-family: Verdana, Tahoma, sans-serif;
 font-size: 11px;
 font-weight: bold
}

/*

=== CSS for Special: Pages ===

Puts a redirect indicator before redirects in Special:Allpages

&nbsp;*/

.allpagesredirect {
 font-style: italic
}

.allpagesredirect a {
 background: url("/wiki/images/5/5c/Allpagesredirect.gif") center left no-repeat;
 padding-left: 13px
}

/*
=== CSS for Image: Pages ===
Put a checker background at the image description page only visible if the image has transparent background

<!-- Note that _all_ instances of #id will need to 'break' with the format standardised elsewhere on _this_ page or else the CSS will become unreadable. -->&nbsp;*/

 #file img { background: url("/wiki/images/5/5d/Checker-16x16.png") repeat }

/*
===CSS for Skinning Download Boxes===

&nbsp;*/

table.downloadbox {
 background: white;
 border-collapse: collapse;
 border: 1px solid #999;
 clear: right;
 color: black;
 float: right;
 margin: 10px;
 padding: 5px;
 width: 250px
}

table.downloadbox tr {
 background: #F0F0F0;
 color: inherit;
 border-spacing: 0;
 text-align: left;
 vertical-align: middle
}

table.downloadbox tr td {
 background: #F0F0F0;
 border-top: 1px solid #999;
 border-bottom: 1px solid #999;
 color: inherit;
 padding: 5px
}

table.downloadbox tr td.downloadboxheading {
 background: #BDB;
 color: inherit
}

/*
===CSS for Skinning Info Boxes===
&nbsp;*/

table.infobox {
 background: white;
 border: 2px solid #3300CC;
 border-collapse: collapse;
 clear: right;
 color: black;
 float: right;
 line-height: 2em;
 margin: 10px;
 padding: 5px;
 width: 341px
}

table.infobox tr {
 text-align: center
}

table.infobox tr td.infoboxname,
table.infobox tr th.infoboxname {
 color: inherit;
 background: #A4A4A4;
 font-size: larger;
 font-weight: bold;
 text-align: center
}

table.infobox tr td.infoboxheading, 
table.infobox tr th.infoboxheading {
 background: #6699FF;
 color: inherit;
 font-weight: bold;
 text-align: left
}

table.infobox tr.infoboxrow {
 background: #BDBDBD;
 color: inherit;
 border-spacing: 0;
 vertical-align: middle;
 text-align: left
}

table.infobox tr td {
 background: #3300CC;
 color: inherit;
 padding: 5px
}

table.infobox tr.infoboxrow td {
 background: #BDBDBD;
 border-top: 1px solid #999;
 border-bottom: 1px solid #999;
 color: inherit
}

table.infobox tr.infoboxrow td.bot {
 border-bottom: 1px solid #999;
 border-top: none;
}

table.infobox tr.infoboxrow td.top {
 border-bottom: none;
 border-top: 1px solid #999;
}

/*

===CSS for Skinning General Purpose Message Boxes===
&nbsp;*/

.messagebox {
 background: #F9F9F9;
 border: 1px solid #AAA;
 clear: both;
 color: black;
 margin: 0 auto 1em auto;
 padding: .45em;
 width: 80%
}

.messagebox.merge {
 background: #F0E5FF;
 color: black;
 border: 1px solid #C0B8CC;
 text-align: center
}

.messagebox.cleanup {
 background: #EFEFFF;
 border: 1px solid #9F9FFF;
 color: black;
 text-align: center
}

.messagebox.standard-talk {
 background: #F8EABA;
 border: 1px solid #C0C090;
 color: black
}

/*
===CSS for Skinning WikiProject Message Boxes===
&nbsp;*/

.messagebox.standard-talk.projectbm {
 background: #F8EABA url("/wiki/images/d/dc/Mech.gif") no-repeat 10px 13px;
 color: inherit;
 padding: 10px 10px 10px 40px
}

.messagebox.standard-talk.projectp {
 background: #F8EABA url("/wiki/images/thumb/5/59/Planet.png/25px-Planet.png") no-repeat 8px 13px;
 color: inherit;
 padding: 10px 10px 10px 40px
}

.messagebox.standard-talk.projectv {
 background: #F8EABA url("/wiki/images/thumb/0/08/Vehicle.gif/25px-Vehicle.gif") no-repeat 8px 13px;
 color: inherit;
 padding: 10px 10px 10px 40px
}

.messagebox.standard-talk.projectbio {
 background: #F8EABA url("/wiki/images/a/ad/Bio.gif") no-repeat 8px 13px;
 color: inherit;
 padding: 10px 10px 10px 40px
}


/*

===CSS for Skinning Normal Tables===
wikitable class for skinning normal tables

&nbsp;*/

table.wikitable {
 background: #F9F9F9;
 border: 1px #AAA solid;
 border-collapse: collapse;
 color: inherit;
 margin: 1em 1em 1em 0
}

table.wikitable th, table.wikitable td {
 border: 1px #AAA solid;
 padding: 0.2em
}

table.wikitable th {
 background: #F2F2F2;
 color: inherit;
 text-align: center
}

table.wikitable caption {
 font-weight: bold;
 margin-left: inherit;
 margin-right: inherit
}

/*
===Miscellaneous CSS===
This area is for CSS that isn't 'categorized'. Try to fit CSS under a 'category' if at all possible.

For boilerplate messages

&nbsp;*/

.boilerplate {
 background-color: #3300CC;
 border: 1px solid #AA8;
 color: black;
 margin: 0 auto;
 padding: 0 1em;
 text-align: center;
 width: 95%
}

/* for designating giant slabs of code */

code.block {
 display: table;
 line-height: 1.2em
}


/* Used in template:disambig

;Note: Won't display properly in IE. Then again, what does? */

.dabnote {
 background: url("/wiki/images/thumb/5/5f/Disambig_gray.svg/30px-Disambig_gray.svg.png") no-repeat 10px 50%;
 border-bottom: 1px solid #D3D3D3;
 border-top: 1px solid #D3D3D3;
 display: table;
 font-style: italic;
 height: 50px;
 margin: 0 auto;
 min-width: 80%
}

.dabnote > div:first-child {
 display: table-cell;
 padding-left: 50px;
 vertical-align: middle
} 


/* For indenting paragraphs on fancruft */

div.indent p {
 text-indent: 0.5in
}

/* Styles for "notices" */

.impt {
 font-weight: bold;
 font-size: 1.45em;
 line-height: 1.45em
}

.notice {
 margin: 1.5em;
 padding: 0.45em
}


/* Infobox template style ('stolen' from Wikipedia) */
.infobox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    color: black;
    margin-bottom: 0.5em;
    margin-left: 1em;
    padding: 0.2em;
    float: right;
    clear: right;
}
.infobox td,
.infobox th {
    vertical-align: top;
}
.infobox caption {
    font-size: larger;
    margin-left: inherit;
}
.infobox.bordered {
    border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
    border: 1px solid #aaa;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
    border: 0;
}
 
.infobox.sisterproject {
    width: 20em;
    font-size: 90%;
}
 
@media print {
    .infobox.sisterproject {
        display: none;
    }
}
 
/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
    border: 0;
    border-top: 1px solid #aaa;
    border-right: 1px solid #aaa;
}
 
.infobox.bordered .mergedrow td,
.infobox.bordered .mergedrow th {
    border: 0;
    border-right: 1px solid #aaa;
}
 
/* Styles for geography infoboxes, e.g. countries, country subdivisions, cities, etc. */
.infobox.geography {
    text-align: left;
    border-collapse: collapse;
    line-height: 1.2em; 
    font-size: 90%;
}
 
.infobox.geography  td,
.infobox.geography  th {
    border-top: solid 1px #aaa;
    padding: 0.4em 0.6em 0.4em 0.6em;
}
.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th {
    border-top: solid 1px #aaa;
    padding: 0.4em 0.6em 0.2em 0.6em;
}
 
.infobox.geography .mergedrow td,
.infobox.geography .mergedrow th {
    border: 0;
    padding: 0 0.6em 0.2em 0.6em;
}
 
.infobox.geography .mergedbottomrow td,
.infobox.geography .mergedbottomrow th {
    border-top: 0;
    border-bottom: solid 1px #aaa;
    padding: 0 0.6em 0.4em 0.6em;
}
 
.infobox.geography .maptable td,
.infobox.geography .maptable th {
    border: 0;
    padding: 0;
}


/***********************************************************
** TABLE: NAV-SIMPLE
*/
table.nav-simple {
	width: auto;
	clear: both;
	background-color: #A4A4A4;
	border: 2px solid #3300CC;
	margin: 1em auto 1em auto;
}

table.nav-simple tr th {
	background-color: #6699FF;
	border: 2px outset #3300CC;
	text-align: center;
	font-weight: bold;
}

table.nav-simple tr td {
	background-color: transparent;
	text-align: center;
}


.noautonum .tocnumber { 
  display: none; 
}