MediaWiki: Common.css

(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)
(rm title-hiding, now done on those pages)
 
(17 intermediate revisions by 3 users not shown)
Line 1: Line 1:
/* CSS placed here will affect users of the Vector skin */
.nav th {
  text-align: center;
  background: #ECECEC;
  font-weight: bold;
  margin: 0 .1em 0 0;
  width: 25%;
  font-size: 0.925em;
  -moz-border-radius: 12px 12px 12px 12px;
}


.nav th a {
  padding: 1em 2em;
  color: #224F82;
  text-decoration: none;
}


/* For mobile devices */
.nav th:hover {
  color: #000;
}
 
li#footer-info-lastmod,
li#footer-info-viewcount,
li#footer-places-about,
li#footer-places-disclaimer {
  display: none !important;
}
 
div#mw-panel div.portal#p-navigation div.body {
  background-image:none;
}
 
#p-navigation h5 {
  display: none !important;
}
 
.nowrap {
    white-space: nowrap;
}
 
.toggle-head {
  background:url(//upload.wikimedia.org/wikipedia/commons/thumb/1/1c/HW_open_arrow.svg/10px-HW_open_arrow.svg.png) no-repeat 0% center;
}
 
.toggle-head:hover {
  text-decoration:underline;
  cursor:pointer;
}
 
.redirect-in-category, .allpagesredirect a {
  color: gray;
}
 
.nodisplay {
  display: none !important;
}
 
/* Custom table formatting */
 
table.rowlines {
    border-collapse:collapse;
    border:2px solid #BBBDBF;
    width:100%;
    vertical-align:top;
}
 
table.rowlines th {
    border-bottom:1px solid #BBBDBF;
    border-top:1px solid #BBBDBF;
    padding:5px;
}
 
table.rowlines td {
    border-bottom:1px dotted #BBBDBF;
    padding:5px;
}
 
div.rowlines-wrapper {
    padding:0 10px 0 10px;
}
 
span.subpages {
  display: none !important;
}
 
/* Main Page CSS */
 
body #t-cite,
body #siteSub,
body.page-Home.action-view #contentSub,
body.page-Home.action-view #jump-to-nav {
  display: none !important;
}
 
/* Copied from Wikivoyage for scalable-width images */


@media screen and (max-width:749px) {
@media screen and (max-width:749px) {
    /*
  .banner-image {
    The styles below essentially place the navigation menu below the content,
    position: relative;
    instead of to the side of it. They also hide the logo, as there's no space
    overflow: hidden;
    left for it.
     max-width: 1125px;  
  */
     width: 100%;
    #mw-head {
    height: auto;
        position: static !important;
    margin-bottom: .6em;
        margin-top: 0.5em;
    text-align: center;
     }
    padding-left: 0 !important;
    /* Move the panel to the bottom and display it as in-line lists; hide the logo and tabs */
  }
     div#mw-panel {
  .banner-image img {
        display: table;
    width: 100%;
        position: static;
    height: auto;
        table-layout: fixed;
     width: auto\9;
        width: 100%;
     margin:0 auto;
        overflow: hidden;
  }
    }
}
    div#mw-panel .portal {
 
        display: block;
@media screen and (min-width:750px) {
        width: 100%;
  .banner-image {
        vertical-align: top;
    float: right;
     }
     position: relative;
     #mw-panel ul li {
     overflow: hidden;
        list-style: none;
     max-width: 1125px;  
    }
     height: auto;
    #mw-panel ul li:before {
     margin-bottom: .6em;
        content: " ◦ ";
  }
    }
  .banner-image img {
    #p-logo {
    float: right;
        display: none;
    width: 100%;
     }
    height: auto;
    #left-navigation {
    width: auto\9;
        display: none;
  }
     }
  .banner-image-left {
    #p-cactions {
    float: left !important;
        display: none;
  }
     }
  .banner-image-left img {
    #p-views {
    float: left !important;
        display: none;
  }
     }
  .banner-image-none {
    /* Rearrange various page elements to fill the now-available space */
    float: none !important;
    #p-personal ul {
  }
        padding-left: 0;
  .banner-image-none img {
     }
    float: none !important;
    div#footer {
  }
        margin-left: 0;
  .banner-image-center {
        padding-top: 0;
    padding-left: none !important;
    }
    float: none !important;
    #p-personal {
    margin-left: auto !important;
        display: table;
     margin-right: auto !important;
        position: relative;
  }
        width: 100%;
  .banner-image-center img {
        top: inherit;
    float: none !important;
        left: inherit;
  }
        right: inherit;
}
    }
 
    #right-navigation {
.main-page-image {
        max-width: 500px;
    position: relative;
        position: absolute;
     overflow: hidden;
        top: inherit;
     max-width: 1125px;  
        margin-top: -1px;
    height: auto;
        float: none;
     margin-left: -1em;
    }
    margin-right: -1.5em;
    #right-navigation:before {
     margin-bottom: .6em;
        content: url("https://wikimedia.org.au/w/images/b/bb/Mobile_Logo.png");
}
    }
    #p-search {
.main-page-image img {
        display: none;
    width: 100%;
    }
     height: auto;
    div#content {
    width: auto\9;
        /* Hide the 1px blue border on the left side */
}
        border-left: 0;
 
        margin-left: 0;
/* Login interface adjustments */
     }
 
    /* Adjusted Vector Appearance */
.mw-createacct-benefits-container {
    body {
  display: none;
        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;
    }
   
}
}

Latest revision as of 01:53, 18 June 2022

.nav th {
  text-align: center;
  background: #ECECEC;
  font-weight: bold;
  margin: 0 .1em 0 0;
  width: 25%;
  font-size: 0.925em;
  -moz-border-radius: 12px 12px 12px 12px;
}

.nav th a {
  padding: 1em 2em;
  color: #224F82;
  text-decoration: none;
}

.nav th:hover {
  color: #000;
}

li#footer-info-lastmod,
li#footer-info-viewcount,
li#footer-places-about,
li#footer-places-disclaimer {
  display: none !important;
}

div#mw-panel div.portal#p-navigation div.body {
  background-image:none;
}

#p-navigation h5 {
  display: none !important;
}

.nowrap { 
    white-space: nowrap;
}

.toggle-head {
  background:url(//upload.wikimedia.org/wikipedia/commons/thumb/1/1c/HW_open_arrow.svg/10px-HW_open_arrow.svg.png) no-repeat 0% center;
}

.toggle-head:hover {
  text-decoration:underline;
  cursor:pointer;
}

.redirect-in-category, .allpagesredirect a {
  color: gray;
}

.nodisplay {
  display: none !important;
}

/* Custom table formatting */

table.rowlines { 
    border-collapse:collapse;
    border:2px solid #BBBDBF;
    width:100%;
    vertical-align:top;
}

table.rowlines th {
    border-bottom:1px solid #BBBDBF;
    border-top:1px solid #BBBDBF;
    padding:5px;
}

table.rowlines td {
    border-bottom:1px dotted #BBBDBF;
    padding:5px;
}

div.rowlines-wrapper {
    padding:0 10px 0 10px;
}

span.subpages {
  display: none !important;
}

/* Main Page CSS */

body #t-cite,
body #siteSub,
body.page-Home.action-view #contentSub,
body.page-Home.action-view #jump-to-nav {
  display: none !important;
}

/* Copied from Wikivoyage for scalable-width images */

@media screen and (max-width:749px) {
  .banner-image {
    position: relative;
    overflow: hidden;
    max-width: 1125px; 
    width: 100%;
    height: auto;
    margin-bottom: .6em;
    text-align: center;
    padding-left: 0 !important;
  }
  .banner-image img {
    width: 100%;
    height: auto;
    width: auto\9;
    margin:0 auto;
  }
}

@media screen and (min-width:750px) {
  .banner-image {
    float: right;
    position: relative;
    overflow: hidden;
    max-width: 1125px; 
    height: auto;
    margin-bottom: .6em;
  }
  .banner-image img {
    float: right;
    width: 100%;
    height: auto;
    width: auto\9;
  }
  .banner-image-left {
    float: left !important;
  }
  .banner-image-left img {
    float: left !important;
  }
  .banner-image-none {
    float: none !important;
  }
  .banner-image-none img {
    float: none !important;
  }
  .banner-image-center {
    padding-left: none !important;
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .banner-image-center img {
    float: none !important;
  }
}

.main-page-image {
    position: relative;
    overflow: hidden;
    max-width: 1125px; 
    height: auto;
    margin-left: -1em;
    margin-right: -1.5em;
    margin-bottom: .6em;
}
 
.main-page-image img {
    width: 100%;
    height: auto;
    width: auto\9;
}

/* Login interface adjustments */

.mw-createacct-benefits-container {
  display: none;
}
Retrieved from "https://wikimedia.org.au/w/index.php?title=MediaWiki:Common.css&oldid=19037"
Discuss this page