Difference between revisions of "MediaWiki:Common.css"

From Wikimedia Australia
Jump to navigation Jump to search
(hmm)
(test)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
+
@import url(//brick.a.ssl.fastly.net/Open+Sans:400,600,700);
  
textarea#wpBio {
+
.nav th {
        height:50px;
+
  text-align: center;
        width:400px;
+
  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;
 +
}
 +
 +
h2 {
 +
    border-bottom: 2px dotted #BBBDBF;
 +
}
 +
 +
.firstHeading {
 +
  border-bottom: none;
 +
  margin-bottom:10px;
 +
  padding-top:10px !important;
 +
  padding-left:0;
 +
  font-size: 2.4em !important;
 +
  width:100%;
 +
  margin:auto;
 +
  border-collapse:collapse;
 +
  vertical-align:top;
 +
  line-height:100%;
 +
}
 +
 +
.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;
 +
}
  
table.wikitable th, table.wikitable td, table.prettytable th, table.prettytable td {
+
.nodisplay {
border:1px solid #AAAAAA;
+
  display: none !important;
padding:0.2em;
 
 
}
 
}
  
 +
/* Custom table formatting */
  
 +
table.rowlines {
 +
    border-collapse:collapse;
 +
    border:2px solid #BBBDBF;
 +
    width:100%;
 +
    vertical-align:top;
 +
}
  
/* default skin for navigation boxes */
+
table.rowlines th {
table.navbox {           /* navbox container style */
+
    border-bottom:1px solid #BBBDBF;
  border:1px solid #aaa;
+
    border-top:1px solid #BBBDBF;
  width:100%;
+
    padding:5px;
  margin:auto;
 
  clear:both;
 
  font-size:88%;
 
  text-align:center;
 
  padding:1px;
 
 
}
 
}
table.navbox + table.navbox {
+
 
  margin-top:-1px;       /* single pixel border between adjacent navboxes (doesn't work for IE6, but that's okay) */
+
table.rowlines td {
 +
    border-bottom:1px dotted #BBBDBF;
 +
    padding:5px;
 
}
 
}
.navbox-title, .navbox-abovebelow, table.navbox th {
+
 
  text-align:center;      /* title and above/below styles */
+
div.rowlines-wrapper {
  padding-left:1em;
+
    padding:0 10px 0 10px;
  padding-right:1em;
 
 
}
 
}
.navbox-group {           /* group style */
+
 
  white-space:nowrap;
+
span.subpages {
  text-align:right;
+
   display: none !important;
  font-weight:bold;
 
  padding-left:1em;
 
   padding-right:1em;
 
 
}
 
}
.navbox, .navbox-subgroup {
+
 
  background:#fdfdfd;     /* Background color */
+
/* Arrow button formatting */
 +
 
 +
.arrowbutton {
 +
color:#ffffff;
 +
width:100px;
 +
padding:0.4em;
 +
line-height:1.5em;
 
}
 
}
.navbox-list {
+
 
  border-color:#fdfdfd;   /* Must match background color */
+
.arrowbutton::before {
 +
content:"⇒ ";
 +
font-weight:bold;
 
}
 
}
.navbox-title, table.navbox th {
+
 
  background:#ccccff;     /* Level 1 color */
+
.arrowbutton-red {
 +
background:#7e322c;
 
}
 
}
.navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title {
+
 
  background:#ddddff;     /* Level 2 color */
+
.arrowbutton-green {
 +
background:#53946b;
 
}
 
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
+
 
  background:#e6e6ff;     /* Level 3 color */
+
.arrowbutton-blue {
 +
background:#4f79a2;
 
}
 
}
.navbox-even {
+
 
  background:#f7f7f7;     /* Even row striping */
+
.arrowbutton-gold {
 +
background:#E5B921;
 
}
 
}
.navbox-odd {
+
 
  background:transparent; /* Odd row striping */
+
.arrowbutton-red:hover {
 +
    background: #EDDEDE !important;
 +
    color: #000000 !important;
 +
}
 +
 
 +
.arrowbutton-green:hover {
 +
    background: #DEEDE6 !important;
 +
    color: #000000 !important;
 +
}
 +
 
 +
.arrowbutton-blue:hover {
 +
    background: #DEE7ED !important;
 +
    color: #000000 !important;
 +
}
 +
 
 +
.arrowbutton-gold:hover {
 +
    background: #faefcb !important;
 +
    color: #000000 !important;
 
}
 
}
  
/* resize images */
+
/* Round button formatting */
  
img {
+
.roundbutton {
     max-width: 100%;
+
     display:inline-block; border-radius:50%; color:#ffffff; width:54px; height:54px; padding:12px; margin-right:0.5em; margin-bottom:0.5em; text-align:center;
 +
}
 +
 
 +
.roundbutton-large {
 +
    display:inline-block; border-radius:50%; color:#ffffff; width:68px; height:68px; padding:15px; margin-right:0.5em; margin-bottom:0.5em; text-align:center;
 +
}
 +
 
 +
/* 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;
 
     height: auto;
     width: 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;
 +
}
 +
 
 +
/* Changes to MediaWiki default image stuff */
 +
/* Yell at James Hare if this breaks anything */
 +
 
 +
div.floatright {
 +
  clear:none;
 +
}
 +
 
 +
div.floatleft {
 +
  clear:none;
 +
}
 +
 
 +
/* Certain pages on this website use a two-column setup */
 +
/* Pages that employ the "mobile-collapse" class will force it down to a one-column setup on narrow screens (e.g. on mobile devices) */
 +
/* This is not to be used on the main page, which employs its own sophisticated code to reduce two columns to one column */
 +
 
 +
@media screen and (max-width:749px) {
 +
  .mobile-collapse {
 +
    display: block !important;
 +
    width: 100% !important;
 +
    margin-bottom:0.6em;
 +
  }
 +
 
 +
  #donatebutton {
 +
    overflow:scroll;
 +
  }
 +
 
 +
  #donate-pullquote,
 +
  #donate-otheroptions {
 +
  display:none;
 +
  }
 +
}
 +
 
 +
/* Typography */
 +
/* Makes site-wide what has been implemented on a page-by-page basis */
 +
 
 +
body {
 +
  font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 +
}
 +
 
 +
.firstHeading {
 +
  font-weight: 600;
 +
}
 +
 
 +
@media screen and (min-width:750px) {
 +
  div#bodyContent {
 +
    font-size:1.05em; padding:0;
 +
  }
 +
  p {
 +
    margin-bottom:1em;
 +
  }
 +
  h1 {
 +
    font-size: 2.4em !important;
 +
  }
 +
}
 +
 
 +
body.page-User_James_Hare_GLAM #siteNotice,
 +
body.page-User_James_Hare_GLAM #firstHeading,
 +
body.page-Internal_Strategic_plan_2015 #siteNotice,
 +
body.page-Internal_Strategic_plan_2015 #firstHeading,
 +
body.page-Strategic_plan_2015 #siteNotice,
 +
body.page-Strategic_plan_2015 #firstHeading,
 +
body.page-Donate #siteNotice,
 +
body.page-Donate #firstHeading {
 +
  display:none !important;
 +
}
 +
 
 +
#megaheader img {
 +
  opacity:0;
 +
  -moz-transition: opacity 2s; /* Firefox 4 */
 +
  -webkit-transition: opacity 2s; /* Safari and Chrome */
 +
  -o-transition: opacity 2s;
 +
  transition: opacity 2s;
 +
}
 +
 
 +
/* Evil interface meddling for donations */
 +
 
 +
.page-Donate_Monthly_5 #mw-head,
 +
.page-Donate_Monthly_5 .portal,
 +
.page-Donate_Monthly_10 #mw-head,
 +
.page-Donate_Monthly_10 .portal,
 +
.page-Donate_Monthly_25 #mw-head,
 +
.page-Donate_Monthly_25 .portal,
 +
.page-Donate_Monthly_50 #mw-head,
 +
.page-Donate_Monthly_50 .portal,
 +
.page-Donate_Monthly_100 #mw-head,
 +
.page-Donate_Monthly_100 .portal,
 +
.page-Donate_Monthly_200 #mw-head,
 +
.page-Donate_Monthly_200 .portal,
 +
.page-Donate_Annually_5 #mw-head,
 +
.page-Donate_Annually_5 .portal,
 +
.page-Donate_Annually_10 #mw-head,
 +
.page-Donate_Annually_10 .portal,
 +
.page-Donate_Annually_25 #mw-head,
 +
.page-Donate_Annually_25 .portal,
 +
.page-Donate_Annually_50 #mw-head,
 +
.page-Donate_Annually_50 .portal,
 +
.page-Donate_Annually_100 #mw-head,
 +
.page-Donate_Annually_100 .portal,
 +
.page-Donate_Annually_200 #mw-head,
 +
.page-Donate_Annually_200 .portal,
 +
.page-Donate_One-time_5 #mw-head,
 +
.page-Donate_One-time_5 .portal,
 +
.page-Donate_One-time_10 #mw-head,
 +
.page-Donate_One-time_10 .portal,
 +
.page-Donate_One-time_25 #mw-head,
 +
.page-Donate_One-time_25 .portal,
 +
.page-Donate_One-time_50 #mw-head,
 +
.page-Donate_One-time_50 .portal,
 +
.page-Donate_One-time_100 #mw-head,
 +
.page-Donate_One-time_100 .portal,
 +
.page-Donate_One-time_200 #mw-head,
 +
.page-Donate_One-time_200 .portal {
 +
    display: none;
 
}
 
}

Revision as of 02:18, 17 May 2015

@import url(//brick.a.ssl.fastly.net/Open+Sans:400,600,700);

.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;
}

h2 {
    border-bottom: 2px dotted #BBBDBF;
}

.firstHeading {
   border-bottom: none;
   margin-bottom:10px;
   padding-top:10px !important;
   padding-left:0;
   font-size: 2.4em !important;
   width:100%;
   margin:auto;
   border-collapse:collapse;
   vertical-align:top;
   line-height:100%;
}

.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;
}

/* Arrow button formatting */

.arrowbutton {
	color:#ffffff;
	width:100px;
	padding:0.4em;
	line-height:1.5em;
}

.arrowbutton::before {
	content:"⇒ ";
	font-weight:bold;
}

.arrowbutton-red {
	background:#7e322c;
}

.arrowbutton-green {
	background:#53946b;
}

.arrowbutton-blue {
	background:#4f79a2;
}

.arrowbutton-gold {
	background:#E5B921;
}

.arrowbutton-red:hover {
    background: #EDDEDE !important;
    color: #000000 !important;
}

.arrowbutton-green:hover {
    background: #DEEDE6 !important;
    color: #000000 !important;
}

.arrowbutton-blue:hover {
    background: #DEE7ED !important;
    color: #000000 !important;
}

.arrowbutton-gold:hover {
    background: #faefcb !important;
    color: #000000 !important;
}

/* Round button formatting */

.roundbutton {
    display:inline-block; border-radius:50%; color:#ffffff; width:54px; height:54px; padding:12px; margin-right:0.5em; margin-bottom:0.5em; text-align:center;
}

.roundbutton-large {
    display:inline-block; border-radius:50%; color:#ffffff; width:68px; height:68px; padding:15px; margin-right:0.5em; margin-bottom:0.5em; text-align:center;
}

/* 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;
}

/* Changes to MediaWiki default image stuff */
/* Yell at James Hare if this breaks anything */

div.floatright {
  clear:none;
}

div.floatleft {
  clear:none;
}

/* Certain pages on this website use a two-column setup */
/* Pages that employ the "mobile-collapse" class will force it down to a one-column setup on narrow screens (e.g. on mobile devices) */
/* This is not to be used on the main page, which employs its own sophisticated code to reduce two columns to one column */

@media screen and (max-width:749px) {
  .mobile-collapse {
    display: block !important;
    width: 100% !important;
    margin-bottom:0.6em;
  }

  #donatebutton {
    overflow:scroll;
  }
  
  #donate-pullquote,
  #donate-otheroptions {
  	display:none;
  }
}

/* Typography */
/* Makes site-wide what has been implemented on a page-by-page basis */

body {
  font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.firstHeading {
  font-weight: 600;
}

@media screen and (min-width:750px) {
  div#bodyContent {
    font-size:1.05em; padding:0;
  }
  p {
    margin-bottom:1em;
  }
  h1 {
    font-size: 2.4em !important;
  }
}

body.page-User_James_Hare_GLAM #siteNotice,
body.page-User_James_Hare_GLAM #firstHeading,
body.page-Internal_Strategic_plan_2015 #siteNotice,
body.page-Internal_Strategic_plan_2015 #firstHeading,
body.page-Strategic_plan_2015 #siteNotice,
body.page-Strategic_plan_2015 #firstHeading,
body.page-Donate #siteNotice,
body.page-Donate #firstHeading {
  display:none !important;
}

#megaheader img {
  opacity:0;
  -moz-transition: opacity 2s; /* Firefox 4 */
  -webkit-transition: opacity 2s; /* Safari and Chrome */
  -o-transition: opacity 2s;
  transition: opacity 2s;
}

/* Evil interface meddling for donations */

.page-Donate_Monthly_5 #mw-head,
.page-Donate_Monthly_5 .portal,
.page-Donate_Monthly_10 #mw-head,
.page-Donate_Monthly_10 .portal,
.page-Donate_Monthly_25 #mw-head,
.page-Donate_Monthly_25 .portal,
.page-Donate_Monthly_50 #mw-head,
.page-Donate_Monthly_50 .portal,
.page-Donate_Monthly_100 #mw-head,
.page-Donate_Monthly_100 .portal,
.page-Donate_Monthly_200 #mw-head,
.page-Donate_Monthly_200 .portal,
.page-Donate_Annually_5 #mw-head,
.page-Donate_Annually_5 .portal,
.page-Donate_Annually_10 #mw-head,
.page-Donate_Annually_10 .portal,
.page-Donate_Annually_25 #mw-head,
.page-Donate_Annually_25 .portal,
.page-Donate_Annually_50 #mw-head,
.page-Donate_Annually_50 .portal,
.page-Donate_Annually_100 #mw-head,
.page-Donate_Annually_100 .portal,
.page-Donate_Annually_200 #mw-head,
.page-Donate_Annually_200 .portal,
.page-Donate_One-time_5 #mw-head,
.page-Donate_One-time_5 .portal,
.page-Donate_One-time_10 #mw-head,
.page-Donate_One-time_10 .portal,
.page-Donate_One-time_25 #mw-head,
.page-Donate_One-time_25 .portal,
.page-Donate_One-time_50 #mw-head,
.page-Donate_One-time_50 .portal,
.page-Donate_One-time_100 #mw-head,
.page-Donate_One-time_100 .portal,
.page-Donate_One-time_200 #mw-head,
.page-Donate_One-time_200 .portal {
    display: none;
}