MediaWiki:Gadget-Mobile.css

/* ========= */ /* Site Logo */ /* ========= */

/* Style and hide plaintext site name */ font-family: 'Coustard', sans-serif !important; font-weight: bold !important; color: transparent !important; }
 * 1) p-banner.mw-wiki-title {

/* Show banner logo in place of plaintext site name */ background-image: url("https://dodo.ac/np/images/1/1e/Nookipedia_Logo_Outlined.png") !important; background-size: 141px auto !important; background-repeat: no-repeat !important; background-position: center center !important; }
 * 1) p-logo-text {

/* Reposition banner logo on mobile */ @media (max-width: 832px) { #p-logo-text { position: absolute !important; top: 15px !important; left: 50px !important; } }

/* Use special ACNH-themed logo in place of standard logo on desktop */ .mw-wiki-logo { background-image: url("https://dodo.ac/np/images/6/68/Nookipedia_Leaf_%26_Text.png") !important; background-size: 160px auto !important; }

/* =========== */ /* Line colors */ /* =========== */

/* Top header line colors */ .color-left, .color-middle, .color-right { background: #67AD42 !important; }

/* Sidebar header line colors */ border-bottom: solid 2px #67AD42 !important; }
 * 1) mw-related-navigation .sidebar-chunk h3, #mw-site-navigation .sidebar-chunk h3, #personal .dropdown h3 {

/* Page title line color and thickness */ border-bottom: solid 2px #A2A9B1 !important; }
 * 1) firstHeading {

/* Set section header line color and thickness */ .mw-parser-output h2 { border-bottom: solid 2px #A2A9B1 !important; }

/* ========================= */ /* Header and footer styling */ /* ========================= */

/* Replace header icons with darker colors */ background-image: linear-gradient(transparent,transparent),url("data:image/png !important;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAQBAMAAADgw5IVAAAAD1BMVEUAAABbX2RbX2NbX2NbX2OLGrQ1AAAABHRSTlMAIN/AFho7GgAAACRJREFUCNdjoB5gVHFxcVGEcoRcXJwE4BIgYZgESBgmYUixpQA00gMfVagZRQAAAABJRU5ErkJggg==") !important; } background-image: linear-gradient(transparent,transparent),url("data:image/png !important;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAQBAMAAADgw5IVAAAAD1BMVEUAAABbX2RbX2NbX2NbX2OLGrQ1AAAABHRSTlMAIN/AFho7GgAAACRJREFUCNdjoB5gVHFxcVGEcoRcXJwE4BIgYZgESBgmYUixpQA00gMfVagZRQAAAABJRU5ErkJggg==") !important; } background-image: linear-gradient(transparent,transparent),url("data:image/png !important;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAQBAMAAADgw5IVAAAAD1BMVEUAAABbX2RbX2NbX2NbX2OLGrQ1AAAABHRSTlMAIN/AFho7GgAAACRJREFUCNdjoB5gVHFxcVGEcoRcXJwE4BIgYZgESBgmYUixpQA00gMfVagZRQAAAABJRU5ErkJggg==") !important; } @media (max-width: 850px) { #site-tools h2 { background-image: linear-gradient(transparent,transparent),url("data:image/png !important;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAMAAADzN3VRAAAAXVBMVEUAAABhZmtdYmdiZmxhZmthZWphZmthZWthZmthZmthZWphZmxhZmtiZmthZmthZmthZWphZmthZmthZmthZmthZmthZWphZWphZmthZmthZmthZmthZmtgZGlhZmtJnFivAAAAHnRSTlMA8wgh1Y+CBJm9VDWwpqJyUDHw7LZ4dz4QDdbNyx8sIU2mAAAAsUlEQVQoz42S6RaCIBCFR1lMUNFS2+/7P2ZMBHUwTn2/LlyW2egfhIQUXx0NQGd7zTgR1T2AviaaxiYZM+BUBaZSDpijZZAzUsAix9KLNazbXbcHs1BEPffvXp13LFU0av78VocFW1XQQg/wHClw4mOD5pQvYA4U6cBIr5BUeo7xShbulP9JsV23saV8xDYfclkNHBXrNhVrbWJ/WmBN/VmA9t06Yz96ak1TmIPi7PzmAWqXG7oXWSl+AAAAAElFTkSuQmCC") !important; } #user-tools h2 { background-image: linear-gradient(transparent,transparent),url("data:image/png !important;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAMAAADzN3VRAAAAXVBMVEUAAABhZmthZmthZmthZmthZmtma3BhZmthZWphZmtiZmthZWpiZmtjZ2xhZmtiZmthZmthZWphZmthZmthZmthZmthZWphZmthZmthZWphZmtgZGlgZGljZ21hZmsGLjoVAAAAHnRSTlMA9vDZu2QJxKCNc1ckD+R6a11A0KuFR8yzmIc1GhllS0aUAAAApklEQVQoz42R2RKDIAxFRRFQ3Jfuvf//mZ1kUArSjuclIechN0N2hlILocvjXEkwUsXGwGEi0WCnCc3gTbSq96YPjfXGhqbNN5G38TV+TcwgaC6GIPGdy6s2pn5zu7pzJeo46Mr1CeDxLSqK4RrgOm3zy0zvkdoZTFHZabJVAWYhI5CgIIMUOZnup1lSRnOYhHAX3hIBFJtWH8T+r6PsfPZOjir7xwdY8yCDX7vlSQAAAABJRU5ErkJggg==") !important; } #site-navigation h2 { background-image: linear-gradient(transparent,transparent),url("data:image/png !important;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZBAMAAAA2x5hQAAAAD1BMVEUAAABhZmthZWphZmthZmsIZbdzAAAABHRSTlMA9HL10YCgcQAAACpJREFUGNNjQAVMJi4wIMTAwOwCB44MDCwuCMDAwIgixySCpI94MNxtBwDDCin7XuQqZgAAAABJRU5ErkJggg==") !important; } }
 * 1) mw-site-navigation h2::after {
 * 1) mw-related-navigation h2::after {
 * 1) user-tools h2::after {

/* Disable Alert/Notice icons on mobile as they don't display properly */ @media (max-width: 1099px) { #personal-extra { display: none !important; } } /* Move site tools button further right on mobile */ @media (max-width: 832px) { #site-tools { width: 0 !important; position: absolute !important; top: 0 !important; left: 380px !important; } }

/* Search box styling */ color: black !important; }
 * 1) searchInput {

border: 1px #FFF !important; border-radius: 1px !important; background: #FFF !important; opacity: 0.8 !important; }
 * 1) simpleSearch {

.suggestions .suggestions-result-current { opacity: 0.8 !important; }

/* Fix search suggestions placement at small resolutions */ @media (max-width: 832px) { .suggestions { z-index: 100 !important; margin-top:50px !important; } }

/* Header background image and color */ background: url("https://dodo.ac/np/images/7/7d/Nookipedia_-_Spring_Sky_Background.jpg") no-repeat right #84d6fe !important; }
 * 1) mw-header-container {

/* Fancy header background for tablet mode */ @media screen and (min-width: 833px) and (max-width: 1082px) { #mw-header-container { background: url("https://dodo.ac/np/images/7/75/Nookipedia_-_Spring_Sky_Background.png") #84d6fe !important; background-attachment: fixed !important; } }

/* Category background color */ background : #FEF9E7 !important; }
 * 1) content-bottom-stuff {

/* Footer background image, color, and placement */ color: #001133 !important; background: #fafffe !important; background-image: url("https://dodo.ac/np/images/a/af/Fence_Backdrop.png") !important; background-size: 310px auto !important; border: none !important; box-shadow:none !important; margin-top: 2em !important; padding-top: 2em !important; overflow: hidden !important; } /* Footer (adaptation for mobile) */ @media (max-width: 832px) { #mw-footer-container { background-position: center top !important; background-repeat: repeat-x !important; }	/* Hide "Creative Commons" and "Powered by MediaWiki" icons */ #f-copyrightico, #f-poweredbyico { display: none !important; } }
 * 1) mw-footer-container {

/* Change footer text color from default white */ color: #000000 !important; }
 * 1) mw-footer-container a {

/* Remove border and box-shadow from Category section */ border: none !important; box-shadow: none !important; }
 * 1) catlinks {

/* =============== */ /* Content styling */ /* =============== */

/* Show mobile content even when desktop is set to mobile-sized resolution */ @media (max-width: 850px) { .onlymobile { display: block !important; } }

/* Border collapse to separate (Timeless sets this to collapse by default) */ table { border-collapse: separate !important; border-spacing: revert !important; }

/* Body background colors, borders and box-shadows */ body                  {background  : #fafffe !important;}
 * 1) mw-content, #mw-content-container, #content {background : #fafffe !important; border: none !important; box-shadow: none !important;}
 * 2) mw-header-nav-hack   {background  : url("https://dodo.ac/np/images/7/75/Nookipedia_-_Spring_Sky_Background.png") #84d6fe !important; background-attachment: fixed !important; border-top: none !important;}
 * 3) mw-site-navigation   {background: none !important; border: none !important; box-shadow: none !important;}
 * 4) siteSub              {display     :  none !important;}

/* Background color for code text box */ pre, .mw-code { background-color: #F8F9FA !important; }

/* Remove background, border and shadows for SiteNotice container */ .mw-dismissable-notice { background: none !important; border-style: none !important; box-shadow: none !important; }

/* Fonts for page and section headings */ .mw-body h1, .mw-body h2 { font-family: Coustard, Linux Libertine, Georgia, Times, serif !important; text-shadow: 0 1px #cdfef2 !important; color: #67AD42 !important; overflow: visible !important; }

/* Make infoboxes take up 100% width at small resolutions */ @media (max-width: 600px) { .infobox { width: 100% !important; } }

/* Set infoboxes to fixed width at larger resolutions */ @media (min-width: 601px) { .infobox { width: 320px !important; } }

/* Make notice boxes wider at small widths */ @media (max-width: 832px) { .noticebox { width: 96% !important; } }

/* Reduce padding around content at small widths */ @media (max-width: 1100px) { #mw-content { padding: .5em 1em 1.5em !important; } }

/* =============== */ /* Sidebar styling */ /* =============== */

/* Common */ background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; }
 * 1) personal .dropdown {

/* Desktop sidebars */ @media screen and (min-width: 1100px) { #mw-site-navigation .sidebar-chunk { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; }

#mw-related-navigation .sidebar-chunk { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; }

#site-tools .sidebar-chunk { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; }

#page-tools .sidebar-chunk { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; } }

/* Tablet and mobile sidebars */ @media screen and (max-width: 1082px) { #mw-related-navigation .sidebar-inner { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; }

#mw-site-navigation .sidebar-inner { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; width: 100px !important; }	#personal .sidebar-inner { background: #D1E6C6 !important; border: solid #67AD42 5px !important; border-radius: 14px !important; }	#personal, #personal-inner { width: 100px !important; }		} /* Tablet mode sidebar header text */ font-family: Coustard, Linux Libertine, Georgia, Times, serif !important; font-weight: 200 !important; color: #67AD42 !important; }
 * 1) site-navigation, #mw-site-navigation h2, #mw-related-navigation h2, #page-tools, #site-tools, #personal, #personal-inner {

/* Desktop 'Your Account' header text */ @media screen and (min-width: 833px) { #personal h2 { font-family: Coustard, Linux Libertine, Georgia, Times, serif !important; font-size: 1.2em !important; color: #424f57 !important; } }