MediaWiki:Centralnotice-template-B11 1119 5metergoal AU

From Meta, a Wikimedia project coordination wiki

<style type="text/css">

/* Common style for 2011 banners */
/* Suppress lock icon for secure links in the banner */ 
#centralNotice a[href^="https://"], .link-https {
 background-image: none !important;
 padding: 0 !important;
}
/* Set a grey border, grey background, etc. */
.cn-fundraiser-banner {
 position: relative;
 border: 1px solid silver;
 background-color: #fbfbfb;
 margin-bottom: 0.5em !important;
 padding-top: 1em;
 padding-bottom: 1em;
 text-align:center;
}
/* Put the little X in the top-right (ltr) or top-left (rtl) corner */
#cn-toggle-box {
 position: absolute;
 z-index: 51;
 top: 7px;
}
body.ltr #cn-toggle-box {
 right: 7px;
}
body.rtl #cn-toggle-box {
 left: 7px;
}
#cn-toggle-box img {
 display: block;
}
/* Put the big X in the top-right (ltr) or top-left (rtl) corner */
#cn-close-box {
 position: absolute;
 z-index: 51;
 top: 5px;
}
body.ltr #cn-close-box {
 right: 5px;
}
body.rtl #cn-close-box {
 left: 5px;
}
#cn-close-box img {
 display: block;
}
/* Bold, blue text */
.cn-blue-text {
 font-weight: bold;
 color: #6e98c2;
 text-align: center;
 font-size: 1.3em;
}
/* Bigger bold, blue text */
.cn-bold-blue-text {
 font-size: 2.25em;
 font-weight: bold;
 color: navy;
 text-align: center;
 padding: 0.5em !important;
 line-height: 1em;
 direction: ltr; // Temporary fix for FRDrill 6. Will be removed later (breaks RTL when we have translations)
}
/* For buttons in the lower right (ltr) or left (rtl) corner */
.cn-bottom-right-float {
 position: absolute;
 z-index: 50;
 bottom: 1em;
}
body.ltr .cn-bottom-right-float {
 right: 1em;
}
body.rtl .cn-bottom-right-float {
 left: 1em;
}

/* For buttons in the upper left (ltr) or right (rtl) corner */

.cn-top-left-float {
 position: absolute;
 z-index: 50;
 top: 1em;
}
body.ltr .cn-top-left-float {
 left: 1em;
}
body.rtl .cn-top-left-float {
 right: 1em;
}
/* To make the entire banner clickable */
a.cn-full-banner-click {
 display:block;
 position:relative;
 height:100%;
 width:100%;
}

</style> <style type="text/css">

  1. notice-button-2011 {
 height: 30px;
 text-align: center;
 background-color: transparent;
}

body.ltr #notice-button-2011 {

 float: right;
}

body.rtl #notice-button-2011 {

 float: left;
}
  1. notice-button-2011-start {
 float: right;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/a/a7/CNtranslatebutton2.png);
 background-position: right bottom;
 width: 4px;
 height: 30px;
}
#notice-button-2011-end {
 float: right;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/a/a7/CNtranslatebutton2.png);
 background-position: left top;
 width: 4px;
 height: 30px;
}

  1. notice-button-2011-label {
 float: right;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/a/a7/CNtranslatebutton2.png);
 background-position: center center;
 background-repeat: repeat-x;
 font-family: sans-serif;
 font-size: 1em;
 font-weight: bold;
 color: black;
 line-height: 30px;
 height: 30px;
 padding: 0 4px;
 white-space: nowrap;
 text-decoration: none;
 cursor: pointer;
}
  1. notice-button-2011-label:hover{
 text-decoration: none;
 cursor: pointer;

}

  1. notice-button-2011-Editor {
position:absolute;
height: 30px;
text-align: center;
background-color: transparent;
bottom: 15px;

} body.ltr #notice-button-2011-Editor {

left: 40px;

} body.rtl #notice-button-2011-Editor {

right: 40px;

}

  1. notice-button-2011-start-Editor {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/a/a7/CNtranslatebutton2.png);
 background-position: left top;
 width: 4px;
 height: 30px;
}
#notice-button-2011-end-Editor {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/a/a7/CNtranslatebutton2.png);
 background-position: right bottom;
 width: 4px;
 height: 30px;
}

  1. notice-button-2011-label-Editor {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/a/a7/CNtranslatebutton2.png);
 background-position: center center;
 background-repeat: repeat-x;
 font-family: sans-serif;
 font-size: .5em;
 font-weight: bold;
 color: black;
 line-height: 30px;
 height: 30px;
 padding: 0 4px;
 white-space: nowrap;
}

</style> <style type="text/css">

  1. centralNotice.collapsed #{{{banner-name}}}{
 display: none;

}

  1. {{{banner-name}}} {
 position: relative;
 background-image: url({{{image-link}}});
 background-repeat: no-repeat;
 margin-bottom: 0.5em !important;
 background-color:#FFFFFF;
 border: solid 1px silver; 
 height:172px;
 overflow: hidden;

}

body.ltr #{{{banner-name}}} {

 background-position: bottom left;

} body.rtl #{{{banner-name}}} {

 background-position: bottom right;

}

  1. {{{banner-name}}} a {
 text-decoration: none;

}

  1. {{{banner-name}}} a:hover {
 text-decoration: none;

}

  1. cn-bold-blue-text:hover {
 text-decoration: underline;

}

/* Bigger bold, blue text */

  1. {{{banner-name}}} #cn-bold-blue-text {
 font-size: 2.25em;
 font-weight: bold;
 font-family: Helvetica, Arial, sans-serif;
 color: navy;
 padding: 0.8em 120px 0.2em 175px;
 line-height: 1em;
 text-align:center;

}

  1. {{{banner-name}}} #thermo-caption {
 font-size: 1.5em;
 font-weight: bold;
 font-family: Helvetica, Arial, sans-serif;
 color: navy;
 padding: 0;
 line-height: 1.5em;
 text-align:center;
 margin: 0 0 0 0;

}

  1. {{{banner-name}}} #thermometer-wrapper {
 position:relative;
 bottom: 10px;
 right: 15px;
 height: 21px;
 width: 445px;
 margin: 1em auto;

}

#{{{banner-name}}} #notice-thermometer {
 position: relative;
 height: 21px;
 width: 545px;
 margin: 0.75em 0.75em 0.25em 0.75em;

}

  1. {{{banner-name}}} #notice-thermometer-start {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/3/3d/Fundraising-2010-thermometer2.png);
 background-position: left top;
 width: 10px;
 height: 21px;

}

  1. {{{banner-name}}} #notice-thermometer-base {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/3/3d/Fundraising-2010-thermometer2.png);
 background-position: left 42px;
 height: 21px;
 color: #3474b5;
 font-weight: bold;
 text-align: right;
 line-height: 23px;
 overflow: hidden;

}

  1. {{{banner-name}}} #notice-thermometer-end {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/3/3d/Fundraising-2010-thermometer2.png);
 background-position: right bottom;
 width: 10px;
 height: 21px;

}

  1. {{{banner-name}}} #notice-thermometer-mercury {
 position: absolute;
 left: 10px;
 height: 21px;

}

  1. {{{banner-name}}} #notice-thermometer-fill {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/3/3d/Fundraising-2010-thermometer2.png);
 background-position: left -21px;
 height: 21px;
 color: #E8E8E8;
 font-weight: bold;
 text-align: right;
 line-height: 23px;
 overflow: hidden;

}

  1. {{{banner-name}}} #notice-thermometer-arrow {
 float: left;
 background-image: url(//upload.wikimedia.org/wikipedia/foundation/d/d6/2010-thermometer2-transition.png);
 height: 21px;
 width: 24px;

} </style>

<a id="cn-landingpage-link" href="#">

 {{{text1}}}
{{{text2}}}

{{{text3}}}
$290K raised
   {{{caption}}}
Read now

</a>

 <a href="#" onclick="toggleNotice();return false"><img border="0" src="//upload.wikimedia.org/wikipedia/foundation/2/20/CloseWindow19x19.png" width="19" height="19" alt="Close" /></a>

<script type="text/javascript"> // Set thermometer sizes var maxPixels = 500; var range = parseInt( '1500000' ); var value = parseInt( '290' ); var fill = parseInt( maxPixels * ( ( 1 / range ) * value ) );

$(document).ready( function () {

 $('#notice-thermometer-fill').animate( { width: fill }, 3000 )

} ); </script>