User:Rigel Kent/mobile.css: Difference between revisions

Revision as of 10:01, 11 December 2015

/** Begin shared desktop + mobile view styles **/

/* Make sure any changes are copied to MediaWiki:Common.css and vice versa. */
/* CSS placed here will be used by both desktop view and mobile view skins. */

h2 {
    padding-top: 15px;
}

li.main li {
    padding-right: 2px;
    text-align: left;
    padding-left: 20px;
}

.columnOn {
    background: url("/w/gfx/tick.png") no-repeat scroll 0 50% transparent;
}

.columnOff {
    background: url("/w/gfx/cross.png") no-repeat scroll 0 50% transparent;
}

.tabs {
    font-size: 1.05em;
}

/* Shrink an element to fit its container, similar to images in mobile skins */
.shrink-to-fit {
    max-width:100%;
    height:auto;
}

/* Class to retain pixelation when zoomed */
.pixelated {
    -ms-interpolation-mode:nearest-neighbor;   /* IE 7-11 */
    image-rendering:-webkit-optimize-contrast; /* old Webkit browsers */
    image-rendering:pixelated;                 /* Chrome / Opera */
    image-rendering:-webkit-crisp-edges;       /* Safari */
    image-rendering:-moz-crisp-edges;          /* Firefox */
    image-rendering:-o-crisp-edges;            /* old Opera */
    image-rendering:crisp-edges;
}

/* Recent changes byte indicators */
.mw-plusminus-pos { color: #006500; }
.mw-plusminus-neg { color: #8B0000; }

.collapseButton {
    float: right;
    text-align: right;
    font-size: .85em;
}

/* Add scroll bars to dragscroll elements if needed */
.dragscroll {
    overflow: auto;
}

.plainlinks a {
    background: transparent none repeat scroll 0 0 !important;
    padding: 0 !important;
}

/*** Infobox related styles **************************
 *****************************************************/

.infobox {
   border: 1px solid #aaaaaa;
   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 #aaaaaa;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
   border: 0;
}

/*** End infobox related styles ****************************
 ***********************************************************/

/*** List table styles *************************************
 ***********************************************************/

.listTable {
    border: 1px solid #AAAAAA;
    border-collapse: collapse;
    margin-bottom: 10px;
}

.listTable tr {
    border: 1px solid #AAAAAA;
    border-collapse: collapse;
}

.listTable th {
    border: 1px solid #AAAAAA;
    border-collapse: collapse;
    background-color: #F2F2F2;
    text-align: center;
    padding: 3px;
}

.listTable td {
    border: 1px solid #AAAAAA;
    border-collapse: collapse;
    background-color: #F2F2F2;
    padding: 3px;
}

.listTable td.highlight {
    background-color: #3366CC;
}

.hidden {
    display: none;
}

/*
tr.odd {

}

tr.even {

}
*/

/*** End list table styles ********************************
 **********************************************************/

/*** Location template styles *****************************
 **********************************************************/

.locationTemplateTable {
    font-size:90%;
    margin: 5px 10px 5px 0px;
    border-collapse: collapse;
}
.locationTemplateHeader {
    background-color: #258E36;
    color: white;
    text-align: center;
    vertical-align: middle;
    border-collapse: collapse;
    border:1px solid black;
}

.locationTemplateHeader a {
    color:white;
}

.locationTemplateSubheader {
   border: 1px solid black;
   text-align: center;
}

.locationTemplateCell {
    text-align: center;
    vertical-align: middle;
    border: 1px solid black;
    border-collapse: collapse;
}

/*** End location template styles ****************************
 *************************************************************

/*** Equipment template styles *******************************
 *************************************************************/

.equipmentTemplateTable {
    font-size:90%;
    margin: 0px 5px 5px 0px;
    border-collapse: collapse;
}

.equipmentTemplateTable {
    padding: 5px;
}
.equipmentTemplateHeader {
    background-color: firebrick;
    color: white;
    text-align: center;
    vertical-align: middle;
    border-collapse: collapse;
    border:1px solid black;
}

.equipmentTemplateHeader a {
    color:white;
}

.equipmentTemplateSubheader {
   border: 1px solid black;
   text-align: center;
}

.equipmentTemplateCell {
    text-align: center;
    vertical-align: middle;
    border: 1px solid black;
    border-collapse: collapse;
}

/*** End equipment template styles *********************************
 *******************************************************************/

/*** Enemy template styles *****************************************
 *******************************************************************/

.enemyTemplateTable {
    font-size:90%;
    margin: 0px;
    border-collapse: collapse;
    width: 300px;
    border: 1px solid black;
}
.enemyTemplateHeader {
    background-color: #CC5B14;
    color:white;
    text-align: center;
    vertical-align: middle;
    border-collapse: collapse;
    border:1px solid black;
}

.enemyTemplateHeader a {
    color:white;
}

.enemyTemplateCell {
    text-align: center;
    vertical-align: middle;
    border: 1px solid black;
    border-collapse: collapse;
}

/*** End enemy template styles ********************************
 ******************************************************************/

/*** Character template styles ************************************
 ******************************************************************/

.characterTemplateTable {
    font-size:90%;
    margin: 0px 5px 5px 0px;
    border-collapse: collapse;
    text-align:center;
    padding:5px;
}
.characterTemplateHeader {
    background-color: #33339F;
    color:white;
    text-align: center;
    vertical-align: middle;
    border-collapse: collapse;
    border:1px solid black;
}

.characterTemplateHeader a {
    color:white;
}

.characterTemplateSubheader {
   border: 1px solid black;
   text-align: center;
}


.characterTemplateCell {
    text-align: center;
    vertical-align: middle;
    border: 1px solid black;
    border-collapse: collapse;
}

/*** End character template styles **********************************
 ********************************************************************

/*** Spell template styles ******************************************
 ********************************************************************/

.spellTemplateTable {
    font-size:90%;
    margin: 0px 5px 5px 0px;
    border-collapse: collapse;
}

.spellTemplateTable td {
    padding: 5px;
}
.spellTemplateHeader {
    background-color: firebrick;
    color: white;
    text-align: center;
    vertical-align: middle;
    border-collapse: collapse;
    border:1px solid black;
}

.spellTemplateCell {
    text-align: center;
    vertical-align: middle;
    border: 1px solid black;
    border-collapse: collapse;
}

/*** End spell template styles *************************************
 *******************************************************************/

/*** Navigation styles for all skins *******************************
 *******************************************************************/

.navbox {
    clear:both;
    border:1px solid silver; 
    text-align:center;
    font-weight:bold;
    color:#FFFFFF;
}

.navbox a,
.navbox a.external,
.navbox a.external:visited {
    color:#FFFFFF;
}

.navbox .mw-collapsible-toggle {
    position:relative;
    top:3px;
    right:3px;
}

.navbox-header {
    padding:2px;
}

.navbox-title {
    font-size:120%;
}

.navbox-subheader {
    padding:2px;
    font-size:95%;
}

.navbox-content {
    padding:2px;
    font-size:85%; 
    text-align:left;
    color:#000000;
}

/*
 * custom styles for navigation templates
 * Note: these groups of style classes exist as a set 
 * for a particular 'theme' of nav bars.
 * for example, navMainSeries is the default 'theme'
 */

.navMainSeries,
.navMainSeries a {
    background: #3366CC;
    color: #FFFFFF;
}

.navMainSeriesContent {
    background: #D6E0F5;
}

.navMainSeriesContent a {
    color: #3366CC;
}

.navGameSeries,
.navGameSeries a {
    background: #000000;
    color: #FFFFFF;
}

.navClasses,
.navClasses a {
    background: #E65C00;
    color: #FFFFFF;
}

.tnav {
    float:left;
    font-size:70%;
}

/*** End of navigation styles **********************************
 ***************************************************************/

/* Message box styles (taken from Wikipedia Common.css) */
.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 */
}
.mbox-image {                    /* The left image cell */
    border: none; 
    padding: 2px 0 2px 0.9em;    /* 0.9em left, 0px right */
    text-align: center; 
}
.mbox-empty-cell {               /* An empty narrow cell */
    border: none;
    padding: 0px;
    width: 1px;
}

.mbox {
    margin: 4px 10%; 
    border-collapse: collapse; 
    border: 1px solid #aaa;       /* Default "notice" gray */
    background: #f9f9f9;
}
 
.mbox-notice, .mbox-walkthrough, .mbox-disambig, .mbox-incomplete, .mbox-s-stub {
    border: 1px solid #aaa;       /* Gray */
}
.mbox-speedy, .mbox-delete {
    border: 2px solid #b22222;    /* Red */
    background: #fee;             /* Pink */
}
.mbox-stub, .mbox-sitenotice {
    border: 2px solid #1e90ff;    /* Blue */
}
.mbox-guideline {
    border: 1px solid #f28500;    /* Orange */
}
.mbox-future {
    border: 1px solid #f4c430;    /* Yellow */
}
.mbox-localization {
    border: 1px solid #9932cc;    /* Purple */
}
.mbox-protection {
    border: 2px solid #bba;       /* Gray-gold */
}

/** End shared desktop + mobile view styles **/

/* CSS placed below will be used by mobile view skins only. */

/* List styles for Minerva skin */
.content ul.inline-list, .content ol.inline-list, .inline-list ul, .inline-list ol {
    margin:0.5em 0;
    overflow-x:hidden;
    list-style-type:none;
}
.inline-list li {
    display:inline;
    margin:0 1.18em 0 0;
    white-space:nowrap;
}
.inline-list li + li {
    margin-left:-1.18em;
}
.inline-list li + li:before {
    content:"\a0•\a0";
}
.content ul.plain-list, .content ol.plain-list, .plain-list ul, .plain-list ol {
    margin:0;
    list-style-type:none;
    list-style-image:none;
}
.plain-list li {
    margin:0;
}

/* Override Minerva skin navbox hiding */
.content .navbox {
    display:block !important;
}

/* Override Minerva skin image shrinking */
.content a > img.max-width-none {
    max-width:none !important;
}