MediaWiki:Handheld.css

/* CSS placed here will affect handheld devices based on the skin configured in $wgHandheldStyle */

/* ============================      Font Styling ============================ */

@font-face { font-family: 'RiskofRainSquare' !important; font-style: normal !important; font-weight: normal !important; src:	url('https://images.wikia.nocookie.net/__cb20140629035051/risk-of-rain/images/8/84/RiskofRainSquare.eot') format('embedded-opentype'), local("RiskofRainSquare"), url('https://images.wikia.nocookie.net/__cb20140629035051/risk-of-rain/images/4/45/RiskofRainSquare.woff') format('woff'), url('https://images.wikia.nocookie.net/__cb20140629035051/risk-of-rain/images/e/e3/RiskofRainSquare.ttf') format('ttf') !important; }

@font-face { font-family: 'RiskofRainFont' !important; font-style: normal !important; font-weight: normal !important; src:	url('https://images.wikia.nocookie.net/__cb20140706042457/risk-of-rain/images/4/4a/RiskofRainFont.eot') format('embedded-opentype'), local("RiskofRainFont"), url('https://images.wikia.nocookie.net/__cb20140706042457/risk-of-rain/images/7/70/RiskofRainFont.woff') format('woff'), url('https://images.wikia.nocookie.net/__cb20140706042458/risk-of-rain/images/d/dd/RiskofRainFont.ttf') format('ttf') !important; }

/** * ============================== *     MediaWiki:Handheld.css * ============================== */

/** * -- Information -- * This page is used to style the Wikiamobile skin for all users. * In default MediaWiki this page is imported, but this is not supported by Wikia at this time. * Until it is imported MediaWiki:Wikiamobile-menu imports this page. * * This page is minified and stripped of comments with ResourceLoader so comment code as normal. */

/** * -- Instructions -- * MediaWiki:Common.css is not imported into Wikiamobile. Under no circumstances import it into Wikiamobile. * This is to pageload to a minimum as mobile devices usually have less stable connections and less processing power. * * Inline CSS has no effect on Wikiamobile, therefore any changes to a page need to be made here. * Try to keep styling here to a minimum and only if absolutely necessary. */

/** * General hide class to be used as necessary * Try to use this where possible. */ .mobile-hide { display: none; }

/* ============================      Mobile Site CSS ============================ */

body > section { background-color: #111018 !important; color: #D5D4D4 !important; }

/* ============================      End Mobile Site CSS ============================ */

/* ============================      Mobile Switch Infobox ============================ */

.mobile-switchInfobox > input { display:none; }

.mobile-switchInfobox > label { color: black; -webkit-appearance: push-button; -moz-appearance: button; display: inline-block; cursor: pointer; padding:3px; margin:0 2px; }

input.MobileSwitchInfobox1[type=radio]:checked ~ .item1 { display: block; }

input.MobileSwitchInfobox1[type=radio]:checked ~ .item2, .item3, .item4, .item5 { display: none; }

input.MobileSwitchInfobox2[type=radio]:checked ~ .item2 { display: block; }

input.MobileSwitchInfobox2[type=radio]:checked ~ .item1, .item3, .item4, .item5 { display: none; }

input.MobileSwitchInfobox3[type=radio]:checked ~ .item3 { display: block; }

input.MobileSwitchInfobox3[type=radio]:checked ~ .item1, .item2, .item3, .item5 { display: none; }

input.MobileSwitchInfobox4[type=radio]:checked ~ .item4 { display: block; }

input.MobileSwitchInfobox4[type=radio]:checked ~ .item1, .item2, .item3, .item5 { display: none; }

input.MobileSwitchInfobox5[type=radio]:checked ~ .item5 { display: block; }

input.MobileSwitchInfobox5[type=radio]:checked ~ .item1, .item2, .item3, .item4 { display: none; } /* ============================      Mobile Welcome Message Main Page Formatting ============================ */

body.page-Main_Page > section > header { display: none; }

.mobile-mainPageWelcome { color: white !important; border: 2px solid #373842 !important; background-color: #484B66 !important; margin: 0px auto; }

.mobile-mainPageWelcomeBottom { width: 33%; background-color: #2E2C32 !important; }

/* ============================      Mobile Character Select Module Formatting ============================ */

.mobile-characterSelectModule { background-color: #1E1111 !important; padding: 15px !important; max-width: 375px !important; margin: 0 auto; }

.mobile-characterSelectModule > figure { display: inline-block !important; margin: 10px 0px; }

.mobile-characterSelectModule > figure > figcaption { display: none; }

.mobile-characterSelectModule > figure > a > img { margin: -32.5px 0px; }

.mobile-characterSelectModuleHeader { color: #EFD27B !important; }

/* ============================      Mobile Item Table Formatting ============================ */

.mobile-itemTable { margin: 0px auto; width:100% !important; }

.mobile-itemTable > tbody > tr > td { padding: 0px; }

.mobile-itemTable > tbody > tr > td > figure { margin: 0px; }

.mobile-itemTable > tbody > tr > td > figure > a > img { width:99px !important; height:99px; max-width:99px; }

.mobile-itemTableNameSpacing { width:100% !important; }

.mobile-itemTableNameSpacing > b > a { white-space: normal !important; padding: 5px; }

.bigTable { display:table !important; width:100% !important; }

/* ============================      Mobile Site Text Formatting ============================ */

.mobile-rorFont { font-family: 'RiskofRainFont'; }

.mobile-rorSqFont { font-family: 'RiskofRainSquare'; }

.mobile-textCenter { text-align: center; }

.mobile-textRight { text-align: right; }

.mobile-textLeft { text-align: left; }

/* */