MediaWiki:Common.css

MediaWiki interface page
Revision as of 11:15, 19 January 2022 by HydeWing (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* Gallery View - Border */

li.gallerybox div.thumb img {
    border: 1px solid #dedede;
}

/* Gallery View - Text wrapper */

ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper, ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper, ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
width: 100% !important;
}

/* Gallery View - Image margin */

ul.mw-gallery-packed li.gallerybox div.thumb img, ul.mw-gallery-packed-overlay li.gallerybox div.thumb img, ul.mw-gallery-packed-hover li.gallerybox div.thumb img {
    margin-top: 5px;
}

/* Code -style */

.mw-highlight pre {

    -moz-tab-size: 4;
    tab-size: 4;
    position: relative;

}
pre, .mw-code {

    padding: 1em;
        padding-left: 1em;
    white-space: pre-wrap;
    overflow-x: hidden;
    word-wrap: break-word;

}
pre, code, .mw-code {

    background-color: #fdfdfd;
    color: #606060;
    border: 1px solid #f8f9fa;
    margin: 0px 0px 16px;

}
pre, code, tt, kbd, samp, .mw-code {

    font-family: monospace,monospace;

}
pre, .mw-code {

    line-height: 1.5;

}

/* LinkBar CSS */
.hbmenu {
list-style: none;
text-align: center;
margin: auto !important;
}

.hbmenu > li {
display: inline-flex;
border: 1px solid #94c0d4;
text-align: center;
background: #c8dce5;
padding: 10px;
font-weight: bold;
margin-right: -4px;
}

/* mobile Sections */
@media(max-width:719px) {
 body.mediawiki .mw-parser-output .infobox {
  float:none;
  clear:both;
  width:100%;
  margin:0 0 .5em 0
 }
.mw-content-ltr ul {
margin: 15px;
}
}

/* adjust the content a bit! */
#bodyContent {
    padding-top: 10px;
}

ul.gallery {
    text-align: left !important;
}
div.gallerytext > pre {
margin-top: -20px !important;
margin-bottom: 2px !important;
font-size: 13px !important;
font-family: inherit;
color: gray;
padding: 0;
border: none;
background: none;
}

table.ambox-content {
margin-bottom: 10px !important;
}

/* Table Settings */
tbody>tr>td>a, .gallerytext>p>a {
    font-weight: bolder;
}
.gallerytext>p>a {
    color: #383838 !important;
}
    
/* CSS Hover Gallery for Mediawiki
 * 
 * @author: Unknown
 * current version crafted together by [[User:Christharp]] from several CSS sites. For my website:[http://www.yellpedia.com/wiki/Main_Page Yellpedia]
 */

.zoom_img img{
-moz-transition:-moz-transform 0.1s ease-in; 
-webkit-transition:-webkit-transform 0.1s ease-in; 
-o-transition:-o-transform 0.1s ease-in;
transition:transform 0.1 ease-in;
}

.zoom_img img:hover{
-moz-transform:scale(2); 
-webkit-transform:scale(2);
-o-transform:scale(2);
transform:scale(2);
}

/* Start Infobox Css*/
.infobox-image {
text-align: center;
}

.infobox {
width: 300px;
}

.infobox-title {
font-size: 16px;
text-align: center;
background: #CEE0F2;
font-weight: bold;
padding: 10px;
}
.infobox-header {
    font-weight: bold;
    text-align: center;
    background: #CEE0F2;
    padding-top: 4px;
    padding-bottom: 4px;
}
/* End Infobox Css*/
.noticeDisplay {
    margin: 2em 0 !important;
    padding: 1em;
    font-size: 16px !important;
    color: #fff;
    text-indent: initial;
    font-weight: bold;
    background-color: #d63031;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(208,135,112,0.25);
}

.noticeDisplay a {
color: #fff;
text-decoration: underline;
}

.noticeDisplay a:hover {
color: #ff7675;
text-decoration: underline;
}

.kbd {
    display: inline-block;
    padding: 3px 5px;
    line-height: 10px;
    font-size: 16px;
    color: #d63031;
    vertical-align: middle;
    background-color: #fafbfc;
    border: solid 1px #d1d5da;
    border-bottom-color: #c6cbd1;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 #c6cbd1;
}

/* Google Fonts */
@import url("https://fonts.googleapis.com/css?family=Quicksand")

body {font-family: 'Quicksand', sans-serif;}
/* changes the default font used for MediaWiki to Noto Sans (does not include headings or monospaced text) */

div#content h1, div#content h2, div#content h3, div#content h4, div#content h5 {font-family: 'Quicksand', sans-serif;  font-weight: bold;}
/* changes the default font used for MediaWiki headings to Noto Serif */


/* <source lang="css"> */

/* wikitable/prettytable class for skinning normal tables */
table.wikitable {
  margin: 1em 1em 1em 0;
  background: #f9f9f9;
  border: 0px #aaaaaa solid;
  border-collapse: collapse;
  display: block;
  overflow-x: auto;
  border-block: none;
}
table.wikitable th, table.wikitable td {
  border: 1px #aaaaaa solid;
  padding: 0.2em;
}
table.wikitable th {
  background: #f2f2f2 !important;
  text-align: center !important;
}
table.wikitable caption {
  margin-left: inherit;
  margin-right: inherit;
}

/* apptable class for application lists */
table.apptable {
  width: 100%;
  background: #f9f9f9;
  border: 0px #aaaaaa solid;
  border-collapse: collapse;
  display: block;
  overflow-x: auto;
  border-block: none;
}
table.apptable th, table.apptable td {
  border: 1px #aaaaaa solid;
  text-align: left;
  padding: 0.2em 0.4em 0.2em 0.4em;
}
table.apptable th {
  background: #f2f2f2;
  text-align: left;
  padding: 0.2em 0.4em 0.2em 0.4em;
}
table.apptable caption {
  margin-left: inherit;
  margin-right: inherit;
}

/* cargo table that scroll*/
table.dataTable {
  display: block;
  overflow-x: auto;
  border-block: none;
  box-sizing: content-box
}

/*cargo width */
table.dataTable, table.dataTable th, table.dataTable td {
    width: 20%;
}

/* link navigation bar */
table.linkbar { 
  border-collapse: collapse;
}
table.linkbar td { 
  border: 1px solid #94c0d4;
  color: #000000;
  text-align: left;
  background: #c8dce5;
  white-space: nowrap;
}
table.linkbar td.sel { 
  background: #a4cddf;
  font-weight: bold;
  padding: 5px 15px 5px 15px;
}
table.linkbar td:hover { 
  background: #a4cddf; 
  cursor: pointer; 
}
table.linkbar a { 
  text-decoration: none; 
  color: #000000; 
  padding: 5px 15px 5px 15px; 
  display: block;
}
table.linkbarsub { 
  border-collapse: collapse; 
}
table.linkbarsub td { 
  border-right: 1px solid #c7c7c7; 
  border-left: 1px solid #c7c7c7; 
  border-bottom: 1px solid #c7c7c7; 
  color: #000000; 
  text-align: left; 
  background: #f0f0f0; 
  font-size: 12px;
  white-space: nowrap;
}
table.linkbarsub td.sel { 
  background: #dddddd; 
  font-weight: bold;
  padding: 5px 15px 5px 15px;
}
table.linkbarsub td:hover { 
  background: #dddddd; 
  cursor: pointer; 
}
table.linkbarsub a { 
  text-decoration: none; 
  color: #000000; 
  padding: 5px 15px 5px 15px;
  display: block; 
}

/* default skin for navigation boxes */
table.navbox {            /* navbox container style */
  border:1px solid #aaa;
  width:100%; 
  margin:auto;
  clear:both;
  font-size:88%;
  text-align:center;
  padding:1px;
}
table.navbox + table.navbox {
  margin-top:-1px;        /* single pixel border between adjacent navboxes (doesn't work for IE6, but that's okay) */
}
.navbox-title, .navbox-abovebelow, table.navbox th {
  text-align:center;      /* title and above/below styles */
  padding-left:1em;
  padding-right:1em;
}
.navbox-group {           /* group style */
  white-space:nowrap;
  text-align:right;
  font-weight:bold;
  padding-left:1em;
  padding-right:1em;
}
.navbox, .navbox-subgroup {
  background:#fdfdfd;     /* Background color */
}
.navbox-list {
  border-color:#fdfdfd;   /* Must match background color */
}
.navbox-title, table.navbox th {
  background:#ccccff;     /* Level 1 color */
}
.navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title {
  background:#ddddff;     /* Level 2 color */
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
  background:#e6e6ff;     /* Level 3 color */
}
.navbox-even {
  background:#f7f7f7;     /* Even row striping */
}
.navbox-odd {
  background:transparent; /* Odd row striping */
}
 
.collapseButton {         /* 'show'/'hide' buttons created dynamically by the        */
    float: right;         /* CollapsibleTables javascript in [[MediaWiki:Common.js]] */
    font-weight: normal;  /* are styled here so they can be customised.              */
    text-align: right;
    width: auto;
}
.navbox .collapseButton { /* In navboxes, the show/hide button balances the vde links from */
    width: 6em;           /* [[Template:Tnavbar]], so they need to be the same width.      */
}


/* Infobox template style */
.infobox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    color: black;
    margin: 0.5em 0 0.5em 1em;
    padding: 0.2em;
    float: right;
    clear: right;
}
.infobox td,
.infobox th {
    vertical-align: top;
}
.infobox caption {
    font-size: larger;
}
.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%;
}
 
.infobox.standard-talk {
    border: 1px solid #c0c090;
    background-color: #f8eaba;
}
.infobox.standard-talk.bordered td,
.infobox.standard-talk.bordered th {
    border: 1px solid #c0c090;
}
 
/* 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;
}


/* Messagebox templates */
.messagebox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    width: 80%;
    margin: 0 auto 1em auto;
    padding: .2em;
}
.messagebox.merge {
    border: 1px solid #c0b8cc;
    background-color: #f0e5ff;
    text-align: center;
}
.messagebox.cleanup {
    border: 1px solid #9f9fff;
    background-color: #efefff;
    text-align: center;
}
.messagebox.standard-talk {
    border: 1px solid #c0c090;
    background-color: #f8eaba;
    margin: 4px auto;
}



/* Cell sizes for ambox/tmbox/imbox/cmbox/ombox/fmbox/dmbox message boxes */
th.mbox-text, td.mbox-text {     /* The message body cell(s) */
    border: none; 
    padding: 0.25em 0.9em;       /* 0.9em left/right */
    width: 100%;    /* Make all mboxes the same width regardless of text length */
}
td.mbox-image {                  /* The left image cell */
    border: none; 
    padding: 2px 0 2px 0.9em;    /* 0.9em left, 0px right */
    text-align: center; 
}
td.mbox-imageright {             /* The right image cell */
    border: none;
    padding: 2px 0.9em 2px 0;    /* 0px left, 0.9em right */
    text-align: center; 
}
.mediawiki table.mbox-small {    /* For the "small=yes" option (also used elsewhere).   */
    clear: right;                /* The "mediawiki" class ensures that this declaration */
    float: right;                /* overrides styles set in "tmbox"/"ombox"/etc below   */
    margin: 4px 0 4px 1em;
    width: 238px;
    font-size: 88%;
    line-height: 1.25em;
}
 
/* Article message box styles */
table.ambox {            /* 10% = Will not overlap with other elements */
    margin: -1px 10% 0px;    /* -1px = Single border between stacked boxes in all browsers */
    border: 1px solid #aaa; 
    border-left: 10px solid #1e90ff;    /* Default "notice" blue */
    background: #fbfbfb; 
}
.ambox th.mbox-text, 
.ambox td.mbox-text {            /* The message body cell(s) */
    padding: 0.25em 0.5em;       /* 0.5em left/right */
}
.ambox td.mbox-image {           /* The left image cell */
    padding: 2px 0 2px 0.5em;    /* 0.5em left, 0px right */
}
.ambox td.mbox-imageright {      /* The right image cell */
    padding: 2px 0.5em 2px 0;    /* 0px left, 0.5em right */
}
 
table.ambox-notice {
    border-left: 10px solid #1e90ff;    /* Blue */
}
table.ambox-speedy {
    border-left: 10px solid #b22222;    /* Red */
    background: #fee;                   /* Pink */
}
table.ambox-delete {
    border-left: 10px solid #b22222;    /* Red */
}
table.ambox-content {
    border-left: 10px solid #f28500;    /* Orange */
}
table.ambox-style {
    border-left: 10px solid #f4c430;    /* Yellow */
}
table.ambox-move {
    border-left: 10px solid #9932cc;    /* Purple */
}
table.ambox-protection {
    border-left: 10px solid #bba;       /* Gray-gold */
}
 
/* Image message box styles */
table.imbox {
    margin: 4px 10%; 
    border-collapse: collapse; 
    border: 3px solid #1e90ff;    /* Default "notice" blue */
    background: #fbfbfb;
}
.imbox .mbox-text .imbox {    /* For imboxes inside imbox-text cells. */
    margin: 0 -0.5em;    /* 0.9 - 0.5 = 0.4em left/right. */
}
.mbox-inside .imbox {    /* For imboxes inside other templates. */
    margin: 4px;
}
 
table.imbox-notice {
    border: 3px solid #1e90ff;    /* Blue */
}
table.imbox-speedy {
    border: 3px solid #b22222;    /* Red */
    background: #fee;             /* Pink */
}
table.imbox-delete {
    border: 3px solid #b22222;    /* Red */
}
table.imbox-content {
    border: 3px solid #f28500;    /* Orange */
}
table.imbox-style {
    border: 3px solid #f4c430;    /* Yellow */
}
table.imbox-move {
    border: 3px solid #9932cc;    /* Purple */
}
table.imbox-protection {
    border: 3px solid #bba;       /* Gray-gold */
}
table.imbox-license {
    border: 3px solid #88a;       /* Dark gray */
    background: #f7f8ff;          /* Light gray */
}
table.imbox-featured {
    border: 3px solid #cba135;    /* Brown-gold */
}
 
/* Category message box styles */
table.cmbox {
    margin: 3px 10%;
    border-collapse: collapse;
    border: 1px solid #aaa; 
    background: #DFE8FF;    /* Default "notice" blue */
}
 
table.cmbox-notice {
    background: #D8E8FF;    /* Blue */
}
table.cmbox-speedy {
    margin-top: 4px;
    margin-bottom: 4px;
    border: 4px solid #b22222;    /* Red */
    background: #FFDBDB;          /* Pink */
}
table.cmbox-delete {
    background: #FFDBDB;    /* Red */
}
table.cmbox-content {
    background: #FFE7CE;    /* Orange */
}
table.cmbox-style {
    background: #FFF9DB;    /* Yellow */
}
table.cmbox-move {
    background: #E4D8FF;    /* Purple */
}
table.cmbox-protection {
    background: #EFEFE1;    /* Gray-gold */
}
 
/* Other pages message box styles */
table.ombox {
    margin: 4px 10%; 
    border-collapse: collapse; 
    border: 1px solid #aaa;       /* Default "notice" gray */
    background: #f9f9f9;
}
 
table.ombox-notice {
    border: 1px solid #aaa;       /* Gray */
}
table.ombox-speedy {
    border: 2px solid #b22222;    /* Red */
    background: #fee;             /* Pink */
}
table.ombox-delete {
    border: 2px solid #b22222;    /* Red */
}
table.ombox-content {
    border: 1px solid #f28500;    /* Orange */
}
table.ombox-style {
    border: 1px solid #f4c430;    /* Yellow */
}
table.ombox-move {
    border: 1px solid #9932cc;    /* Purple */
}
table.ombox-protection {
    border: 2px solid #bba;       /* Gray-gold */
}
 
/* Talk page message box styles */
table.tmbox {
    margin: 4px 10%;
    border-collapse: collapse;
    border: 1px solid #c0c090;    /* Default "notice" gray-brown */
    background: #f8eaba;
}
.mediawiki .mbox-inside .tmbox { /* For tmboxes inside other templates. The "mediawiki" */
    margin: 2px 0;               /* class ensures that this declaration overrides other */
    width: 100%;  /* For Safari and Opera */     /* styles (including mbox-small above) */
}
.mbox-inside .tmbox.mbox-small { /* "small" tmboxes should not be small when  */
    line-height: 1.5em;          /* also "nested", so reset styles that are   */   
    font-size: 100%;             /* set in "mbox-small" above.                */
}
 
 
table.tmbox-speedy {
    border: 2px solid #b22222;    /* Red */
    background: #fee;             /* Pink */
}
table.tmbox-delete {
    border: 2px solid #b22222;    /* Red */
}
table.tmbox-content {
    border: 2px solid #f28500;    /* Orange */
}
table.tmbox-style {
    border: 2px solid #f4c430;    /* Yellow */
}
table.tmbox-move {
    border: 2px solid #9932cc;    /* Purple */
}
table.tmbox-protection,
table.tmbox-notice {
    border: 1px solid #c0c090;    /* Gray-brown */
}
 
/* Pink fmbox warning style for div based warning notices. */
div.fmbox-warning,
div.mw-warning-with-logexcerpt {
    clear: both;
    margin: 0.2em 0;
    border: 1px solid #BB7070;
    background: #FFDBDB;
    padding: 0.25em 0.9em;
}


/* For template documentation */
.template-documentation {
    clear: both;
    margin: 1em 0 0 0;
    border: 1px solid #aaa; 
    background-color: #ecfcf4; 
    padding: 5px;
}

/* Standard Navigationsleisten, aka box hiding thingy from .de.  Documentation at [[Wikipedia:NavFrame]]. */
div.NavFrame {
    margin: 0;
    padding: 4px;
    border: 1px solid #aaa;
    text-align: center;
    border-collapse: collapse;
    font-size: 95%;
}
div.NavFrame + div.NavFrame {
    border-top-style: none;
    border-top-style: hidden;
}
div.NavPic {
    background-color: #fff;
    margin: 0;
    padding: 2px;
    float: left;
}
div.NavFrame div.NavHead {
    height: 1.6em;
    font-weight: bold;
    background-color: #ccf;
    position:relative;
}
div.NavFrame p {
    font-size: 100%;
}
div.NavFrame div.NavContent {
    font-size: 100%;
}
div.NavFrame div.NavContent p {
    font-size: 100%;
}
div.NavEnd {
    margin: 0;
    padding: 0;
    line-height: 1px;
    clear: both;
}
a.NavToggle {
    position: absolute;
    top: 0;
    right: 3px;
    font-weight: normal;
    font-size: 90%;
}


/* Makes redirects appear in italics in categories and on [[Special:Allpages]] */
.redirect-in-category, .allpagesredirect {
    font-style: italic;
}

/* Prevents line breaks in links */
.nowraplinks a {
    white-space: nowrap;
}

/* Put a checker background at the image description page only visible if the image has transparent background */
#file img {
    background: url("http://wiibrew.org/w/images/5/5d/Checker-16x16.png") repeat;
}

/* Increase the height of the image upload box */
#wpUploadDescription {
    height: 13em;
}
 
/* Reduce line-height for <sup> and <sub> */
sup, sub {
    line-height: 1em;
}

/* Coloured watchlist numbers */
.mw-plusminus-pos {
    color: #006400; /* darkgreen */
}
 
/* .mw-plusminus-null currently at developer default */
 
.mw-plusminus-neg {
    color: #8B0000; /* darkred */
}

/* Style for "notices" */
.notice {
    margin: 1em;
    padding: 0.2em;
}

/* Allow limiting of which header levels are shown in a TOC;
   <div class="toclimit-3">, for instance, will limit to
   showing ==headings== and ===headings=== but no further
   (as long as there are no =headings= on the page, which
   there shouldn't be according to the MoS).
 */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul { display: none; }


/* </source> */

Advertising: