MediaWiki:Common.css: Difference between revisions

Revision as of 16:20, 13 July 2017

/* CSS placed here will be applied to all skins */
* {
font-family: Verdana,Arial,Helvetica,sans-serif;
}

/* Table for navigational menu on drop page */
td.nav {
opacity: 1;
filter: alpha(opacity=100);
}

td.nav:hover {
opacity: 0.5;
filter: alpha(opacity=50);
}

table.dex {
color: #fff;
text-shadow: 0 0 3px #0f0f0f, 0 0 5px #1a1a1a;
box-shadow: 0 0 3px #0f0f0f, 0 0 5px #1a1a1a;
background-color: #a80101;
border: 2px solid #a00101;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
-moz-border-top-left-radius: 10px;
-moz-border-top-right-radius: 10px;
-moz-border-bottom-left-radius: 10px;
-moz-border-bottom-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-khtml-border-top-left-radius: 10px;
-khtml-border-top-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-icab-border-top-left-radius: 10px;
-icab-border-top-right-radius: 10px;
-icab-border-bottom-left-radius: 10px;
-icab-border-bottom-right-radius: 10px;
-o-border-top-left-radius: 10px;
-o-border-top-right-radius: 10px;
-o-border-bottom-left-radius: 10px;
-o-border-bottom-right-radius: 10px;
padding: 0 10px 0 10px;
}

/* Info panel, float right */

info-panel-right {
float: right;
}

/* Type background-colors */

.container-bug,.bug-dex { background-color: #A8B820; }
.container-electric,.electric-dex { background-color: #F8D030; }
.container-dark,.dark-dex{ background-color: #705848; }
.container-psychic,.psychic-dex { background-color: #F85888; }
.container-normal,.normal-dex { background-color: #A8A878; }
.container-fighting,.fighting-dex { background-color: #C03028; }
.container-flying,.flying-dex { background-color: #A890F0; }
.container-poison,.poison-dex { background-color: #A040A0; }
.container-ground,.ground-dex { background-color: #E0C068; }
.container-rock,.rock-dex { background-color: #B8A038; }
.container-ghost,.ghost-dex { background-color: #705898; }
.container-dragon,.dragon-dex { background-color: #7038F8; }
.container-fairy,.fairy-dex { background-color: #EE99AC; }
.container-grass,.grass-dex { background-color: #78C850; }
.container-steel,.steel-dex { background-color: #B8B8D0; }
.container-ice,.ice-dex { background-color: #98D8D8; }
.container-fire,.fire-dex { background-color: #F08030; }
.container-water,.water-dex { background-color: #6890F0; }
.container-unknown,.unknown-dex { background-color: #68A090; }
.container-attacks,.container-pkmn { background-color: #A80101 }
.container-sidequests { background-color: #DA9919 }
.container-sidequestsub { background-color: #FFC966 }

.container-sidequestsub,.container-sidequests,.container-bug,.container-electric,.container-dark,.container-psychic,.container-normal,.container-fighting,.container-flying,.container-poison,.container-ground,.container-rock,.container-ghost,.container-dragon,.container-fairy,.container-grass,.container-steel,.container-ice,.container-fire,.container-water,.container-unknown,.container-attacks,.bug-dex,.electric-dex,.dark-dex,.psychic-dex,.normal-dex,.fighting-dex,.flying-dex,.poison-dex,.ground-dex,.rock-dex,.ghost-dex,.dragon-dex,.fairy-dex,.grass-dex,.steel-dex,.ice-dex,.fire-dex,.water-dex,.unknown-dex {
border: 3px solid rgba(0,0,0,0.1);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
-moz-border-top-left-radius: 10px;
-moz-border-top-right-radius: 10px;
-moz-border-bottom-left-radius: 10px;
-moz-border-bottom-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-khtml-border-top-left-radius: 10px;
-khtml-border-top-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-icab-border-top-left-radius: 10px;
-icab-border-top-right-radius: 10px;
-icab-border-bottom-left-radius: 10px;
-icab-border-bottom-right-radius: 10px;
-o-border-top-left-radius: 10px;
-o-border-top-right-radius: 10px;
-o-border-bottom-left-radius: 10px;
-o-border-bottom-right-radius: 10px;
padding: 10px;
margin: 10px;
}

.bug,.electric,.dark,.psychic,.normal,.fighting,.flying,.poison,.ground,.rock,.ghost,.dragon,.fairy,.grass,.steel,.ice,.fire,.water,.unknown,.attacks,.pkmn {
color: rgba(0,0,0,0.7);
background-color: #fff;
border: 3px solid rgba(0,0,0,0.1);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
-moz-border-top-left-radius: 10px;
-moz-border-top-right-radius: 10px;
-moz-border-bottom-left-radius: 10px;
-moz-border-bottom-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-khtml-border-top-left-radius: 10px;
-khtml-border-top-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-icab-border-top-left-radius: 10px;
-icab-border-top-right-radius: 10px;
-icab-border-bottom-left-radius: 10px;
-icab-border-bottom-right-radius: 10px;
-o-border-top-left-radius: 10px;
-o-border-top-right-radius: 10px;
-o-border-bottom-left-radius: 10px;
-o-border-bottom-right-radius: 10px;
padding: 10px;
background: rgba(255,255,255,0.5);
}

/* General type bar for use with type effectiveness sections */

.type {
width: 100px;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-khtml-border-radius: 20px;
-icab-border-radius: 20px;
-o-border-radius: 20px;
border: 1px solid black;
text-align: center;
margin: 5px;
float: left;
}


/* 
 * StatBar
 * Anything where you need to display something in a small bar
 * For example, gender ratio or HP - This can be used
 */

.statbarLeft {
    border-top-left-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -webkit-border-top-left-radius: 20px;
    -khtml-border-top-left-radius: 20px;
    -icab-border-top-left-radius: 20px;
    -o-border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    -moz-border-radius-bottomleft: 20px;
    -webkit-border-bottom-left-radius: 20px;
    -khtml-border-bottom-left-radius: 20px;
    -icab-border-bottom-left-radius: 20px;
    -o-border-bottom-left-radius: 20px;
    color: #FFF;
    height: 10px;
    border: 0.5px solid black;
    overflow: hidden;
}

.statbarRight {
    border-top-right-radius: 20px;
    -moz-border-radius-topright: 20px;
    -webkit-border-top-right-radius: 20px;
    -khtml-border-top-right-radius: 20px;
    -icab-border-top-right-radius: 20px;
    -o-border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    -moz-border-radius-bottomright: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -khtml-border-bottom-right-radius: 20px;
    -icab-border-bottom-right-radius: 20px;
    -o-border-bottom-right-radius: 20px;
    color: #000;
    height: 10px;
    border: 0.5px solid black;
    overflow: hidden;
}


/* Gender ratio bars */

.maleOnly {
    background: #3355FF;
}

.femaleOnly {
    background: #FF77DD;
}

.genderless {
	background: #6E6E6E;
}

.male87 {
    float: left;
    background: #3355FF;
    width: 87.5%;
    border-right-width: 0px;
}

.male75 {
    float: left;
    background: #3355FF;
    width: 75%;
    border-right-width: 0px;
}

.male50 {
    float: left;
    background: #3355FF;
    width: 50%;
    border-right-width: 0px;
}

.male25 {
    float: left;
    background: #3355FF;
    width: 25%;
    border-right-width: 0px;
}

.female12 {
    float: left;
    background: #FF77DD;
    width: 12.5%;
    border-left-width: 0px;
}

.female25 {
    float: left;
    background: #FF77DD;
    width: 25%;
    border-left-width: 0px;
}

.female50 {
    float: left;
    background: #FF77DD;
    width: 50%;
    border-left-width: 0px;
}

.female75 {
    float: left;
    background: #FF77DD;
    width: 75%;
    border-left-width: 0px;
}

.genderless, .femaleOnly, .maleOnly {
    width: 100%;
    float: left;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    -icab-border-radius: 20px;
    -o-border-radius: 20px;
    color: #FFF;
    height: 10px;
    border: 0.5px solid black;
    overflow: hidden;
}

.dragon-dex a, .dragon-dex a:visited, .dragon-dex a:active, .poison-dex a, .poison-dex a:visited, .poison-dex a:active, .ghost-dex a, .ghost-dex a:visited, .ghost-dex a:active, .dark-dex a, .dark-dex a:visited, .dark-dex a:active {
color: #ffffff;
}