MediaWiki:Monobook.css

From MEpedia, a crowd-sourced encyclopedia of ME and CFS science and history

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.
/* CSS placed here will affect users of the MonoBook skin */

#column-one { 
padding-top: 600px; 
}

/* Common.css code which is no longer used on all skins, some may not be needed here Jun 2023 MW1.39 changes  */

#p-logo { 
	height: 225px; 
}
#p-logo a,  #p-logo a:hover { 
	height: 225px; 
}

@media screen and (max-width: 768px) {
   .mw-wiki-logo {
      display: block!important;
      left: 0!important;
      top: 0!important;
      position: relative !important;
      background-size: contain!important;
      background-image: url("https://me-pedia.org/w/resources/assets/mepedia_logo_mobile.png");
      width: 55px!important;
      margin: 0;
      overflow: visible;
}
   #p-logo {
     display: block!important; 
/*   position: absolute!important;  */
     left: 5px!important; 
/*   top: -85px!important;  */
     width: auto;
     height: auto;
     background-size: contain!important;
    }
    #mw-panel #p-logo {
        position: initial!important;
        margin: 1em 0.6em 0 0.7em;
    }
    #mw-panel #p-logo a {
        height: 45px;
    }
    #searchtable form.searchbox {
        display: flex;
        flex-wrap: wrap;
    }
    #searchtable form.searchbox .searchboxInput.mw-ui-input {
        width: 70%;
        display: block;
        flex-grow: 9;
        margin: 5px 5px 5px 0;
    }
    #searchtable form.searchbox .mw-ui-button {
        display: block;
        margin: 5px auto;
        max-width: 90px;
        flex-grow: 1;
        margin-right: auto;
    }
    /* Mobiles and tablets - smaller category banner */
  h1 {
   font-size: 1.4rem;
   margin-top: 4px;
   margin-bottom: 4px;
   }

  h1 div, .firstHeading {
   font-size: 1.25rem;
   padding: 2px!important;
   margin-left:0;
   margin-right: 0;
   }

/* Not sure what these settings are for */
/* left menu (main navigation) */
  #p-navigation {
	position: relative !important;
	top: 0 !important;
    }
  #p-tb {
	position: relative !important;
	top: 10px !important;
   }
}
@media screen and (max-width: 720px) {
    body {
        font-size: 18px;
    }
    #mw-panel #p-logo {
        position: absolute!important;
        margin: 0;
        top: 5px!important;
        left: 2px!important;
    }
    .sitedir-ltr .mw-dismissable-notice-body {
        margin: 0 3em 0 0;
    }
    .sitedir-rtl .mw-dismissable-notice-body {
        margin: 0 0 0 3em;
    }
    #addthistoolbar {
        float: initial;
    }
    #addthistoolbar .addthis_separator {
        height: 32px;
    }
    #addthistoolbar .at300m {
        display: flex;
        flex-direction: row;
        align-items: center;
        font-size: 16px;
    }
    #addthistoolbar .at300b span,
    #addthistoolbar .at300m span,
    #addthissidebar .at300b span,
    #addthissidebar .at300m span {
        width: 32px !important;
        height: 32px !important;
        line-height: 32px !important;
    }
    #addthistoolbar .at300b span svg,
    #addthistoolbar .at300m span svg,
    #addthissidebar .at300b span svg,
    #addthissidebar .at300m span svg{
        width: 32px !important;
        height: 32px !important;
    }
    div#mw-panel div.portal div.body ul li {
        font-size: 18px;
    }
    div#footer ul li {
        font-size: 16px;
    }
    .apihelp-block.apihelp-flags {
        width: 100%;
        float: none;
        box-sizing: border-box;
    }
    .apihelp-parameters dt {
        float: none;
    }
    .apihelp-parameters dd {
        margin: 0 0 0.5em 0;
    }
    .apihelp-parameters dd.info {
        margin-left: 2em;
    }
    .apihelp-block > * {
        word-break: break-all;
    }
}

@media screen and (max-width: 400px) {
    #searchtable form.searchbox .searchboxInput.mw-ui-input {
        width: 100%;
        margin: 5px 0;
    }
}