MediaWiki:Common.css

From Im Okay With
Revision as of 22:55, 4 January 2019 by Imokaywith (talk | contribs)
Jump to: navigation, search

Note: After saving, 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: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will be applied to all skins */




body {background-color: #fff;font-family: arial,sans-serif;}
#mw-panel {display:none;}
.rootpage-Main_Page #mw-head {background-color: #fff;}
.rootpage-Main_Page #left-navigation {display:none;}
.rootpage-Main_Page #p-personal {display:none;}
.rootpage-Main_Page #p-views {display:none;}
.rootpage-Main_Page #p-cactions {display:none;}
.rootpage-Main_Page #content {display:none;}
.rootpage-Main_Page #right-navigation {padding: 0px 15px;}
.rootpage-Main_Page #supportthesite {display:none}

.rootpage-Main_Page #mw-head-base {display:none;}
.rootpage-Main_Page .imokaywithlogo {margin: 200px auto 0px;display: block;float:none;width:auto;padding:0px;max-width:373px;width:100%;}
.rootpage-Main_Page .imokaywithlogo1 {display:none;}
.imokaywithlogo {display:none;}
.vectorMenuCheckbox {display:none;}
div.vectorMenu div.menu {display:block;position:relative;box-shadow: none;top: 0px;border: none;}
div.vectorMenu li a {padding-top: 1.25em;height: 1.9em;padding-left: 15px;padding-right: 15px;color: #b4b4b4;cursor: pointer;font-size: 0.8em;}
div.vectorMenu li {float:left;line-height: 1.125em;height:100%;}
div.vectorMenu {height:2.5em;}
div.vectorMenu ul {height:100%;}
div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited, div.vectorTabs li.new a, div.vectorTabs li.new a:visited, div.vectorTabs li a {color:#b4b4b4;}
div.vectorTabs li a {padding-left:15px;padding-right:15px;padding-bottom:7px;border-bottom: 3px solid transparent;}
a:hover, a:focus {text-decoration: none;color: #3399ff !important;}
.mw-parser-output a.external, .mw-parser-output a.external:visited {color:#b4b4b4;background:none;padding-right:5px;}
h2.supportus {color: #808080;font-size: 20px;font-weight: normal;margin: 0;padding: 15px 16px 10px;border-bottom:1px solid #dfe1e5;}
#supportthesite {margin-left: 11em;max-width: 700px;border: 1px solid #dfe1e5;border-radius: 15px;overflow:hidden;display:none;}
.supporttext {padding: 1.25em 1.5em 1.5em 1.5em;border-bottom: 1px solid #dfe1e5;font-size: .875em;line-height: 1.25em;color: #6a6a6a;}
.supporticons {overflow: hidden;padding: .75em 1.5em .75em 1.5em;}
.supporticons .patreon {background: url('https://www.imokaywith.com/patreon-1.png');opacity:1;float:left;}
.supporticons .bitcoin {background: url('https://www.imokaywith.com/bitcoin-1.png');opacity:1;float:left;}
.supporticons .paypal {background: url('https://www.imokaywith.com/paypal-1.png');opacity:1;float:left;}
.supporticons .amazon {background: url('https://www.imokaywith.com/amazon-1.png');opacity:1;float:left;}
.mw-body {border:none;}
#mw-panel {display:none;}
#p-personal {display:none;}
div.vectorTabs {float:left;background:none;}
div.vectorTabs ul {background:none;}
div.vectorTabs ul > li {background:none;}
div.vectorTabs span {background:none;}
#left-navigation {float: left;width: 100%;margin: 0px 0px 20px 0;padding: 0 0 10px 0;border-bottom: 1px solid #ebebeb;}
#right-navigation {float: none;margin: 0px;overflow: hidden;width: auto;overflow:visible;}
.imokaywithlogo1 {margin: 30px 0px 0px;display: block;float:left;width: 130px;padding: 0px 30px;}
#mw-page-base {background:#ffffff !important;height:70px;}
#firstHeading {border:none;font-size: 22px;margin-bottom:25px;clear:both;}
.vectorTabs #ca-unwatch.icon a {background-image:none;padding-top: 1.25em;height: 1.9em;width:auto;padding-left: 15px;padding-right: 15px;color: #b4b4b4;cursor: pointer;font-size: 0.8em;}
.vectorTabs #ca-unwatch.icon a:hover, .vectorTabs #ca-unwatch.icon a:focus {background-image:none;}
#ca-view {display:none;}


/* HOMEPAGE SEARCH */
/* On screens that are 728px or less */
@media screen and (min-width: 728px) {
.rootpage-Main_Page #simpleSearch #searchButton {background-image: none;background-image: -moz-linear-gradient(top,#f5f5f5,#f1f1f1);;-moz-border-radius: 2px;-moz-user-select: none;background-color: #f2f2f2;border: 1px solid #f2f2f2;border-radius: 2px;color: #757575;cursor: pointer;font-family: arial,sans-serif;font-size: 13px;font-weight: bold;margin: 11px 4px;min-width: 54px;padding: 0 16px;text-align: center;position: absolute;top:70px;text-indent:0px;width:130px;height:40px;left:24%;}
.rootpage-Main_Page #simpleSearch #searchButton:hover {background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.1);background-color: #f8f8f8;background-image: linear-gradient(top,#f8f8f8,#f1f1f1);background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);border: 1px solid #c6c6c6;box-shadow: 0 1px 1px rgba(0,0,0,0.1);color: #222;}
}
.rootpage-Main_Page .randompage {background-image: -moz-linear-gradient(top,#f5f5f5,#f1f1f1);background-image: linear-gradient(top,#f5f5f5,#f1f1f1);-moz-border-radius: 2px;-moz-user-select: none;background-color: #f2f2f2;border: 1px solid #f2f2f2;border-radius: 2px;color: #757575;cursor: pointer;font-family: arial,sans-serif;font-size: 13px;font-weight: bold;margin: 11px 4px;min-width: 54px;padding: 0 16px;text-align: center;position: absolute;top:118px;text-indent:0px;width:130px;height:38px;right:22%;line-height: 38px;display:block;}
.rootpage-Main_Page .randompage:hover {background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.1);background-color: #f8f8f8;background-image: linear-gradient(top,#f8f8f8,#f1f1f1);background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);border: 1px solid #c6c6c6;box-shadow: 0 1px 1px rgba(0,0,0,0.1);color: #222;}
.rootpage-Main_Page .fulllink {position:absolute;left:0px;top:0px;height:100%;width:100%;}
.rootpage-Main_Page #simpleSearch #searchButton::after {content:"Search"}
.rootpage-Main_Page #p-search {float: none;margin: 0px auto;max-width: 585px;height: 44px;position:relative;}
.rootpage-Main_Page #simpleSearch {box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16),0 0 0 1px rgba(0,0,0,0.08);border: none !important;border-radius:2px;padding:5px 0px 0px;}
.rootpage-Main_Page #simpleSearch:hover {border:none !important;box-shadow: 0 3px 8px 0 rgba(0,0,0,0.2),0 0 0 1px rgba(0,0,0,0.08);}
.rootpage-Main_Page #p-search h3 {position: relative !important;width: auto;height: auto;font-size: .875em;font-weight: 300;color: #6a6a6a;text-align: center;margin-bottom: 30px;}
.rootpage-Main_Page #simpleSearch #searchInput {padding:.2em 16px;line-height:30px;}
.rootpage-Main_Page #supportarea {width:100%;}
.rootpage-Main_Page .patreon {margin-right:30px;}
.rootpage-Main_Page .bitcoin {margin-left:30px;float:left;}
.mw-body h1, .mw-body-content h1, .mw-body-content h2 {font-family:inherit;}
div.vectorTabs li.selected a {color:#3399ff !important;border-color: #3399ff;}




/* SEARCHED AREA */

.titlearea a {font-size: 18px;line-height: 1.2;display: block;color: #084999 !important;max-width:600px;overflow:hidden;}
.linkarea {display:block;max-width:600px;overflow:hidden;  text-overflow: ellipsis;white-space: nowrap;}
.linkarea a {color: #006621 !important;cursor:pointer;font-size: 14px;padding-top: 1px;white-space: nowrap;padding-right:5px;}
.datearea {color: #808080;}
.datearea::after {content:"-";padding:0px 5px;}
.bliparea {color: #545454;line-height: 1.4;word-wrap: break-word;margin-bottom: 26px;font-size:13px;max-width:600px;overflow:hidden;display:block;}

/* GENERAL SEARCH */
#simpleSearch #searchInput {font: 16px arial,sans-serif;line-height: 42px;padding: 0px 0px 0px 5px;}
.randompage {display:none;}
#simpleSearch {box-shadow:none;width: 100%;max-width: 558px;height: 42px;padding-left: 16px;padding-right: 8px;padding-top: 0px;margin: 0px;font-size: 13px;line-height: 39px;border:1px solid #dfe1e5 !important;border-radius:50px;}
#simpleSearch:hover {box-shadow: 0 1px 6px 0 rgba(32,33,36,0.28);border:1px solid rgba(223,225,229,0) !important;}
#p-search {float: none;max-width: 585px;height: 44px;position:relative;margin: 18px 7.5px 0px;float: left;width: 100%;}
#p-search form, #p-search input {margin:0;}
#simpleSearch #searchButton {background-image: url(/search.png);width: 55px;padding-right: 30px;}
#p-namespaces {padding-left: 12em;}

/* SUPPORT AREA */
#supportarea {position: absolute;top: 30px;right:0px;}
.preload {height:1px;width:1px;opacity:0;margin-left:-9999999px;position:absolute;}
.patreon {height:25px;width:26px;background: url('https://www.imokaywith.com/patreon.png');opacity:.15;position:relative;display: block;float:right;margin:0px 37.5px 0px 7.5px;}
.bitcoin {height:25px;width:18px;background: url('https://www.imokaywith.com/bitcoin.png');opacity:.15;position:relative;display: block;float:right;margin:0px 7.5px;}
.paypal {height:25px;width:25px;background: url('https://www.imokaywith.com/paypal.png');opacity:.15;position:relative;display: block;float:right;margin:0px 7.5px 0px 7.5px;}
.amazon {height:25px;width:23px;background: url('https://www.imokaywith.com/amazon.png');opacity:.15;position:relative;display: block;float:right;margin:0px 7.5px;}
.patreon:hover {background: url('https://www.imokaywith.com/patreon-1.png');opacity:1;}
.bitcoin:hover {background: url('https://www.imokaywith.com/bitcoin-1.png');opacity:1;}
.paypal:hover {background: url('https://www.imokaywith.com/paypal-1.png');opacity:1;}
.amazon:hover {background: url('https://www.imokaywith.com/amazon-1.png');opacity:1;}
.fullarea {position:absolute;height:100%;width:100%;top:0px;left:0px;right:0px;bottom:0px;}
body::after{position:absolute; width:0; height:0; overflow:hidden; z-index:-1;content:url(https://www.imokaywith.com/amazon-1.png) url(https://www.imokaywith.com/paypal-1.png) url(https://www.imokaywith.com/bitcoin-1.png) url(https://www.imokaywith.com/patreon-1.png) ;}
.helpus {float: right;display: block;padding-left: 30px;color: #222222;font-size:.875em;}
.rootpage-Main_Page .helpus {float: left;}



/* SEARCH RESULTS */
#mw-content-text #search {display:none;}
.searchresult {display:none;}
.searchresults {margin:0px;}
.mw-search-exists {position: absolute;bottom: 0px;color: #b4b4b4;font-weight:300 !important;}
.mw-search-createlink {position: absolute;bottom: 60px;color: #b4b4b4;font-weight:300 !important;}
a.new, #p-personal a.new {color: #3399ff;}
.mw-search-result-data {display:none;}
.searchresults h2 {display:none;}
#mw-indicator-mw-helplink a {display:none;}
.mw-search-results li {padding-bottom:7px;margin-bottom:0px;}
.mw-search-results li a {font-size:14px;color:#222222;font-weight:600;line-height:22.4px;}
.mw-search-results li a::before {content:"- "}
.mw-body-content {position:inherit;}
.mw-body .mw-indicators {position:inherit;}


/* footer stuff */
#footer {position: fixed;bottom: 0px;width: 100%;margin: 0px;background: #f2f2f2;border-top: 1px solid #e4e4e4;padding: 10px 0px;}
#footer a {color:#555;}
#footer-info {display:none;}
#footer-icons {display:none;}
#footer-places-disclaimer {display:none;}
#footer #footer-places li#footer-places-privacy {float:right;padding-right:30px;}
#footer #footer-places li#footer-places-about {float:left;padding-left:30px;}
#footer #footer-places li#footer-places-about a {font-size:0px;}
#footer #footer-places li#footer-places-about a::before {content:"About";font-size: 11px;}



/* On screens that are 800px or less */
@media screen and (max-width: 800px) {
    body {overflow-x:hidden;width:100%;background-color:#f9f9f9;}
    .rootpage-Main_Page {background-color:#ffffff;}
    .patreon {margin-right:10px;}
    .rootpage-Main_Page .imokaywithlogo {max-width:200px;}
    .rootpage-Main_Page .imokaywithlogo {margin-top:125px;}
    .rootpage-Main_Page .randompage {display:none !important;}
    .rootpage-Main_Page #simpleSearch {box-shadow: none;border: 1px solid #dfe1e5 !important;border-radius: 50px;}
    #footer {padding:0px;}
    #footer #footer-places li#footer-places-privacy {padding-right:5px;}
    #footer #footer-places li#footer-places-about {padding-left:15px;}
    .rootpage-Main_Page .patreon {margin-right:12.5px;}
    .rootpage-Main_Page .bitcoin {margin-left:15px;float:left;}
    #supportarea {top:15px;width:100%;}
    .mw-body {margin-left:0px;float:left;}
    .imokaywithlogo1 {margin: 17.5px auto 0px;padding: 0px 10px;float: none;position: relative;}
    #simpleSearch {padding:5px 0px 0px;height:35px;}
    #p-search {height:35px;margin:15px 0px 0px;}
    #right-navigation {margin:0px 10px;}
    #mw-page-base {height: 110px;}
    #supportthesite {margin-left:0px;}
    .mw-body h1, .mw-body-content h1 {font-size: 1em;font-weight:600;}
    .mw-body-content {font-size: 0.775em;}
    #content {box-shadow: 0 1px 6px 0 rgba(32,33,36,0.28);border: 1px solid rgba(223,225,229,0) !important;margin: 10px;border-radius: 7.5px;}
    h2.supportus {font-size:16px;}
    .supporttext {font-size: .775em;}
    #left-navigation {margin: 0px;}
    #supportthesite {margin:0px 10px}
    #p-namespaces {padding-left:0px;flex: 0 0 auto;}
    #p-views {flex: 0 0 auto;}
    #p-cactions {flex: 0 0 auto;}
    #mw-head-base {height:60px;}
    div.vectorTabs li a {padding-bottom:3px;border-bottom:2px solid transparent;}
    #left-navigation {display: flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling: touch;-ms-overflow-style: -ms-autohiding-scrollbar;padding-bottom:6px;background-color:#ffffff;}
    #left-navigation::-webkit-scrollbar {display: none;}
      .bitcoin {float:left;margin: 0px 10px;}
      .titlearea a {font-size: 12px;line-height: 1.2;display: block;color: #084999 !important;max-width:inherit;overflow:hidden;}
.linkarea {display:block;max-width:inherit;overflow:hidden;  text-overflow: ellipsis;white-space: nowrap;border-bottom:1px solid #d4d4d4;padding:0px 0px 10px 0px;margin-bottom:10px;}
.linkarea a {color: #006621 !important;cursor:pointer;font-size: 9px;padding-top: 1px;white-space: nowrap;padding-right:5px;}
.datearea::after {content:"-";padding:0px 5px;}
.bliparea {color: #545454;line-height: 1.4;word-wrap: break-word;margin-bottom: 26px;font-size:9px;max-width:inherit;overflow:hidden;display:block;}
  }