MediaWiki:Mobile.css

From Kirby Speedrunning Wiki
Jump to navigationJump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* ----- Site-wide CSS ----- */
/* Search bar - moved it over cuz our wiki name is too long lol */
.minerva-header #searchInput {
  margin-left: 30px;
}

/* Makes it so all images on the wiki don't go past the screen borders */
img {
 max-width: 100%;
 height: auto;
}

/* MAIN PAGE STYLING */
body.page-Main_Page h1.firstHeading { display:none; }
body.page-Main_Page { background-color: #e6ffb4; }
body.page-Main_Page #content { background-color: pink; }


/*Links*/
.mainpage-links-container {
 text-align: center;
 width: 100%;
 line-height: 1.8;
 margin-top: 0px;
 display: flex;
 align-items: center;
 justify-content: space-around;
 padding: 0;
}

.mainpage-links-container ul {
 list-style: none;
 margin: 0;
 padding: 0;
 overflow: hidden;
}

.mainpage-links-container li {
 display: inline-block;
 width: 100%;
 vertical-align: middle;
 flex-direction: column-reverse;
}

.mainpage-links img {
 width: 35%;
 height: auto;
}

/* Top boxes on main page */

.header-boxes-container {
 width: 100%;
 background: none;
 line-height: 200%;
 text-align: center;
 font-size: 20px;
 padding-right: 25px;
}

.mainpage-header-boxes {
 padding: 6px;
 width: 100%;
 text-align: left;
}

.mainpage-left-box {
 border: 3px solid #e65c00;
 background: rgba(194, 166, 105, 0.42);
 margin-bottom: 20px;
}

.mainpage-right-box {
 border: 3px solid #009933;
 background: rgba(57, 144, 113, 0.42);
}

/* Do not show lists on game main pages */
.game-page-links-container ul {
 list-style: none;
}

/* for links that do not need an external link icon (example is links that link back to kirbyspeedrun.com/wiki) */
.no-external-link-icon a.external {
  background-image: none !important;
  padding-right: 0px !important;
}