MediaWiki:Common.css

From Wikimedia Canada
Jump to navigation Jump to search

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.
/* MISE EN FORME DES ÉVÉNEMENTS */
table.event {
	margin:20px;
}

td.event {
	color:white; 
	text-align:center; 
	font-weight:bold; 
	line-height:140%;
}

.jan {background-color:#64B5F6;}
.feb {background-color:#F48FB1;}
.mar {background-color:#339966;}
.apr {background-color:#BA68C8;}
.may {background-color:#64B5F6;}
.jun {background-color:#1976D2;}
.jul {background-color:#303F9F;}
.aug {background-color:#861D21;}
.sep {background-color:#558B2F;}
.oct {background-color:#FF9800;}
.nov {background-color:#8D6E63;}
.dec {background-color:#6D4C41;}

/* REMOVE TITLE OF MAIN PAGES
body.page-Main_Page #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Main_Page/fr #firstHeading {
   position: absolute;
   top: -5000px;
}
body.page-Accueil #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Home #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Fundraising_2013 #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Levée_de_fonds_2013 #firstHeading {
   position: absolute;
   top: -5000px;
}
 */
/* Other kind of tables */
.button {
   width:50%;
}

/* National Contribution Month banner */

.NCM-banner {
   background-image: url(http://wikimedia.ca/w/images/a/ad/National_Contribution_Month_banner.jpg); background-position:left top; background-repeat:no-repeat;
}

.FR2013-banner {
   background-image: url(http://wikimedia.ca/w/images/0/09/Banner_bg_map_Canada.png); background-position:left top; background-repeat:no-repeat;
}

/* WLM BANNER */

.WLM-banner {
   background-image: url(//upload.wikimedia.org/wikipedia/commons/5/59/Banner_WLM_uploadwizard.jpg); background-position:left top; background-repeat:no-repeat;
}

/* WLM BANNER ENGLISH */

body.page-Wiki_Loves_Monuments_2012_in_Canada #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_Participate #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_Prizes #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_Uploading #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_Links #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_FAQ #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_Medias #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_in_Canada_Contact #firstHeading {
   position: absolute;
   top: -5000px;
}

/* WLM BANNER FRENCH */

body.page-Wiki_Loves_Monuments_2012_au_Canada #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_Participer #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_Prix #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_Téléversement #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_Liens #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_FAQ #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_Médias #firstHeading {
   position: absolute;
   top: -5000px;
}

body.page-Wiki_Loves_Monuments_2012_au_Canada_Contact #firstHeading {
   position: absolute;
   top: -5000px;
}
/* Appearance of left side menu */
.portlet h5 {
 text-transform:none;
 font-variant:normal;
 background:#e0e3e6;
 border:thin solid silver;
}

/* Colors & indentation for Talk & Template pages */
.ns-talk dd {
 margin:0;
 padding:0;
}

.ns-10 * #content,
.ns-10 * #p-cactions li,
.ns-10 * #p-cactions li a { background:#ECFCF4; }

.ns-talk dl {
 border-top:solid 1px #DDDDDD;
 border-left:solid 1px #DDDDDD;
 padding-top:.5em;
 padding-left:.5em;
 margin-left:1em;
}
 
.ns-talk dl,
.ns-talk dl dl dl,
.ns-talk dl dl dl dl dl,
.ns-talk dl dl dl dl dl dl dl,
.ns-talk dl dl dl dl dl dl dl dl dl
{ background:#F9F9F9 }
 
.ns-talk dl dl,
.ns-talk dl dl dl dl,
.ns-talk dl dl dl dl dl dl,
.ns-talk dl dl dl dl dl dl dl dl,
.ns-talk dl dl dl dl dl dl dl dl dl dl
{ background:#FFFFFF }

/* Pretty tables - THIS FEATURE WILL BECOME LESS AND LESS USED IN THE FUTURE (12/09/2012) */
.table {
   width:100%;
   background-color:transparent;
}

.table td {
   width:auto;
   border-style:solid;
   border-width:1px;
   -moz-border-radius:10px;
   -webkit-border-radius:10px;
   border-radius:1px;
   vertical-align:top;
   padding:.5em;
}

.table h2 {
   background-color:transparent;
   border-style:solid;
   border-width:1px;
   -moz-border-radius:10px;
   -webkit-border-radius:10px;
   border-radius:10px;
   padding:1em;
   margin:0;
   font-size:130%;
   text-align:left;
   font-weight:bold;
   white-space:nowrap;
}

.editsection {
   font-size:60%;
   font-weight:normal;
   padding-right:10px;
}

.green {
   background:#F5FFFA;
   border-color:#A3BFB1;
}

.green h2 {
   background:#CEF2E0;
   border-color:#A3BFB1;
   background-image: url(//upload.wikimedia.org/wikipedia/commons/f/fb/Gradient_43px.png); background-position:top; background-repeat:repeat-x;
}

.blue {
   background:#F5FAFF;
   border-color:#A3B0BF;
}

.blue h2 {
   background:#CEDFF2;
   border:1px solid #A3B0BF;
   background-image: url(//upload.wikimedia.org/wikipedia/commons/f/fb/Gradient_43px.png); background-position:top; background-repeat:repeat-x;
}

.purple {
   background:#FAF5FF;
   border-color:#AFA3BF;
   text-align:center;
   color:#660066;
   padding:10em;
}

.purple h2 {

}

.red {
   background:#FFF5FA;
   border-color:#BFA3B1;
}

.red h2 {
   background:#F2CEE0;
   border:1px solid #BFA3B1;
   background-image: url(//upload.wikimedia.org/wikipedia/commons/f/fb/Gradient_43px.png); background-position:top; background-repeat:repeat-x;
}

.orange {
   background:#FFFAF5;
   border-color:#BFB1A3;
}

.orange h2 {
   background:#F2E0CE;
   border:1px solid #BFB1A3;
   background-image: url(//upload.wikimedia.org/wikipedia/commons/f/fb/Gradient_43px.png); background-position:top; background-repeat:repeat-x;
}

.yellow {
   background:#FAFFF5;
   border-color:#B1BFA3;
}

.yellow h2 {
   background:#E0F2CE;
   border:1px solid #B1BFA3;
   background-image: url(//upload.wikimedia.org/wikipedia/commons/f/fb/Gradient_43px.png); background-position:top; background-repeat:repeat-x;
}

.leaf {
   background-image: url(//upload.wikimedia.org/wikipedia/commons/6/6a/Picto_infobox_Canada.png); background-position:top right; background-repeat:no-repeat;
}

.gradient-info {
   background-image: url(//upload.wikimedia.org/wikipedia/commons/2/21/Communaut%C3%A9_silhouette_degrade.png); background-position:top right; background-repeat:no-repeat;
}

/* Other kind of tables */
.button {
   width:1%;
   -moz-border-radius:10px;
   -webkit-border-radius:10px;
   border-radius:10px;
   border:1px solid #aaaaaa;
   background:#f9f9f9;
   background-image: url(//upload.wikimedia.org/wikipedia/commons/f/fb/Gradient_43px.png); background-position:top; background-repeat:repeat-x;
   white-space:nowrap;
   margin:.5em;
   font-weight:bold;
   padding:0 1em 0 1em;
}

.button a {
   background: none !important;
   padding: 0 !important;
   color: #002bb8 !important;
}

.timezone {
   background: #ffffff;
   color: #000;
   line-height:1.1em; 
   float:right;
   clear:right;
   margin:0 0 .5em 1em; /* haut droite bas gauche */
   width:300px;
   border: 1px solid #A3B1BF;
   padding: 0.3em;
   white-space:nowrap;
}

.timezone th {
   background:#E6F2FF;
   text-align:left;
   padding:.5em;
}

.timezone td {
   background:#E6F2FF;
   text-align:center;
}

.activity_header {
   border:1px solid #4DAB56;
   background:#444;
   text-align:center;
}

/* Language link */
.lang {
   position: absolute;
   z-index:0; 
   width: 100%;
   border:none;
   background:none;
   top:-20px;
   text-align:right;
   text-indent:0;
   text-transform:none;
   white-space:nowrap;
   font-weight:bold;
}

/* CSS FROM WMDC */

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

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

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

@media screen and (max-width:767px) {
  .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:768px) {
  .banner-image {
    position: relative;
    overflow: hidden;
    max-width: 1125px; 
    height: auto;
    margin-bottom: .6em;
  }
  .banner-image img {
    width: 100%;
    height: auto;
    width: auto\9;
  }
  .banner-image-left {
    float: left !important;
  }
  .banner-image-left img {
    float: left !important;
  }
  .banner-image-right {
    float: right !important;
  }
  .banner-image-right img {
    float: right !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;
  }
}

/* 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) */

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

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

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

/* Header mega template */

#megaheader {
  position:relative;
  padding-bottom:1em;
  border:none;
  margin-bottom:2em;
  overflow: hidden;
}

@media screen and (min-width:982px) {
  #megaheader {
    margin-top:-3em;
    margin-left:-1.5em;
    margin-right:-1.5em;
  }
}

@media screen and (min-width:768px) and (max-width:981px) {
  #megaheader {
    margin-top:-2.7em;
    margin-left:-1em;
    margin-right:-1em;
  }
}

@media screen and (max-width:767px) {
  #megaheader {
    margin-top:-3em;
    margin-left:-1.15em;
    margin-right:-1.15em;
  }
}


@media screen and (min-width:768px) {
  #megaheader {
    height:500px;
  }

  #megaheader-short {
  	height:200px;
  }
}

@media screen and (max-width:767px) {
  #megaheader {
     height:auto;
  }
}

#megaheader img {
  -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;
}

@media screen and (max-width:767px) {
	.no-narrow {
		display: none;
	}
}
@media screen and (min-width:768px) {
	.narrow-only {
		display: none;
	}
}

/* Limit display of TOC subsections where applied */
.toclimit-2 .toclevel-1 ul,
.toclimit-3 .toclevel-2 ul,
.toclimit-4 .toclevel-3 ul,
.toclimit-5 .toclevel-4 ul,
.toclimit-6 .toclevel-5 ul,
.toclimit-7 .toclevel-6 ul {
	display: none;
}