MediaWiki:Common.css

From Wikimedia Australia
Revision as of 21:45, 15 May 2017 by MichaelBillington (talk | contribs) (Address mixed content, formatting, search box issues. All this formatting is now wrapped in the @media query so that desktop users have a default-y experience)
Jump to navigation Jump to 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 affect users of the Vector skin */


/* For mobile devices */

@media screen and (max-width:749px) {
    /*
    The styles below essentially place the navigation menu below the content,
    instead of to the side of it. They also hide the logo, as there's no space
    left for it.
  */
    #mw-head {
        position: static !important;
        margin-top: 0.5em;
    }
    /* Move the panel to the bottom and display it as in-line lists; hide the logo and tabs */
    div#mw-panel {
        display: table;
        position: static;
        table-layout: fixed;
        width: 100%;
        overflow: hidden;
    }
    div#mw-panel .portal {
        display: block;
        width: 100%;
        vertical-align: top;
    }
    #mw-panel ul li {
        list-style: none;
    }
    #mw-panel ul li:before {
        content: "	◦	";
    }
    #p-logo {
        display: none;
    }
    #left-navigation {
        display: none;
    }
    #p-cactions {
        display: none;
    }
    #p-views {
        display: none;
    }
    /* Rearrange various page elements to fill the now-available space */
    #p-personal ul {
        padding-left: 0;
    }
    div#footer {
        margin-left: 0;
        padding-top: 0;
    }
    #p-personal {
        display: table;
        position: relative;
        width: 100%;
        top: inherit;
        left: inherit;
        right: inherit;
    }
    #right-navigation {
        max-width: 500px;
        position: absolute;
        top: inherit;
        margin-top: -1px;
        float: none;
    }
    #right-navigation:before {
        content: url("https://wikimedia.org.au/w/images/b/bb/Mobile_Logo.png");
    }
    #p-search {
        display: none;
    }
    div#content {
        /* Hide the 1px blue border on the left side */
        border-left: 0;
        margin-left: 0;
    }
    /* Adjusted Vector Appearance */
    body {
        background-color: #fcfcfc;
    }
    #mw-page-base {
        background-color: #fcfcfc;
        background-image: none;
    }
    div#content {
        border: 1px solid #fff;
    }
    div.vectorTabs ul li {
        background-image: none;
        background-color: #fff;
    }
    #p-views, #p-views *, #p-namespaces, #p-namespaces * {
        background-image: none;
    }
    div.vectorTabs ul li.selected {
        font-weight: bold;
    }
    div.vectorTabs ul li span a:hover {
        text-decoration: none;
    }
    #catlinks {
        border: none;
        padding: 10px;
    }
    .vectorTabs ul li {
        background-color: #fcfcfc !important;
    }
    #toc {
        border: none;
        padding: 14px;
    }
    
}