MediaWiki:Common.css: Difference between revisions

From ARMS Institute, the ARMS Wiki
Jump to navigation Jump to search
(External visited links in black headings should still be yellow.)
(Removed discs from NIWA list.)
Line 122: Line 122:
     width: 50%;
     width: 50%;
     background: #ffddff;
     background: #ffddff;
}
td#home_niwa ul {
    list-style:none;
    margin-left: 0;
    padding-left: 0;
}
}
/* END Home Boxes */
/* END Home Boxes */

Revision as of 10:40, 22 June 2017

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

@import url('https://fonts.googleapis.com/css?family=Hind:400,700');

@import url("https://fast.fonts.net/lt/1.css?apiType=css&c=497c235b-38ae-4528-945d-4f70f5102d8a&fontids=1449668");
@font-face{
    font-family:"Akko W04 Black";
    src:url("/Fonts/1449668/5fdfd10d-8184-4369-9007-1bcb9662aab3.eot?#iefix");
    src:url("/Fonts/1449668/5fdfd10d-8184-4369-9007-1bcb9662aab3.eot?#iefix") format("eot"),url("/Fonts/1449668/6c257adf-c89f-4573-bc63-04a8af4cdce6.woff2") format("woff2"),url("/Fonts/1449668/5cfa0607-446b-4783-aa97-883acfccb390.woff") format("woff"),url("/Fonts/1449668/1d53c19e-27fe-49ab-8786-4f08e09b633e.ttf") format("truetype");
}

div#mw-panel {
    font-family: "Hind", sans-serif;
    font-variant-ligatures: none;
}

div#mw-panel div.portal h3,
div#mw-panel div.portal div.body ul li {
    font-size: 87.5%;
}

.mw-body-content {
    font-family: "Hind", sans-serif;
    font-variant-ligatures: none;
    font-size: 100%;
    line-height: 1.4;
}

.mw-body h1,
.mw-body h2,
.mw-body h3 {
    font-family: "Akko W04 Black";
}

.mw-body h1 { font-size: 32px; }
.mw-body h2 { font-size: 24px; }
.mw-body h3 { font-size: 20px; }

body.page-Home.action-view h1.firstHeading,
body.page-Home.action-submit h1.firstHeading {
	display: none;
}

div#content .noticebox {
	margin-left: auto;
	margin-right: auto;
	border-color: #aa9999;
	background: #ffeeee;
}

div#content .noticebox > tr > th,
div#content .noticebox > tr > th,
div#content .noticebox > * > tr > th,
div#content .noticebox > * > tr > td {
	border-color: #aa9999;
}

/* BEGIN Home boxes */
div#bodyContent h1 {
    font-size: 32px;
    border-bottom: 0;
}

td.home_box {
    border-radius: 30px 30px 8px 8px;
    padding: 0 20px 10px;    
}

td.home_box h2 {
    position: relative;
    overflow: visible;
    margin-top: 0;
    margin-bottom: 10px;
    border-bottom: 0;
    line-height:30px;
    color: #ffff00;
    z-index: 1;
}

td.home_box h2::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: -20px;
    bottom: 0;
    left: -20px;
    background: #000000;
    border-radius: 10px 0;
    transform: skew(-20deg);
    z-index: -1;
}

td.home_box h2 a.external:visited,
td.home_box h2 a.external,
td.home_box h2 a {
    color: #ffff00;
}

td#home_intro {
    width: 50%;
    text-align: center;
}

td#home_news {
    width: 50%;
    background: #97ffc4;
}

td#home_featured {
    background: #97dbff;
}

td#home_other {
    vertical-align: top;
    width: 50%;
    background: #ffffaa;
}

td#home_help {
    vertical-align: top;
    width: 50%;
    background: #ffddff;
}

td#home_niwa ul {
    list-style:none;
    margin-left: 0;
    padding-left: 0;
}
/* END Home Boxes */

table.home_nav_imgs img {
	max-width: 100%;
	width: auto;
	height: auto;
}

table.wikitable[align="right"] {
    margin-left: 20px;
}

table.wikitabley[align="right"] {
    margin-left: 20px;
}

/* BEGIN Interim Info and Nav boxes */
#toc,
.toc,
.catlinks,
table.wikitable > * > tr > td {
    border-color: #aaaa00;
    background-color: #ffffb2;
}

table.wikitabley > * > tr > td {
    border-color: #aaaa00;
    background-color: #ffffb2;
}

table.wikitable > * > tr > th {
    font: 16px "Akko W04 Black";
    border-color: #aaaa00;
    background-color: #000000;
    color: #ffffff;
}

table.wikitabley > * > tr > th {
    font: 16px "Akko W04 Black";
    border-color: #aaaa00;
    background-color: #dddd82;
}

table.wikitable:not(.fighter_stats) > * > tr:first-child > th {
    font: 20px "Akko W04 Black";
    background-color: #000000;
    color: #ffffff;
}

table.wikitabley:not(.fighter_stats) > * > tr:first-child > th {
    font: 20px "Akko W04 Black";
    background-color: #000000;
    color: #ffffff;
}

table.wikitable > * > tr:first-child > th a {
    color: #ffff00;
}
table.wikitabley > * > tr:first-child > th a {
    color: #ffff00;
}

.mw-collapsible-toggle a {
     color: lightblue;
}

/* END Interim Info and Nav boxes */

/* BEGIN ARMS-themed boxes with yellow backgrounds and black, rounded headings */
div.armsbox {
    background: linear-gradient(to right, #eeee55, transparent, transparent, #eeee55),
        linear-gradient(to bottom, #eeee55, #ffff66, #ffff66, #eeee55);   
    border-radius: 25px 0 8px 8px;
    padding-bottom: 20px;
}

div.armsbox div.header {
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0 20px;
    font-family: "Akko W04 Black";
    font-size: 22px;
    color: #ffffff;
    z-index: 1;
}

div.armsbox div.header::before {
    content: "";
    background-color: #000000;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 12px 0;
    z-index: -1;    
}

div.armsbox div.header a {
    color: #ffff00;
}

div.armsbox > p {
    margin-left: 20px;
    margin-right: 20px;
}
/* END ARMS-themed boxes with yellow backgrounds and black, skewed headings */

/* BEGIN infobox */
div.infobox {
    position: relative;
    z-index: 2;
}
/* END infobox */

/* BEGIN fighter infobox */
div.infobox.fighter {
    float: right;
    max-width: 330px;
    margin-left: 20px;
    border-top-left-radius: 40px;
}

div.infobox.fighter div.header.name {
    margin-top: 0;
    padding: 10px 20px;
    line-height: 1;
    text-transform: uppercase;
}

div.infobox.fighter div.header.name::before {
    border-radius: 16px 0;
}

div.infobox.fighter div.header.name::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-repeat: no-repeat;
    background-position: right +8px center;
    background-size: 20%;
    z-index: 0;
}

div.infobox.fighter div.header.name div.nickname {
    font-family: "Hind", sans-serif;
    font-size: 16px;
    font-style: italic;
    text-transform: none;
}

div.infobox.fighter div.background {
    border-radius: 40px 0 25px 0;
    background-size: cover;
    background-position: center;
}

div.infobox.fighter div.image img {
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.3));
}

div.infobox.fighter.Spring div.name::before {
    background-color: #0178da;
}
div.infobox.fighter.Spring div.name::after {
    background-image: url(/wiki/images/8/88/Logo-Spring_Man.png);
}
div.infobox.fighter.Spring div.background {
    background-image: url(/wiki/images/7/7b/BG-Spring_Man.png);
}

div.infobox.fighter.Ribbon div.name::before {
    background-color: #e61991;
}
div.infobox.fighter.Ribbon div.name::after {
    background-image: url(/wiki/images/4/48/Logo-Ribbon_Girl.png);
}
div.infobox.fighter.Ribbon div.background {
    background-image: url(/wiki/images/3/36/BG-Ribbon_Girl.png);
}

div.infobox.fighter.Ninjara div.name::before {
    background-color: #003764;
}
div.infobox.fighter.Ninjara div.name::after {
    background-image: url(/wiki/images/f/f0/Logo-Ninjara.png);
}
div.infobox.fighter.Ninjara div.background {
    background-image: url(/wiki/images/7/7a/BG-Ninjara.png);
}

div.infobox.fighter.Mummy div.name::before {
    background-color: #8c199b;
}
div.infobox.fighter.Mummy div.name::after {
    background-image: url(/wiki/images/5/50/Logo-Master_Mummy.png);
}
div.infobox.fighter.Mummy div.background {
    background-image: url(/wiki/images/4/4e/BG-Master_Mummy.png);
}

div.infobox.fighter.Min div.name::before {
    background-color: #00772d;
}
div.infobox.fighter.Min div.name::after {
    background-image: url(/wiki/images/9/97/Logo-Min_Min.png);
}
div.infobox.fighter.Min div.background {
    background-image: url(/wiki/images/5/50/BG-Min_Min.png);
}

div.infobox.fighter.Mechanica div.name::before {
    background-color: #ef9831;
}
div.infobox.fighter.Mechanica div.name::after {
    background-image: url(/wiki/images/3/33/Logo-Mechanica.png);
}
div.infobox.fighter.Mechanica div.background {
    background-image: url(/wiki/images/3/3c/BG-Mechanica.png);
}

div.infobox.fighter.Twintelle div.name::before {
    background-color: #795d2b;
}
div.infobox.fighter.Twintelle div.name::after {
    background-image: url(/wiki/images/8/86/Logo-Twintelle.png);
}
div.infobox.fighter.Twintelle div.background {
    background-image: url(/wiki/images/5/53/BG-Twintelle.png);
}

div.infobox.fighter.Barq div.name::before {
    background-color: #1761b1;
}
div.infobox.fighter.Barq div.name::after {
    background-image: url(/wiki/images/2/21/Logo-Byte_%26_Barq.png);
}
div.infobox.fighter.Barq div.background {
    background-image: url(/wiki/images/a/a6/BG-Byte_&_Barq.png);
}

div.infobox.fighter.Cobra div.name::before {
    background-color: #41217e;
}
div.infobox.fighter.Cobra div.name::after {
    background-image: url(/wiki/images/4/41/Logo-Kid_Cobra.png);
}
div.infobox.fighter.Cobra div.background {
    background-image: url(/wiki/images/3/3a/BG-Kid_Cobra.png);
}

div.infobox.fighter.Helix div.name::before {
    background-color: #144537;
}
div.infobox.fighter.Helix div.name::after {
    background-image: url(/wiki/images/a/aa/Logo-Helix.png);
}
div.infobox.fighter.Helix div.background {
    background-image: url(/wiki/images/1/1a/BG-Helix.png);
}

div.infobox.fighter div.image {
    text-align: center;
}

div.infobox.fighter table {
    margin-left: auto;
    margin-right: auto;
}

div.infobox.fighter table th,
div.infobox.fighter table td {
    vertical-align:top;
}

div.infobox.fighter table th {
    text-align: right;
    white-space: nowrap;
    padding: 1px 8px 1px 18px;
}

div.infobox.fighter table td {
    padding-right: 18px;
}

div.infobox.fighter div.arms ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

div.infobox.fighter div.arms ul li {
    padding: 0;
    margin: 0;
    flex: 1;
    width: 110px;
    text-align: center;
}
/* END fighter infobox */

/* BEGIN navbox */
div.navbox {
    clear: both;
}

div.navbox ul {
    list-style: none;
    margin: 0;
    padding: 0 20px;
    text-align: center;
}

div.navbox ul li {
    display: inline-block;
    vertical-align: top;
    white-space:nowrap;
}

div.navbox > ul > li::after {
    content: " · ";
}

div.navbox > ul > li:last-child::after {
    content: normal;
}
/* END navbox */

/* BEGIN ARMS navbox */
div.navbox.arms ul {
    text-align: left;
}

div.navbox.arms ul li {
    white-space: normal;
}

div.navbox.arms > ul {
    column-width: 600px;
}

div.navbox.arms > ul > li {
    display: flex;
}

div.navbox.arms > ul > li > b {
    flex: 1;
    max-width: 100px;
    white-space: nowrap;
}

div.navbox.arms > ul > li > ul {
    flex: 1;
    padding-left: 0;
}

div.navbox.arms ul li::after {
    content: normal;
}

div.navbox.arms > ul > li > ul > li::after {
    content: " · ";
}

div.navbox.arms > ul > li > ul > li:last-child::after {
    content: normal;
}

@media only screen and (max-width: 599px) {

    div.navbox.arms > ul > li {
        display: block;
        padding-bottom: 20px;
    }

}
/* END ARMS navbox */