MediaWiki:Mobile.css

/* CSS placed here will affect users of the mobile site */ /* Header and footer */ .header-container.header-chrome, background: #212121; }
 * 1) mw-mf-page-center {

/************************************************************/ /* Layout                                                  */ /************************************************************/

html { font-size: 62.5%; }

body { font-size: 1.6rem; }

body, background: #000000; color: #FFF; }
 * 1) content,
 * 2) footer {

.mw-mf-special #footer, .page-Main_Page #footer { margin-top: 0; border-top: none; }

.header { border-top: 1px solid #505050; }
 * 1) content,

border-bottom: 1px solid #505050; }
 * 1) content .section-heading {

textarea#wikitext-editor { color: #FFF; }

/* Fixes Search Bar */ .header, .header input#searchInput { background: #1a1a1a !important; } .header input#searchInput[placeholder] { color: #FFF; }

/* Fixes Overlay Search Bar */ .overlay-header, .overlay-header input.search, .overlay-content, .overlay-content .results { background: #1a1a1a !important; }

.overlay-header input.search, li.page-summary.with-watchstar a h3 { color: #FFF; }

.overlay .overlay-header-container, .overlay-content li.page-summary, .overlay-content .search-content.overlay-header { border-bottom: 1px solid #505050; }

.overlay.search-overlay, .overlay .overlay-header-container { background: #1a1a1a; }

/* Fixes text for editor */ div.overlay.editor-overlay.visible { background: #1a1a1a; }

/* Fixes text for summary */ textarea.mw-ui-input.summary { color: #FFF; }

/* Fixes Highlight Background of CSS */ div.mw-highlight { background: #0d0d0d; }

/* Fixes background for Special:Tags page inputs */ input#mw-input-wpTag, input#mw-input-wpReason { background: #FFF; }

/* Fixes Last Modified at Bottom of Page */ padding-left: 0.5rem; background: #1a1a1a !important; }
 * 1) mw-mf-last-modified {

/* Fixes the white spots in the viewport areas */ .mediawiki #mw-mf-page-center { background: #000; }

/* Discussion Button */ .mw-ui-button { border: 1px solid #505050; background: #1a1a1a; color: #666666; }

/* Alters colors of +/- Bytes Indicators in Recent Changes */ .mw-plusminus-pos { color: #006500; } .mw-plusminus-neg { color: #8B0000; }

/************************************************************/ /* Image Fixes                                             */ /************************************************************/

.content .thumbborder, div.tright, div.tleft { border: 1px solid #505050; }

div.iteminfo div.thumb, img.thumbimage { border: none; }

div.thumbcaption { display: none; }

/************************************************************/ /* Fixes                                                   */ /************************************************************/

.nomobile { display: none; }

code { font-family: Courier; border: 1px solid #505050; }

/* Edits to Table of Contents */ .client-js .toc-mobile { background-color: rgba(0, 0, 0, 0) !important; border: 1px solid #505050 !important; }

/* Links */ a, a:visited, a.external { color: #5a93cc; }

/************************************************************/ /* Tables                                                  */ /************************************************************/

/******************************/ /* No Class Tables           */ /******************************/

.content table th { background-color: rgba(0, 0, 0, 0); }

.content table td, .content table th { border: 1px solid #505050; padding: 3px; }

.content table.wikitable { background-color: rgba(0, 0, 0, 0); margin: auto; margin-bottom: 1em; }

/******************************/ /* Wikitable                 */ /******************************/

.content table.wikitable > tr > th, .content table.wikitable > tr > td, .content table.wikitable > * > tr > th, .content table.wikitable > * > tr > td { border: 1px solid #505050; }

.content table.wikitable > tr > th, .content table.wikitable > * > tr > th { background-color: rgba(0, 0, 0, 0); padding: 3px; }

/******************************/ /* Article-Table             */ /******************************/

table.article-table { color: #ccc; border-collapse: collapse; }

table.article-table > * > tr { border-bottom: 1px solid #3d3d3f; }

table.article-table > * > tr > th { background: #000000; }

table.article-table > * > tr > td , table.article-table > * > tr > th { padding: 0.2rem; }

table.article-table > * > tr:nth-of-type(odd), table.article-table.sortable tr:nth-of-type(even) { background: #000000; }

table.article-table.sortable > * > tr:nth-of-type(odd) { background: #08080a; }

/******************************/ /* Quest Table               */ /******************************/ /*  qltable = Quest Log Table    */ /* qrtable = Quest Reward Table */ table.qltable { border-collapse: collapse; } table.qltable th { border: 1px solid rgb(66,66,66); background: rgb(55,70,94); padding: 0.7rem; } table.qltable td { border: 1px solid rgb(66,66,66); background: rgb(20,20,22); padding: 1rem; }

table.qrtable { border-collapse: collapse; }

table.qrtable th { background: rgb(11,11,13); padding: 0.3rem; } table.qrtable td { background: rgb(20,20,22); padding: 0.3rem; }

/******************************/ /* Quest Infobox             */ /******************************/

table.quest-infobox { border: none; font-size: 1.4rem; border-collapse: collapse; }

table.quest-infobox .quest-infobox-header { background: rgb(55,70,84); font-size: 1.6rem; padding: 1rem; text-align: center; }

table.quest-infobox .quest-infobox-info { background: rgb(55,70,84); padding: 0.1rem; text-align: center; }

table.quest-infobox > * > tr > td { padding: 0.5rem; border: 1px solid #262626; }

/******************************/ /* Skill Infobox             */ /******************************/

.skill-infobox { border-collapse: collapse; }

.skill-infobox .skill-infobox-header { background: rgb(10,10,8); padding: 0.7rem; text-align: center; border: 1px solid #3d3d3f; }

.skill-infobox .skill-infobox-col1, .skill-infobox .skill-infobox-col2 { width: 50%; padding: 0.8rem 0.3rem; border: 1px solid #3d3d3f; } .skill-infobox .skill-infobox-col1 { background: rgb(20,20,22); }

.skill-infobox .skill-infobox-col2 { background: rgb(10,10,8); }

/******************************/ /* Skill Progress Table      */ /******************************/

table.skill-prog { border-collapse: collapse; }

table.skill-prog caption { color: #A88054; font-weight: bold; }

table.skill-prog th { background: #08080a; color: #999; border: none; }

table.skill-prog td { background: #08080a; color: #A88054; padding: 0.5rem; border: none; }

table.skill-prog tr { border: 1px solid #3d3d3f; }

/******************************/ /* Patch Notes Table         */ /******************************/ table.patch1 { border-collapse: collapse; }

table.patch1 th { font-size: 1.6rem; background: #202530; } table.patch2 { border-collapse: collapse; margin: 0; } table.patch2 th { width: 30rem; background: #2d3445; padding: 0.1rem 0 0.1rem 0.3rem; font-size: 1.5rem; } table.patch2 td { border-bottom: 0.1rem solid #2d3445; padding-left: 1rem; font-size: 1.3rem; background: #202530; }

/******************************/ /* Infobox                   */ /******************************/ .content table.infobox { background-color: rgb(20,20,22); color: #ccc; border: 1px solid #3d3d3f; }

.content table.infobox tr:last-child th, .content table.infobox tr:last-child td, .content table.infobox > * > tr > th, .content table.infobox > * > tr > td { padding-left: 0.5rem; vertical-align: top; border: 1px solid #3d3d3f; }

.content table.infobox > * > tr > th { background-color: rgba(55, 70, 84, 0.4); text-align: center; padding: 5rem; }

.content table.infobox > * > tr { border: none; }

/******************************/ /* Craft Table               */ /******************************/

table.craft-table { border-collapse: collapse; margin: 1rem 1rem 1rem 0; width: 40%; }

table.craft-table > * > tr:nth-of-type(even), table.craft-table > * > tr.craft-table-craft { background: #08080a; }

table.craft-table > * > tr > th, table.craft-table > * > tr > td { padding: 0.5rem 1rem; }

table.craft-table > * > tr > th, table.craft-table > * > tr:nth-of-type(odd) { background: #000000; }

table.craft-table > * > tr > td.craft-table-col1 { width: 20%; height: 4rem; text-align: center; }

table.craft-table > * > tr.craft-table-craft { background: #08080a; }

/******************************/ /* Nav                       */ /******************************/

table.nav-table .nav-table-header { background:rgb(84,69,55); }

table.nav-table td { background: #0d0d0d; padding: 0.7rem; }

/************************************************************/ /* Main Page                                               */ /************************************************************/

.mpbox { width: 100%; border: 1px solid rgb(66,66,66); border-radius: 0.4rem; margin-bottom: 0.6rem; padding: 0.25rem 0.25rem 0.25rem 0.5rem; }

/************************************************************/ /* Item Template                                           */ /************************************************************/ .iteminfo { line-height: 1.9rem; border: solid rgba(8,8,10,1); border-width: 0.1rem; border-radius: 0.7rem; padding: 1rem; background: rgba(11,11,13,0.7); }

.item-name { font-weight: bold; white-space: nowrap; font-size: 1.7rem; }

.iteminfo .thumb.tright { float: right; }

/************************************************************/ /* Tooltip                                                 */ /************************************************************/

.tooltip { display:inline-block; }

/* hide tooltip */ .tooltip .tooltipin { display: none; }

/* show and style tooltip */ .tooltip:hover .tooltipin { display: block; position: absolute; padding: 0.6rem; color: #FFF; background: rgba(15,15,15,0.93); border: 0.1rem solid rgba(80,80,80,0.9); border-radius: 0.5rem; min-width: 0rem; max-width: 50rem; z-index:1; }

/************************************************************/ /* Skill Tooltip                                           */ /************************************************************/

.sktt { display: inline-block; } .sktt .sktt-header { color: rgb(57,170,206); font-size: 1.6rem; }

.sktt .tooltipin hr { display: none; }

.sktt .tooltipin > table { background: none; line-height: 1.8rem; }

.sktt .tooltipin > table > * > tr > th { font-size: 1.2rem; padding: 0 1.2rem 0 0.7rem; color: #999; }

.sktt .tooltipin > table > * > tr > td { color: #A88054; font-size: 1.2rem; }

/************************************************************/ /* Text Colors                                             */ /************************************************************/

/* In-Game Colors */

.text-blue {color: rgb(57,170,206);}

.text-green {color: rgb(16,234,93);}

.text-red {color: rgb(255,66,0);}

.text-white {color: rgb(255,255,255);}

.text-yellow {color: rgb(255,245,43);}

.text-purple {color: rgb(242,148,198);}

.text-orange {color: rgb(242,163,77);}

.text-silver {color: rgb(153,153,153);}

.text-fushia {color: rgb(255,105,180);}

.text-cyan { color: rgb(0,255,255);}

.text-indigo {color: rgb(166,56,255);}

.text-aqua {color: rgb(126,255,212);}

.text-maroon {color: rgb(126,0,0);}

.text-khaki {color: rgb(240,230,140);}

.text-dark-gray, .text-dark-grey {color: rgb(26,26,26);}

.text-teal {color: rgb(0,255,209);}

.text-olive { color: rgb(145,203,0);}

.text-brown {color: rgb(168,128,84);}

.text-light-gold {color: rgb(222,194,163);}

.text-tan {color: rgb(158,133,91);}

/************************************************************/ /* Stylized Paragraph Blocks                               */ /************************************************************/

div.note-text, p.flavor-text { background: rgb(20,20,22); border: 0.1rem solid rgb(66, 66, 66); padding: 0.5rem; color: rgb(153, 153, 153); /* should match .text-silver */ } p.flavor-text { border-radius: 1rem 0; } div.note-text { border-radius: 1rem; text-align: justify; }

/************************************************************/ /* Dialogue Template                                       */ /************************************************************/

/* Dialogue tree styles */ .dialogue-section { background-color: rgba(0, 0, 0, 0.7); padding: 0.7em; border: 2px solid #808080; width: 95%; min-width: 240px; position: relative; }

.dialogue-section:target { background-image: linear-gradient(to right, hsla(0, 0%, 40%, 0.7) 0%, hsla(0, 0%, 40%, 0) 32px); }

.dialogue-section ~ .dialogue-section { margin-top: -2px; }

.dialogue-section .dialogue-npc-name { color: #f7e533; margin-left: 2em; font-weight: bold; }

.dialogue-section .dialogue-text { color: #efefef; }

.dialogue-section .dialogue-continue { color: #e0e0e0; font-style: italic; }

.dialogue-section .dialogue-continue-text { vertical-align: middle; }

.dialogue-section .dialogue-continue-option-text { color: #f7e176; }

.dialogue-section .dialogue-continue-option-wrap, .dialogue-section .dialogue-option-wrap { display: inline-flex; align-items: center; vertical-align: middle; }

.dialogue-section .dialogue-continue .dialogue-icon { margin-left: 0.5em; }

.dialogue-section .dialogue-continue .dialogue-continue-option-text { margin-left: 0.3em; margin-right: 0.5em; font-style: normal; }

.dialogue-section .dialogue-option-list { list-style-type: none; margin-left: 0.3em; margin-top: 0.6em; }

.dialogue-section .dialogue-icon { display: inline-block; width: 26px; height: 26px; flex-shrink: 0; }

.dialogue-section .dialogue-icon-more { background-image: url(https://static.wikia.nocookie.net/grimdawn_gamepedia_en/images/a/aa/Dialogue_icon_more.png/revision/latest?cb=20190622193935) }

.dialogue-section .dialogue-icon-accept-quest { background-image: url(https://static.wikia.nocookie.net/grimdawn_gamepedia_en/images/a/a8/Dialogue_icon_accept_quest.png/revision/latest?cb=20190622192806) }

.dialogue-section .dialogue-icon-decline-quest { background-image: url(https://static.wikia.nocookie.net/grimdawn_gamepedia_en/images/d/df/Dialogue_icon_decline_quest.png/revision/latest?cb=20190622193135) }

.dialogue-section .dialogue-icon-end { background-image: url(https://static.wikia.nocookie.net/grimdawn_gamepedia_en/images/9/9c/Dialogue_icon_end.png/revision/latest?cb=20190622220816) }

.dialogue-section .dialogue-option-text { margin-left: 0.3em; color: #f7e176; vertical-align: middle; }

.dialogue-section .dialogue-option-description { display: block; font-size: 90%; margin-left: calc(24px + 1.2em); margin-top: -0.3em; }

.dialogue-back-to-top { position: absolute; top: 0.7em; right: 0.7em; background-color: hsla(0, 0%, 50%, 0.5); background-image: url("data:image/svg+xml,%3csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2296%22 height=%2296%22%3e%3cpath d=%22M24 72 L48 56 L72 72 L48 24 L24 72%22 fill=%22%23ffffff%22/%3e%3c/svg%3e"); background-size: 24px 24px; width: 24px; height: 24px; border-radius: 12px; }

.dialogue-back-to-top a { width: 24px; height: 24px; border-radius: 12px; display: block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }