MediaWiki:Centralnotice-template-Leichte Sprache Banner iPad: Unterschied zwischen den Versionen

Aus Hurraki - Wörterbuch für Leichte Sprache
Wechseln zu: Navigation, Suche
Zeile 1: Zeile 1:
<!-- Large mobile banner. Must be used with "Large banner limit and switch" mixin -->
+
<style type="text/css">{{MediaWiki:WMDE_FR2015/Resources/DesktopBanner.css}}</style>
<style>
+
<style type="text/css">{{MediaWiki:WMDE_FR2015/Resources/icon.css}}</style>
/* Clearfix */
+
<style type="text/css">{{MediaWiki:WMDE_FR2015/Resources/wlightbox.css}}</style>
.frb .cf:before,
+
<script type="text/javascript">{{MediaWiki:WMDE_FR2016/Resources/BannerValues.js}}</script>
.frb .cf:after {
+
<script type="text/javascript">{{MediaWiki:WMDE_FR2016/Resources/DesktopBanner.js
  content: "";
+
| donations-date-base      = ' + window.GlobalBannerSettings['donations-date-base'] + '
  display: table;
+
| donations-collected-base  = ' + window.GlobalBannerSettings['donations-collected-base'] + '
}
+
| donators-base            = ' + window.GlobalBannerSettings['donators-base'] + '
 +
| appr-donations-per-minute = ' + window.GlobalBannerSettings['appr-donations-per-minute'] + '
 +
| appr-donators-per-minute  = ' + window.GlobalBannerSettings['appr-donators-per-minute'] + '
 +
}}
 +
</script>
 +
<script type="text/javascript">{{MediaWiki:WMDE_FR2016/Resources/CountCampaignDays.js
 +
| campaign-start-date = 2016-11-09
 +
}}
 +
</script>
 +
<script type="text/javascript">{{MediaWiki:WMDE_FR2015/Resources/CustomDayName.js}}</script>
 +
<script type="text/javascript">{{MediaWiki:WMDE_FR2016/Resources/wlightbox.js}}</script>
 +
<style type="text/css">
 +
  #WMDE_Banner-facts {
 +
    background-color:#2b8156;
 +
  }
  
.frb .cf:after { clear: both; }
+
  #WMDE_Banner_info {
 +
    color: #ffffff;
 +
  }
  
/* Box-sizing */
+
  #WMDE_Banner-text {
.frb,
+
     text-align:left;
.frb *,
+
     color: #ffffff;
.frb *:before,
+
  }
.frb *:after {
 
     -moz-box-sizing: border-box;
 
     -webkit-box-sizing: border-box;
 
    box-sizing: border-box;
 
}
 
  
/* Common styles */
+
  #WMDE_Banner-text-salute {
.frb label,
+
    color: #ffffff;
.frb button,
+
    font-size: 17px;
.frb input {
+
     font-weight: bold;
     font-family: inherit;
+
     line-height: 1.2em;
     -webkit-transition: all .2s ease-in-out;
+
    margin: 4px 10px 4px 35px;
     -moz-transition:   all .2s ease-in-out;
+
    text-align: justify;
     transition:         all .2s ease-in-out;
+
     margin-bottom: 0;
}
+
     padding-bottom: 0;
 +
  }
  
/* Main banner
+
#WMDE_BannerForm-wrapper {
------------------------------------ */
+
    background-color: #ffffff;
 +
    padding: 0 10px;
 +
  }
  
#frb {
+
#WMDE_Banner-form fieldset {
     position: absolute;
+
     width: 95%;
     top: 0 !important;
+
     border: 0;
     left: 0;
+
     margin: 0 auto;
     width: 100%;
+
     padding: 0 0.5em 0.5em 0.5em;
    height: 100%;
 
    font-family: "Helvetica Neue", "Helvetica", "Nimbus Sans L", "Arial", "Liberation Sans", sans-serif;
 
 
}
 
}
  
#frb-mask {
+
#WMDE_Banner-frequency ul,
    position: absolute;
+
#WMDE_Banner-amounts ul,
    z-index: 1000;
+
#WMDE_Banner-payment ul {
    top: 0;
 
    left: 0;
 
 
     width: 100%;
 
     width: 100%;
 
     height: 100%;
 
     height: 100%;
     background-color: black;
+
     display: table;
     opacity: 0.8;
+
     margin: 0 0 0.3em;
 +
    padding: 0;
 +
    list-style: none;
 
}
 
}
  
#frb-window {
+
#WMDE_Banner-form legend {
     position: relative;
+
     display: none;
    top: 0;
 
    left: 0;
 
    right: auto;
 
 
     width: 100%;
 
     width: 100%;
     margin-top: 0;
+
     margin: 0;
     color: #000;
+
    padding: 0 0 0.3em 0;
     background: #fff;
+
    text-align: center;
 +
     font-size: .9em;
 +
     color: rgba(0,0,0,0.42);
 
}
 
}
  
@media (min-width: 768px) {
+
/* --- Common Button Styles --- */
    #frb-window {
 
        margin-top: 20px;
 
        left: 5%;
 
        right: 5%;
 
        width: 90%;
 
    }
 
}
 
  
/* --- Message --- */
+
.WMDE_Banner-btn {
 
+
    background: #f8f9fa;
.frb-message {
+
    border: 1px solid #9aa0a7;
     font-size: 20px;
+
    border-radius: 2px;
     line-height: 1.3;
+
    padding: 11px 0;
     border: 5px solid #990000;
+
    width: 100%;
     border-bottom: 0;
+
     cursor: pointer;
 +
     display: inline-block;
 +
    margin: 0 1px;
 +
     text-align: center;
 +
     font-weight: bold;
 
}
 
}
  
.frb-message-text {
+
.WMDE_Banner-btn:hover {
     padding: 20px;
+
    background-color: #ffffff;
     font-weight: bold;
+
     color: #444444;
 +
     border-color: #a2a9b1;
 
}
 
}
  
@media (min-width: 768px) {
+
.WMDE_Banner-btn.checked {
     .frb-message {
+
     background: #2a4b8d;
        font-size: 24px;
+
    border-color: #7d8389;
        line-height: 1.4;
+
     color: #ffffff;
     }
 
    .frb-message-text {
 
        padding: 48px 72px;
 
    }
 
 
}
 
}
  
@media (min-height: 1000px) {
+
#WMDE_Banner-payment .btn-payment-type {
     .frb-message {
+
     background: #f8f9fa;
        font-size: 24px;
+
    font-size: 0.9em;
     }
+
     color: #3366cc;
    .frb-message-text {
 
        padding: 48px 72px;
 
    }
 
 
}
 
}
  
.frb-message-text p {
+
/* --- Frequency Buttons --- */
    margin-bottom: 10px;
 
}
 
  
.frb-message-text p:last-child {
+
#WMDE_Banner-frequency li {
     margin-bottom: 0;
+
    display: table-cell;
 +
    width: 33%;
 +
    padding: 0 2% 0 0;
 +
     vertical-align: top;
 
}
 
}
 +
body.rtl #WMDE_Banner-frequency li { padding: 0 0 0 2%; }
  
 
+
#WMDE_Banner-frequency label {
/* Call to action */
+
     width: 100%;
.frb-cta {
 
     text-align: center;
 
    background: #990000;
 
    color: #fff;
 
    padding: 10px;
 
    font-weight: 400;
 
    font-size: 24px;
 
 
     display: block;
 
     display: block;
     margin: auto;
+
     font-size: .9em;
    width: 100%;
 
    position: relative;
 
 
}
 
}
  
@media (min-height: 1000px) {
+
/*@media (min-width : 1100px) { #WMDE_Banner-frequency label { font-size: .95em; } }*/
    .frb-cta {
+
@media (min-width : 1200px) {
        padding: 27px;
+
     /*#WMDE_Banner-frequency label {
    }
+
         font-size: 1em;
}
+
    }*/
@media (min-width : 1100px) {
+
    /*#WMDE_Banner-payment .WMDE_Banner-btn {
     .frb-cta {
+
        min-height: 2em !important;
         font-size: 33px;
 
 
     }
 
     }
 +
    .WMDE_Banner-btn {
 +
        padding: 4px 0;
 +
    }*/
 
}
 
}
  
.frb-cta:after {
+
#WMDE_Banner-frequency input[type="radio"] {
 +
    border: 0;
 +
    clip: rect(0 0 0 0);
 +
    height: 1px;
 +
    margin: -1px;
 +
    overflow: hidden;
 +
    padding: 0;
 
     position: absolute;
 
     position: absolute;
     left: 50%;
+
     width: 1px;
    top: 100%;
 
    height: 0;
 
    width: 0;
 
    margin-left: -10px;
 
    content: " ";
 
    border: solid transparent;
 
    border-top-color: #990000;
 
    border-width: 10px;
 
    pointer-events: none;
 
 
}
 
}
  
 +
/* --- Amount Buttons --- */
  
/* --- Form --- */
+
#WMDE_Banner-amounts legend {
 +
    display: block;
  
#frb-donation-form {
 
    position: relative;
 
    background: #fff;
 
    padding: 1.5em 1.5em 0em;
 
    clear: both;
 
 
}
 
}
  
@media (min-width: 768px) {
+
#WMDE_Banner-amounts li {
  #frb-donation-form {
+
    display: table-cell;
        padding: 2em 2em 1em 2em;
+
     width: 23%;
    }
+
     height: 100%;
}
 
 
 
#frb-donation-form:before {
 
    position: absolute;
 
     left: 50%;
 
    top: 0;
 
     height: 0;
 
    width: 0;
 
    margin-left: -10px;
 
    content: " ";
 
    border: solid transparent;
 
    border-top-color: #990000;
 
    border-width: 10px;
 
    pointer-events: none;
 
}
 
 
 
/* --- Form legends --- */
 
 
 
#frb-donation-form legend {
 
    width: 100%;
 
    margin: 0 0 .5em;
 
    text-align: center;
 
    font-size: 16px;
 
    text-transform: uppercase;
 
    color: #222;
 
}
 
 
 
@media (min-width : 768px) { #frb-donation-form legend { font-size: 18px; } }
 
 
 
/* --- Amount buttons layout --- */
 
.frb-amounts ul li {
 
    display: block;
 
    width: 49%;
 
 
     clear: none;
 
     clear: none;
     float: left;
+
     padding: 0 2% 0 0;
     margin-bottom: 6px;
+
     vertical-align: top;
     margin-right: 2%;
+
     font-weight: bold;
 
}
 
}
 
+
body.rtl #WMDE_Banner-amounts li {
body.rtl .frb-amounts ul li {
+
     padding: 0 0 0 2%;
     float: right;
 
    margin-right: 0;
 
    margin-left: 2%;
 
 
}
 
}
  
@media (min-width : 570px) { .frb-amounts ul li { margin-bottom: 10px; } }
+
/* Chrome specific - need to be floated for height 100% to work */
 
+
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Very small screen layout, 2 amount buttons per row */
+
     #WMDE_Banner-amounts li { float: left; }
@media (max-width: 374px) {
+
     body.rtl #WMDE_Banner-amounts li { float: right; }
 
 
     body.ltr .frb-amounts ul li:nth-child(2n) {
 
        margin-right: 0;
 
    }
 
 
 
     body.rtl .frb-amounts ul li:nth-child(2n) {
 
        margin-left: 0;
 
    }
 
 
 
 
}
 
}
  
/* Larger screen layout, 4 amount buttons per row */
+
#WMDE_Banner-amounts li input[type="radio"] {
@media (min-width: 375px) {
 
 
 
    .frb-amounts ul li {
 
        width: 31.8333333%;
 
        margin-right: 1.5%;
 
    }
 
 
 
    body.rtl .frb-amounts ul li {
 
        margin-right: 0;
 
        margin-left: 1.5%;
 
    }
 
 
 
    body.ltr .frb-amounts ul li:nth-child(3n) {
 
        margin-right: 0;
 
    }
 
 
 
    body.rtl .frb-amounts ul li:nth-child(3n) {
 
        margin-left: 0;
 
    }
 
 
 
}
 
 
 
/* --- Amount buttons appearance --- */
 
 
 
.frb-amounts li input[type="radio"] {
 
    /* Based on http://jqueryui.com/button/#radio */
 
 
     border: 0;
 
     border: 0;
 
     clip: rect(0 0 0 0);
 
     clip: rect(0 0 0 0);
Zeile 265: Zeile 185:
 
}
 
}
  
.frb-amounts li label {
+
#WMDE_Banner-amounts label {
    display: block;
+
     font-size: .9em;
    width: 100%;
+
     text-transform: none;
    padding: 24px;
 
    line-height: 40px;
 
     font-size: 1.1em;
 
    font-style: normal;
 
    font-weight: bold;
 
     text-align: center;
 
    background: #f8f9fa;
 
    border: 1px solid #9aa0a7;
 
    border-radius: 4px;
 
    color: #000;
 
    cursor: pointer;
 
}
 
 
 
.frb-amounts li label:active {
 
    background-color: #d9d9d9;
 
 
}
 
}
  
 +
/*@media (min-width : 800px)  { #WMDE_Banner-amounts .predefined_amount { font-size: 1em; } }
 +
@media (min-width : 1100px) { #WMDE_Banner-amounts .predefined_amount { font-size: 1.1em; } }*/
  
@media (min-width: 768px) {
+
/* --- Other Amount --- */
  .frb-amounts li label {
 
      font-size: 28px;
 
  }
 
}
 
  
#frb-form input[type="radio"]:checked + .frb-btn, #frb-form .frb-btn.checked {
+
#amount_custom .WMDE_Banner-btn {
     background-color: #2a4b8d;
+
     display: inline-block;
     color: #fff;
+
    height: 100%;
     border-color: #7d8389;
+
     width: 100%;
 +
     padding: 0.2em 0 0.4em 0;
 
}
 
}
  
.frb-amounts li input[type="radio"]:checked + label,
+
#amount_custom label {
.frb-amounts li input[type="radio"].checked + label {
+
    display: block;
     background-color: #2a4b8d;
+
    height: auto;
     color: #fff;
+
    margin-bottom: 0.2em;
     border-color: #7d8389;
+
     font-size: .7em;
 +
     line-height: 1;
 +
     cursor: pointer;
 
}
 
}
  
/* --- Other amount --- */
+
#amount_custom input {
 
+
     width: 85%;
#frb-amt-other-input {
+
     font-size: .9em;
     margin: 0;
+
     padding: 11px .4em;
     padding: 0;
 
     background: transparent;
 
    border: none;
 
    width: 90%;
 
    color: #222222;
 
 
     text-align: center;
 
     text-align: center;
    direction: ltr;
+
     border: 1px solid #9aa0a7;
     border-radius: 0;
+
     margin: 0 1px;
    padding-left: 5%;
 
}
 
 
 
 
 
#frb-amt-other-input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
 
    color: #222222;
 
}
 
#frb-amt-other-input::-moz-placeholder { /* Firefox 19+ */
 
     color: #222222;
 
}
 
#frb-amt-other-input:-moz-placeholder { /* Firefox 18- */
 
    color: #222222;
 
}
 
#frb-amt-other-input:-ms-input-placeholder { /* IE 10+ */
 
    color: #222222;
 
}
 
 
 
/* Placeholder focus styles */
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input:focus::-webkit-input-placeholder { /* Chrome/Opera/Safari */
 
    color: #fff;
 
}
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input:focus:-moz-placeholder { /* Firefox 18- */
 
    color: #fff;
 
    opacity: 1 !important;
 
}
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input:focus::-moz-placeholder { /* Firefox 19+ */
 
    color: #fff;
 
    opacity: 1 !important;
 
}
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input:focus:-ms-input-placeholder { /* IE 10+ */
 
    color: #fff;
 
}
 
 
 
/* Placeholder checked styles */
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
 
    color: #fff;
 
}
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input:-moz-placeholder { /* Firefox 18- */
 
    color: #fff;
 
}
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input::-moz-placeholder { /* Firefox 19+ */
 
    color: #fff;
 
}
 
.frb-amounts input[type="radio"]:checked + #frb-amt-other-label #frb-amt-other-input:-ms-input-placeholder { /* IE 10+ */
 
    color: #fff;
 
 
}
 
}
  
#frb-amt-other-label {
+
#amount_custom .checked input {
     border: 1px solid #9aa0a7;
+
     background: #2a4b8d;
     color: #555;
+
     color: #ffffff;
    padding-left: 3px;
 
 
}
 
}
  
#frb-amt-other:checked + #frb-amt-other-label #frb-amt-other-input {
+
#amount_custom input:hover {
     color: #FFFFFF;
+
    box-shadow: 0 0 0 1px #3366cc inset;
 +
    background-color: #ffffff;
 +
    color: #444444;
 +
     border-color: #a2a9b1;
 
}
 
}
  
 +
/* --- Payment method Buttons --- */
  
/* --- Payment method buttons layout --- */
+
#WMDE_Banner-payment {
 
+
     padding-bottom: 0.25em;
 
 
/* "Phone" layout, full width stacked */
 
@media (max-width: 767px) {
 
     .frb-submit li {
 
        width: 100%;
 
        margin-bottom: 6px;
 
    }
 
 
 
    #frb-window li.frb-submit {
 
        display: block;
 
        margin: 0;
 
    }
 
 
}
 
}
  
/* "Tablet" layout, next to each other */
+
#WMDE_Banner-payment ul li {
@media (min-width: 768px) {
+
     display: table-cell;
     .frb-submit ul {
+
    padding: 0 2% 0 0;
        display: table;
+
     vertical-align: top;
        table-layout: fixed;
+
    width: 50%;
        width: 100%;
+
    margin-bottom: 4px;
     }
 
    .frb-submit ul li {
 
        display: table-cell;
 
        padding: 0 10px;
 
        vertical-align: top;
 
    }
 
 
}
 
}
 
+
body.rtl #WMDE_Banner-payment ul li {
 
+
    padding: 0 0 0 2%;
@media (min-width : 570px) {
 
    .frb-submit li {
 
        margin-bottom: 10px;
 
    }
 
 
}
 
}
  
/* --- Payment method buttons appearance --- */
+
#WMDE_Banner-window button {
 
 
.frb-submit .frb-btn {
 
    display: inline-block;
 
 
     width: 100%;
 
     width: 100%;
     padding: 0.8em 0.4em;
+
     height: 100%;
    font-size: 1.1em;
 
    line-height: 1;
 
    text-transform: uppercase;
 
    text-align: center;
 
    border: 1px solid #9aa0a7;
 
    border-radius: 4px;
 
    color: #36c;
 
    background-color: #f8f9fa;
 
    background-size: auto 50%;
 
    background-repeat: no-repeat;
 
    background-position: center center;
 
    cursor: pointer;
 
}
 
 
 
@media (min-width: 768px) {
 
    .frb-submit .frb-btn {
 
        min-height: 3.6em;
 
    }
 
}
 
 
 
.frb-submit .frb-btn:hover {
 
    background-color: #fff;
 
}
 
 
 
.frb-submit .frb-btn:active {
 
    background-color: #d9d9d9;
 
    color: #2a4b8d;
 
}
 
 
 
/* Payment logos */
 
.frb-submit .paymentmethod-pp {
 
    text-indent: -99999px;
 
    background-image: url('//upload.wikimedia.org/wikipedia/donate/8/8d/Paypal-color.svg');
 
}
 
 
 
/* --- Smallprint --- */
 
 
 
.frb-bankinfo {
 
    text-align: center;
 
    margin-top: 1em;
 
 
     font-size: .9em;
 
     font-size: .9em;
 +
    float: none;
 +
    font-family: inherit;
 
}
 
}
  
.frb-bankinfo span {
+
@media all and (min-width: 1px) and (max-width: 900px), all and (min-width: 1050px) and (max-width: 1200px) {
     white-space: nowrap;
+
  #WMDE_Banner-payment .btn-payment-type {
 +
     min-height: 4em;
 +
  }
 
}
 
}
  
.frb-footer {
+
@media all and (min-width: 1px) and (max-width: 1050px) {
 +
  #WMDE_Banner-payment ul {
 +
    margin: 0;
 
     width: 100%;
 
     width: 100%;
    font-size: 75%;
+
  }
    padding: 1em 20px;
 
    background: #e2e2e2;
 
    text-align: center;
 
    color: #3c3c3c;
 
}
 
 
 
 
 
/* --- Top bar --- */
 
  
.frb-topbar {
+
  #WMDE_Banner-payment ul li {
    background: #000;
 
 
     display: block;
 
     display: block;
    z-index: 999;
 
    color: #fff;
 
    font-size: 14px;
 
    text-transform: uppercase;
 
    text-align: right;
 
 
     width: 100%;
 
     width: 100%;
 +
  }
 
}
 
}
  
@media (min-width: 375px) {
+
#WMDE_Banner div.active {
     .frb-topbar {
+
     text-decoration: underline;
        font-size: 16px;
+
    border-bottom: none;
     }
+
     background: transparent;
 
}
 
}
  
.frb-close,
+
#WMDE_Banner .highlight {
.frb-rml1-link {
+
     background-color: #ffdd5b;
     display: inline-block;
+
     color: #000000;
    padding: 8px;
 
    cursor: pointer;
 
    z-index: 999;
 
    vertical-align: middle;
 
     color: #ccc;
 
 
}
 
}
  
.frb-close:hover,
+
/* --- Donation meter --- */
.frb-rml1-link:hover {
 
    color: #fff;
 
}
 
  
/*Hover*/
+
#WMDE_Banner #donationMeterWrapper {
.frb-close:hover .frb-close-x g {
+
    margin: 0 10px 10px 35px;
    stroke: #fff;
 
 
}
 
}
  
.frb-rml1-link {
+
#WMDE_Banner-close {
     width: 60%;
+
     background-image: url('//upload.wikimedia.org/wikipedia/commons/c/cb/Close_x_-_black.png');
    border-right: 1px solid #666;
+
     background-color: transparent;
}
+
     background-size: 12px auto;
body.rtl .frb-rml1-link {
 
     border-right: 0;
 
     border-left: 1px solid #666;
 
 
}
 
}
  
.frb-close {
+
#application-of-funds-link {
     width: 38%;
+
     cursor: pointer;
 +
    margin-left: 1.5em;
 
}
 
}
  
.frb-close-x {
+
#application-of-funds-link:hover {
     height: 14px;
+
     text-decoration: underline;
    width: 14px;
 
    margin-bottom: -2px;
 
 
}
 
}
  
@media screen and (min-width: 375px) {
+
#info-application-of-funds {
     .frb-close-x {
+
    width: 720px;
        margin-bottom: -1px;
+
     margin-top: -5px;
    }
 
 
}
 
}
  
.frb-close.bottom {
+
#info-application-of-funds hr {
    text-align: center;
+
     margin: 1.4em 0;
    color: white;
 
    display: inline-block;
 
    width: auto;
 
     margin: auto;
 
    z-index: 999;
 
    color: #fff;
 
    font-size: 13px;
 
    padding: 13px;
 
    text-transform: uppercase;
 
    cursor: pointer;
 
 
}
 
}
  
.frb-close.bottom:hover {
+
#info-application-of-funds-footer {
     color: #fff;
+
     font-size: 0.8em;
 
}
 
}
  
@media (min-width: 768px) {
+
#info-application-of-funds-footer div {
    .frb-close.bottom {
+
     width: 49%;
        display: none;
+
     display: inline-block;
    }
 
}
 
 
 
 
 
/* Bottom "reminder" banner styles
 
------------------------------------ */
 
 
 
#frb-nag {
 
    z-index: 100;
 
    position: fixed;
 
    left: 0;
 
    bottom: -100%;
 
     width: 100%;
 
     display: block;
 
    color: black;
 
    background-color: white;
 
    padding: 10px 20px;
 
 
     text-align: center;
 
     text-align: center;
    font-size: 15px;
 
    line-height: 1;
 
    font-weight: bold;
 
    border: 5px solid #990000;
 
    box-shadow: 0 0 10px rgba(0,0,0,.5);
 
    cursor: pointer;
 
    -webkit-transition: all .5s ease-in-out;
 
    -moz-transition:    all .5s ease-in-out;
 
    transition:        all .5s ease-in-out;
 
 
}
 
}
  
#frb-nag:hover {
+
#info-application-of-funds-footer a {
     text-decoration: none;
+
     color: #3366cc;
 
}
 
}
  
@media (min-width: 720px) {
+
</style>
    #frb-nag {
 
        font-size: 17px;
 
    }
 
}
 
  
#frb-nag.reveal {
+
<div id="WMDE_Banner">
    bottom: 0;
+
  <div style="box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);">
}
+
    <form id="WMDE_Banner-form" method="post" name="donationForm"
 +
          action="https://spenden.wikimedia.de/donation/new?piwik_campaign={{{CampaignName}}}&piwik_kwd={{{BannerName}}}">
 +
      <table id="WMDE_Banner-facts">
 +
        <tbody>
 +
        <tr>
 +
          <td>
 +
            <table style="height: 100%" id="WMDE_Banner-message-wrapper">
 +
              <tbody>
 +
              <tr>
 +
                <td style="height: 1%" valign="top">
 +
                  <p id="WMDE_Banner-text-salute">{{{banner-text-salutation}}}</p>
 +
                  <p id="WMDE_Banner-text">{{{banner-text}}}</p>
 +
                </td>
 +
              </tr>
 +
              <tr>
 +
                <td style="vertical-align:middle;" valign="center">
 +
{{MediaWiki:WMDE_FR2016/Resources/ProgressBar
 +
| size=32
 +
| tip-type=round
 +
| minFillWidth=100
 +
| border-color=#FFDD5B
 +
| fill-color=#FFDD5B
 +
| background-color=#000000
 +
| text-color-inner=#000000
 +
| text-color-outer=#FFFFFF
 +
| margin=40px 0
 +
| text-inner-left=Nur noch <span id="numDaysLeft">1 Tag</span>
 +
}}
  
#frb-nag img {
+
                </td>
    height: 17px;
+
              </tr>
    width: 17px;
+
              <tr>
}
+
                <td style="height: 1%; vertical-align: bottom;">
 +
                  <div id="WMDE_Banner_info">
 +
                    <div style="float: right;">
 +
                            <span id="application-of-funds-link" data-href="#info-application-of-funds">Wohin&nbsp;geht&nbsp;meine&nbsp;Spende?</span>
 +
                    </div>
 +
                    <div>
 +
                      <span class="binfo-ucase">Spendenkonto</span>
 +
                      <span>Wikimedia Foerdergesellschaft</span>
 +
                      <span>BIC</span>
 +
                      <span class="binfo-bold">BFSWDE33BER</span>
 +
                      <span>IBAN&nbsp;<span class="binfo-bold" style="margin: 0 0 0 10px;">DE33&nbsp;1002&nbsp;0500&nbsp;0001&nbsp;1947&nbsp;00</span></span>
 +
                    </div>
 +
                  </div>
 +
                </td>
 +
              </tr>
 +
              </tbody>
 +
            </table>
 +
          </td>
  
#frb-nag .frb-btn {
+
          <td id="WMDE_BannerForm-wrapper">
    display: inline-block;
+
            <fieldset id="WMDE_Banner-frequency" class="cf">
    font-size: 12px;
+
              <div style="padding-top: 0.5em;" class="interval-options">
    padding: 3px 6px;
+
                <ul>
}
+
                  <li>
 +
                    <input type="radio" id="interval_multiple" />
 +
                    <label class="WMDE_Banner-btn donation-frequency" for="interval_onetime">
 +
                      <input type="radio" id="interval_onetime">
 +
                      einmalig
 +
                    </label>
 +
                  </li>
 +
                  <li>
 +
                    <label class="WMDE_Banner-btn donation-interval" for="interval1">
 +
                      <input type="radio" id="interval1" name="interval" value="1">
 +
                      monatlich
 +
                    </label>
 +
                  </li>
 +
                  <li>
 +
                    <label class="WMDE_Banner-btn donation-interval" for="interval12">
 +
                      <input type="radio" id="interval12" name="interval" value="12">
 +
                      jährlich
 +
                    </label>
 +
                  </li>
 +
                </ul>
 +
              </div>
 +
            </fieldset>
  
.frb-nag-message {
+
            <fieldset id="WMDE_Banner-amounts" class="cf">
    vertical-align: middle;
+
              <ul>
    margin-bottom: 8px;
+
                <li id="amount_total_1">
    line-height: 1.1;
+
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_1" value="5">
}
+
                  <label id="amount_label_1" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_1">5 €</label>
.frb-nag-message:hover {
+
                </li>
    text-decoration: underline;
 
}
 
  
.frb-nag-close {
+
                <li id="amount_total_2">
    display: block;
+
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_2" value="15">
    border: 2px solid black;
+
                  <label id="amount_label_2" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_2">15 €</label>
    position: absolute;
+
                </li>
    top: -20px;
 
    right: -5px;
 
    width: 35px;
 
    height: 35px;
 
    padding: 5px;
 
    background: white url('//upload.wikimedia.org/wikipedia/donate/8/84/Close-dark-trilogy.png') no-repeat center center;
 
    background-size: 50%;
 
    cursor: pointer;
 
    border-radius: 50%;
 
    box-shadow: 0 0 10px rgba(0,0,0,.3);
 
    -webkit-transition: all .25s ease-in-out;
 
    -moz-transition:    all .25s ease-in-out;
 
    transition:        all .25s ease-in-out;
 
}
 
body.rtl .frb-nag-close {
 
    right: auto;
 
    left: -5px;
 
}
 
.frb-nag-close:active {
 
    -moz-transform:    scale(1.05);
 
    -ms-transform:    scale(1.05);
 
    -webkit-transform: scale(1.05);
 
    transform:        scale(1.05);
 
}
 
  
#frb-nag .frb-nag-message2 {
+
                <li id="amount_total_3">
    display: none;
+
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_3" value="25">
}
+
                  <label id="amount_label_3" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_3">25 €</label>
 +
                </li>
  
/*!--- Focus styles ----*/
+
                <li id="amount_total_4">
 +
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_4" value="50">
 +
                  <label id="amount_label_4" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_4">50 €</label>
 +
                </li>
 +
              </ul>
 +
              <ul>
 +
                <li id="amount_total_5">
 +
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_5" value="75">
 +
                  <label id="amount_label_5" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_5">75 €</label>
 +
                </li>
  
/*Outline reset*/
+
                <li id="amount_total_6">
.frb-close:focus,
+
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_6" value="100">
.frb-rml1-link:focus,
+
                  <label id="amount_label_6" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_6">100 €</label>
.frb-rml1-form input:focus,
+
                </li>
.frb-rml2-form input:focus,
 
.frb-btn:focus,
 
.frb-btn-submit:focus,
 
.frb-frq-switch:focus,
 
#frb-amt-other-input:focus {
 
    outline: 0;
 
}
 
  
.frb-rml2-form input:focus,
+
                <li id="amount_total_7">
.frb-frq-switch.is-active,
+
                  <input type="radio" name="betrag_auswahl" id="field-amount_total_7" value="250">
.frb-btn:focus,
+
                  <label id="amount_label_7" class="WMDE_Banner-btn predefined_amount" for="field-amount_total_7">250 €</label>
.frb-rml2-form input:focus,
+
                </li>
.frb-amounts input[type="radio"]:focus + label,
 
.frb-amounts input[type="radio"]:focus + .frb-btn {
 
    border-color: #36c !important;
 
    box-shadow: inset 0 0 0 1px #36c;
 
}
 
  
/*Exception because of black background*/
+
                <li id="amount_custom">
.frb-rml1-form input:focus {
+
                  <input type="text" name="amountGiven" id="amount-other-input" size="3" autocomplete="off" value="" placeholder="anderer">
    box-shadow: inset 0 0 0 1px #FFFFFF, inset 0 0 0 1px #36c;
+
                </li>
}
+
              </ul>
 +
            </fieldset>
  
/*Focus styles*/
+
            <fieldset id="WMDE_Banner-payment" class="cf">
.frb-close:focus,
+
              <ul>
.frb-rml1-link:focus {
+
                <li>
    box-shadow: inset 0 0 0 2px #000, inset 0 0 0 4px #36c;
+
                  <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('BEZ');">
}
+
                    Lastschrift
 +
                  </button>
 +
                </li>
  
.frb-btn-submit:focus,
+
                <li>
.frb-amounts input[type="radio"]:checked + label:focus,
+
                  <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('UEB');">
.frb-amounts input[type="radio"]:checked + .frb-btn:focus,
+
                    Überweisung
.frb-amounts input[type="radio"]:checked:focus + label,
+
                  </button>
.frb-amounts input[type="radio"]:checked:focus + .frb-btn,
+
                </li>
.frb-amt-other.is-focused .frb-btn {
+
              </ul>
    border-color: #36c;
+
              <ul>
    box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
+
                <li>
}
+
                  <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('MCP');">
 +
                    Kreditkarte
 +
                  </button>
 +
                </li>
  
.frb-close:focus,
+
                <li>
.frb-rml1-link:focus {
+
                  <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('PPL');">
    color: #fff;
+
                    PayPal
}
+
                  </button>
 +
                </li>
  
.frb-close:focus .frb-close-x g {
+
              </ul>
    stroke: #fff;
+
            </fieldset>
}
+
            <span id="WMDE_Banner-close" style="position: absolute; right: 0;">&nbsp;</span>
 
+
          </td>
</style>
 
  
<div id="frb" class="frb" style="display: none;">
+
        </tr>
 +
        </tbody>
 +
      </table>
  
     <div id="frb-mask"></div>
+
      <input type="hidden" id="periode" name="periode" value="0"/>
 +
      <input type="hidden" id="intervalType" name="intervalType" value="0"/>
 +
      <input type="hidden" id="impCount" name="impCount" value=""/>
 +
      <input type="hidden" id="bImpCount" name="bImpCount" value=""/>
 +
      <input type="hidden" id="zahlweise" name="zahlweise" value=""/>
 +
     </form>
 +
  </div>
 +
  <img id="WMDE_Banner-close-ct" src="//upload.wikimedia.org/wikipedia/commons/c/ce/Transparent.gif" border="0" height="0" width="0">
 +
</div>
 +
<div class="wlightbox-contents">
 +
  <div id="donationperiodInfo">
 +
      <div class="container"><ul class="checks">
 +
        <li>Jederzeit und ab sofort kündbar. Eine formlose E-Mail genügt.</li>
 +
        <li>Betrag und Zahlungsintervall problemlos änderbar.</li>
 +
        <li>Vergrößerte Planungssicherheit und Nachhaltigkeit.</li>
 +
        <li>Automatischer Versand der Zuwendungsbestätigung. </li>
 +
        <li>Auf Wunsch Versand unseres Tätigkeitsberichts.</li>
 +
        </ul>
 +
      </div>
 +
  </div>
 +
</div>
  
     <div id="frb-window" style="z-index: 1001;">
+
<div class="wlightbox-contents">
 +
     <div id="info-application-of-funds">
 +
        <div class="wlightbox-title clearfix">
 +
            <span class="icon-bar-chart wlightbox-icon"></span>Wohin geht meine Spende?
  
        <div class="frb-topbar">
+
            <a href="http://wikimedia.de/wiki/Transparenz" target="_blank"><span class="logo-itz-white f-right no-margin"></span></a>
 +
        </div>
  
            <span class="frb-close" tabindex="0">
+
        <p>
                {{int:Centralnotice-close-title}}
+
            <img src="//upload.wikimedia.org/wikipedia/commons/8/8a/WMDE-application-of-funds-diagram-2017.png" />
                <svg class="frb-close-x" role="img" aria-labelledby="frb-close-x-title" width="11" height="11" viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg"><title>{{int:Centralnotice-close-title}}</title><g stroke="#CCC" fill="none" fill-rule="evenodd" stroke-linecap="round"><path d="M2 2l7 7M9 2L2 9"/></g></svg>
+
        </p>
            </span>
 
  
 +
        <div>
 +
            <img src="//upload.wikimedia.org/wikipedia/commons/0/00/WMDE-application-of-funds-2017.svg" />
 
         </div>
 
         </div>
  
         <div class="frb-message">
+
         <hr/>
  
            <div class="frb-message-text">
+
        <div id="info-application-of-funds-footer">
                <p>{{int:Centralnotice-B16_WMCH_translations-text-greeting}}</p>
+
            <div>
                 <p>{{int:Centralnotice-B16_WMCH_translations-text-main-long}}</p>
+
                 <a id="link-wmf-annual-plan" href="https://meta.wikimedia.org/wiki/Wikimedia_Foundation_Annual_Plan/2016-2017/Final" target="_blank">Erfahren Sie mehr zum Jahresplan<br>der Wikimedia Foundation</a>
                <p><i>{{int:Centralnotice-B16_WMCH_translations-text-thank-you-long}}</i></p>
 
 
             </div>
 
             </div>
 
+
             <div>
             <div class="frb-cta">
+
                 <a id="link-wmde-annual-plan" href="https://meta.wikimedia.org/wiki/Wikimedia_Deutschland/Jahresplanung_2017/Ziele,_Indikatoren_und_Wirtschaftsplan" target="_blank">Erfahren Sie mehr zum Jahresplan<br>von Wikimedia Deutschland</a>
                 {{int:Centralnotice-B16_WMCH_translations-now-is-the-time}}
 
 
             </div>
 
             </div>
 
        </div><!--frb-message-->
 
 
        <div class="frb-bottom">
 
 
        <form id="frb-donation-form" method="GET" name="donationForm">
 
     
 
            <input type="hidden" name="utm_medium" value="sitenotice">
 
            <input type="hidden" name="utm_campaign" value="{{{campaign}}}">
 
            <input type="hidden" name="utm_source" value="{{{banner}}}">
 
     
 
            <!-- PayPal -->
 
            <input type="hidden" class="paypal-field" name="cmd" value="_donations" />
 
            <input type="hidden" class="paypal-field" name="business" value="F4T8UMB5PVU9Q" />
 
            <input type="hidden" class="paypal-field" name="currency_code" value="CHF" />
 
            <input type="hidden" class="paypal-field" name="lc" value="de" />
 
            <input type="hidden" class="paypal-field" name="item_name" value="Spende an Wikimedia" />
 
     
 
            <fieldset class="frb-amounts cf">
 
     
 
                <legend>{{int:Centralnotice-B16_WMCH_translations-select-amount}}</legend>
 
     
 
                <ul>
 
     
 
                    <li class="amount-btn" id="amount_total_1">
 
                        <input name="amount" type="radio" id="amount1" value="5">
 
                        <label id="amount_label_1" for="amount1">5.-</label>
 
                    </li>
 
     
 
                    <li class="amount-btn" id="amount_total_2">
 
                        <input name="amount" type="radio" id="amount2" value="20">
 
                        <label id="amount_label_2" for="amount2">20.-</label>
 
                    </li>
 
     
 
                    <li class="amount-btn" id="amount_total_3">
 
                        <input name="amount" type="radio" id="amount3" value="50">
 
                        <label id="amount_label_3" for="amount3">50.-</label>
 
                    </li>
 
     
 
                    <li class="amount-btn" id="amount_total_4">
 
                        <input name="amount" type="radio" id="amount4" value="100">
 
                        <label id="amount_label_4" for="amount4">100.-</label>
 
                    </li>
 
     
 
                    <li class="amount-btn" id="amount_total_5">
 
                        <input name="amount" type="radio" id="amount5" value="200">
 
                        <label id="amount_label_5" for="amount5">200.-</label>
 
                    </li>
 
     
 
                    <li class="frb-amt-other">
 
                        <input name="amount" type="radio" id="frb-amt-other" value="Other">
 
                        <label id="frb-amt-other-label" onclick="$('#frb-amt-other').prop('checked', true);">
 
                        <input type="number" min="0" step="0.01" name="amountGiven" id="frb-amt-other-input" placeholder="{{int:Centralnotice-FR2015_translations-other}}" autocomplete="off" onfocus="$('#amountother').prop('checked', true);">
 
                        </label>
 
                    </li>
 
     
 
                </ul>
 
     
 
            </fieldset>
 
     
 
            <fieldset class="frb-submit cf">
 
     
 
                <legend>{{int:Centralnotice-B16_WMCH_translations-select-payment-method}}</legend>
 
     
 
                <ul>
 
     
 
                    <li>
 
                        <button class="frb-btn paymentmethod-cc">
 
                            {{int:Centralnotice-FR2015_translations-pm-creditcard}}
 
                        </button>
 
                    </li>
 
     
 
                    <li>
 
                        <button class="frb-btn paymentmethod-pp">
 
                            {{int:Centralnotice-FR2015_translations-pm-paypal}}
 
                        </button>
 
                    </li>
 
     
 
                    <li>
 
                        <button class="frb-btn paymentmethod-slip">
 
                            {{int:Centralnotice-B16_WMCH_translations-paymentslip-text}}
 
                        </button>
 
                    </li>
 
     
 
                </ul>
 
     
 
                <div class="frb-bankinfo">
 
                    <span>Wikimedia CH, 8008 Zürich</span> /
 
                    <span>IBAN: CH13 0900 0000 85 359089 1</span>
 
                </div>
 
     
 
            </fieldset>
 
     
 
        </form>
 
 
        </div><!--frb-bottom-->
 
 
        <div class="frb-footer">
 
            {{int:Centralnotice-B16_WMCH_translations-privacy-text}}
 
 
         </div>
 
         </div>
  
        <span class="frb-close bottom">
+
    </div>
            {{int:Centralnotice-close-title}}
+
</div>
            <span class="frb-close-x"></span>
 
        </span>
 
  
 +
<script type="text/javascript">
 +
  $( '#interval_onetime' ).off( 'click' ).on( 'click', function () {
 +
      $( '#interval_multiple' ).prop( 'checked', false );
 +
      $( '.donation-interval' ).removeClass( 'checked' );
 +
  } );
  
     </div><!--frb-window-->
+
  $( '#WMDE_Banner-frequency' ).find( 'label' ).click( function () {
 +
     $( '#WMDE_Banner-frequency' ).find( 'label' ).removeClass( 'checked' );
 +
    $( this ).addClass( 'checked' );
 +
  } );
  
</div><!--frb-->
+
  $( '.donation-interval' ).click( function () {
 +
    $( '.donation-interval' ).removeClass( 'checked' );
 +
    $( this ).addClass( 'checked' );
 +
    $( '.donation-frequency' ).removeClass( 'checked' );
 +
    $( '#interval_onetime' ).prop( 'checked', false );
 +
    $( '#interval_multiple' ).prop( 'checked', 'checked' );
 +
  });
  
<!--frb-nag-->
+
  $( '#WMDE_Banner-amounts' ).find( 'label' ).click( function () {
<div id="frb-nag" class="frb" style="display:none;"><!-- the nag banner -->
+
    $( '#WMDE_Banner-amounts' ).find( 'label' ).removeClass( 'checked' );
     <div class="frb-nag-message">
+
     $( '#amount-other-input' ).parent().removeClass( 'checked' );
        <img src="//upload.wikimedia.org/wikipedia/donate/9/99/RedInfoI.svg" alt="Red info icon"> If everyone reading this donated %MINIMUM%, we could keep Wikipedia thriving for years to come.</div>
+
    $( this ).addClass( 'checked' );
    <div class="frb-nag-message2">Support Wikipedia</div>
+
  } );
    <button class="frb-btn frb-btn-btxt">{{int:Centralnotice-FR2015_translations-donate-now}}</button>
 
    <span class="frb-nag-close" tabindex="0"></span>
 
</div><!--frb-nag-->
 
  
<script>
+
  $( '#amount-other-input' ).click( function () {
/* Allow overriding country */
+
    $( '#WMDE_Banner-amounts' ).find( 'label' ).removeClass( 'checked' );
if( mw.util.getParamValue("country") ) {
+
     $( this ).parent().addClass( 'checked' );
     Geo.country = mw.util.getParamValue("country");
+
  } );
}
 
  
{{MediaWiki:FR2014/Resources/alterImpressionData.js}}
+
  function addSpace() {
 +
    if ( !$( '#WMDE_Banner' ).is( ':visible' ) ) {
 +
      return;
 +
    }
 +
    var bannerHeight = $( 'div#WMDE_Banner' ).height(),
 +
        skin = getSkin();
  
var frb = frb || {};
+
    switch ( skin ) {
 +
      case 'vector':
 +
        $( '#mw-panel' ).animate( {'top':bannerHeight + 160},1000 );
 +
        $( '#mw-head' ).animate( {'top':bannerHeight},1000 );
 +
        $( '#mw-page-base' ).animate( {'padding-top':bannerHeight},1000);
 +
      case 'minerva':
 +
        $( '#mw-mf-viewport' ).animate( {'top':bannerHeight},1000 );
 +
        break;
 +
    }
 +
  }
  
frb.showLargeBanner = function() {
+
  function addSpaceInstantly() {
     $('#content_wrapper').prepend($('#frb'));
+
     if ( !$( '#WMDE_Banner' ).is( ':visible' ) ) {
     $('#frb-window').css('top', $(window).scrollTop() + 20); // position banner where they have scrolled to
+
      return;
    $('#frb').show();
+
     }
};
+
    var bannerHeight = $( 'div#WMDE_Banner' ).height(),
 +
        skin = getSkin();
  
frb.validateForm = function() {
+
    switch ( skin ) {
    var form = document.donationForm;
+
      case 'vector':
     var error = false;
+
        $( '#mw-panel' ).css( { top: bannerHeight + 160 } );
 +
        $( '#mw-head' ).css( { top: bannerHeight } );
 +
        $( '#mw-page-base' ).css( { paddingTop: bannerHeight } );
 +
      case 'minerva':
 +
        $( '#mw-mf-viewport' ).css( { top: bannerHeight } );
 +
        break;
 +
     }
 +
  }
  
    // Get amount selection
+
  function displayBanner() {
    var amount = $('input[name=amount]:checked').val();
+
     if ( !showBanner ) {
    if( amount === 'Other' ) {
+
      return;
        amount = $('#frb-amt-other-input').val();
 
    }
 
    // Check amount is a real number
 
    error = ( amount == null || isNaN( amount ) || amount.value <= 0 );
 
    // Check amount is at least the minimum
 
    if ( amount < 1 || error ) {
 
        return false;
 
     } else if ( amount > 99999 ) {
 
        return false;
 
 
     }
 
     }
 +
 +
    var bannerElement = $( '#WMDE_Banner' ),
 +
        bannerHeight = bannerElement.height();
 +
    $( 'body' ).prepend( $( '#centralNotice' ) );
 +
    bannerElement.css( 'top', -bannerHeight );
 +
    bannerElement.css( 'display', 'block' );
 +
    addSpace();
 +
    bannerElement.animate( { top: 0 }, 1000 );
 +
    setTimeout( function () {
 +
      Banner.progressBar.animateProgressBar();
 +
    }, 1000 );
  
    // make sure the right field form has the amount
+
     $( window ).resize( function () {
     $('input[name=amount]:checked').val( amount );
+
      addSpaceInstantly();
 
+
      calculateLightboxPosition();
     return !error;
+
      Banner.progressBar.setProgressBarSize.apply( Banner.progressBar );
};
+
     } );
 +
  }
  
$(document).ready(function() {
+
  function calculateLightboxPosition() {
 +
      $( '#wlightbox' ).css( { right: ( $('body').width() - 750 ) / 2 + 'px', top: '20px', top: ( $( '#WMDE_Banner' ).height() + 20 ) + 'px' } );
 +
  }
  
     var donationForm = document.donationForm;
+
  function addMiniBanner() {
 +
    /* add the "nag" bar. Has to be done after we show the main banner (to get its height) */
 +
     var bigBannerHeight = $('#WMDE_Banner').height();
  
     $( '.paymentmethod-cc' ).click( function() {
+
     $( window ).scroll( function () {
        if( frb.validateForm() ) {
+
      if ( $( window ).scrollTop() <= bigBannerHeight ) {
            donationForm.action = '{{int:Centralnotice-B16_WMCH_translations-creditcard-link}}';
+
        $( '#WMDE_Banner-nag' ).finish();
            $( '#frb-donation-form > input.paypal-field' ).attr( 'disabled', 'disabled' );
+
        $( '#WMDE_Banner-nag' ).css( 'display', 'none' );
            donationForm.submit();
+
      } else {
        } else {
+
        // only show mini banner if no lightbox is visible
            alert( "{{int:Centralnotice-B16_WMCH_translations-amount-alert}}" );
+
        if ( !$( '#wlightbox' ).is(':visible') ) {
            return false;
+
          $( '#WMDE_Banner-nag' ).delay( 1500 ).slideDown();
 
         }
 
         }
 +
      }
 
     });
 
     });
  
     $( '.paymentmethod-pp' ).click( function() {
+
     $( '#WMDE_Banner-nag-close' ).click( function ( event ) {
        if( frb.validateForm() ) {
+
      $( '#WMDE_Banner-nag' ).remove();
            donationForm.action = 'https://www.paypal.com/cgi-bin/webscr';
+
      event.stopPropagation();
            $( '#frb-donation-form > input.paypal-field' ).attr( 'disabled', false );
 
            donationForm.lc.value = mw.config.get('wgUserLanguage'); // set to correct language
 
            donationForm.submit();
 
        } else {
 
            alert( "{{int:Centralnotice-B16_WMCH_translations-amount-alert}}" );
 
            return false;
 
        }
 
 
     });
 
     });
  
     $( '.paymentmethod-slip' ).click( function() {
+
     $( '#WMDE_Banner-nag' ).click( function () {
        donationForm.action = '{{int:Centralnotice-B16_WMCH_translations-paymentslip-link}}';
+
      window.scrollTo( 0, 0 );
        $( '#frb-donation-form > input.paypal-field' ).attr( 'disabled', 'disabled' );
 
        donationForm.submit();
 
 
     });
 
     });
 +
  }
  
    // Reset "other box" if they click a different amount
+
  $( document ).ready( function() {
    $('#amount1, #amount2, #amount3, #amount4, #amount5').click(function() {
+
    var lightboxOpened = false;
        $('#frb-amt-other-input').val('');
+
    $( '#WMDE_Banner-payment button' ).click( function( e ) {
     });
+
      return validateForm();
 +
     } );
  
     $('.frb-close').click(function() {
+
     $( '#interval_onetime' ).off( 'click' ) // remove handler from common-banner.js
        // Don't set a hide cookie here, as we expect them to always close this
+
      .on( 'click', function () {
        $("#frb").hide();
+
        $( '#interval_multiple' ).prop( 'checked', false );
     });
+
        $(".donation-interval").removeClass("checked");
 +
    } );
 +
 
 +
    var impCount = increaseImpCount();
 +
    $( '#impCount' ).val( impCount );
 +
     var bannerImpCount = increaseBannerImpCount( "{{{banner}}}" );
 +
    $( '#bImpCount' ).val( bannerImpCount );
  
     /* Close large banner when clicked outside */
+
     if ( mw.config.get( 'wgAction' ) === "view" ) {
    $('#frb-mask').on('click.bannerHide', function(e) {
+
      setTimeout( displayBanner, 7500 );
        if ($(e.target).closest("#frb-window").length === 0) {
+
    }
            $("#frb").hide();
+
    if ( mw.config.get( 'wgUserName' ) !== null ) {
            $(document).unbind('click.bannerHide');
+
      $( '#wikilogin' ).val( 'yes' );
        }
+
     }
     });
 
  
     /* Hide banner outside of main namespace (and Main Page, for sites where that isn't in main namespace) */
+
     $( 'span#numDaysLeft' ).text( getDaysRemaining() );
     if ( mw.config.get('wgNamespaceNumber') > 0 && !mw.config.get('wgIsMainPage') ) {
+
     $( 'span#weekday' ).text( getCurrentDayName( getCurrentGermanDay ) );
        mw.centralNotice.bannerData.hideResult = true;
+
    if ( getCurrentDayName( getCurrentGermanDay ) !== getCurrentGermanDay() ) {
        mw.centralNotice.bannerData.hideReason = 'namespace';
+
      $( '#weekdayPrepPhrase' ).text( 'am heutigen' );
 
     }
 
     }
 +
    $( 'span#campaignDay' ).text( getCampaignDayString() );
 +
    $( 'span#donorsValue' ).html( addPointsToNum( Math.floor( getApprDonatorsRaw() ) ) );
 +
    $( '.bannerImpressions').text( window.GlobalBannerSettings[ 'milion-impressions-per-day' ] );
 +
    $( '#campaignDaySentence' ).text( getCampaignDaySentence() );
  
     if (!mw.centralNotice.bannerData.hideResult) {
+
     if ( getDaysSinceCampaignStart() < 1 ) {
         frb.showLargeBanner();
+
        $( '#donationRemaining' ).text( 'Unser Spendenziel: ' + ( GlobalBannerSettings.goalSum / 1000000 ).toFixed( 1 ).replace( '.', ',' ) + ' Mio. €' );
 +
         $( '#donationText' ).html( '' );
 
     }
 
     }
  
});
+
    $( '#application-of-funds-link' ).wlightbox( { container: $( '#mw-page-base' ), right: ( $('body').width() - 750 ) / 2 + 'px', top: function() { return ( $( '#WMDE_Banner' ).height() + 20 ) + 'px'; } } );
 +
    $( '#application-of-funds-link' ).click( function ( e ) {
 +
        $( '#WMDE_Banner-close-ct' ).attr( 'src', 'https://tracking.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/application-of-funds-lightbox-opened/{{{BannerName}}}&rec=1' );
 +
    } );
 +
 
 +
    $( '#link-wmf-annual-plan' ).click( function ( e ) {
 +
        $( '#WMDE_Banner-close-ct' ).attr( 'src', 'https://tracking.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/wmf-annual-plan/{{{BannerName}}}&rec=1' );
 +
    } );
 +
 
 +
    $( '#link-wmde-annual-plan' ).click( function ( e ) {
 +
        $( '#WMDE_Banner-close-ct' ).attr( 'src', 'https://tracking.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/wmde-annual-plan/{{{BannerName}}}&rec=1' );
 +
    } );
 +
 
 +
  } );
 
</script>
 
</script>

Version vom 10. September 2018, 16:28 Uhr

<style type="text/css">MediaWiki:WMDE FR2015/Resources/DesktopBanner.css</style> <style type="text/css">MediaWiki:WMDE FR2015/Resources/icon.css</style> <style type="text/css">MediaWiki:WMDE FR2015/Resources/wlightbox.css</style> <script type="text/javascript">MediaWiki:WMDE FR2016/Resources/BannerValues.js</script> <script type="text/javascript">MediaWiki:WMDE FR2016/Resources/DesktopBanner.js </script> <script type="text/javascript">MediaWiki:WMDE FR2016/Resources/CountCampaignDays.js </script> <script type="text/javascript">MediaWiki:WMDE FR2015/Resources/CustomDayName.js</script> <script type="text/javascript">MediaWiki:WMDE FR2016/Resources/wlightbox.js</script> <style type="text/css">

 #WMDE_Banner-facts {
   background-color:#2b8156;
 }
 #WMDE_Banner_info {
   color: #ffffff;
 }
 #WMDE_Banner-text {
   text-align:left;
   color: #ffffff;
 }
 #WMDE_Banner-text-salute {
   color: #ffffff;
   font-size: 17px;
   font-weight: bold;
   line-height: 1.2em;
   margin: 4px 10px 4px 35px;
   text-align: justify;
   margin-bottom: 0;
   padding-bottom: 0;
 }
  1. WMDE_BannerForm-wrapper {
   background-color: #ffffff;
   padding: 0 10px;
 }
  1. WMDE_Banner-form fieldset {
   width: 95%;
   border: 0;
   margin: 0 auto;
   padding: 0 0.5em 0.5em 0.5em;

}

  1. WMDE_Banner-frequency ul,
  2. WMDE_Banner-amounts ul,
  3. WMDE_Banner-payment ul {
   width: 100%;
   height: 100%;
   display: table;
   margin: 0 0 0.3em;
   padding: 0;
   list-style: none;

}

  1. WMDE_Banner-form legend {
   display: none;
   width: 100%;
   margin: 0;
   padding: 0 0 0.3em 0;
   text-align: center;
   font-size: .9em;
   color: rgba(0,0,0,0.42);

}

/* --- Common Button Styles --- */

.WMDE_Banner-btn {

   background: #f8f9fa;
   border: 1px solid #9aa0a7;
   border-radius: 2px;
   padding: 11px 0;
   width: 100%;
   cursor: pointer;
   display: inline-block;
   margin: 0 1px;
   text-align: center;
   font-weight: bold;

}

.WMDE_Banner-btn:hover {

   background-color: #ffffff;
   color: #444444;
   border-color: #a2a9b1;

}

.WMDE_Banner-btn.checked {

   background: #2a4b8d;
   border-color: #7d8389;
   color: #ffffff;

}

  1. WMDE_Banner-payment .btn-payment-type {
   background: #f8f9fa;
   font-size: 0.9em;
   color: #3366cc;

}

/* --- Frequency Buttons --- */

  1. WMDE_Banner-frequency li {
   display: table-cell;
   width: 33%;
   padding: 0 2% 0 0;
   vertical-align: top;

} body.rtl #WMDE_Banner-frequency li { padding: 0 0 0 2%; }

  1. WMDE_Banner-frequency label {
   width: 100%;
   display: block;
   font-size: .9em;

}

/*@media (min-width : 1100px) { #WMDE_Banner-frequency label { font-size: .95em; } }*/ @media (min-width : 1200px) {

   /*#WMDE_Banner-frequency label {
       font-size: 1em;
   }*/
   /*#WMDE_Banner-payment .WMDE_Banner-btn {
       min-height: 2em !important;
   }
   .WMDE_Banner-btn {
       padding: 4px 0;
   }*/

}

  1. WMDE_Banner-frequency input[type="radio"] {
   border: 0;
   clip: rect(0 0 0 0);
   height: 1px;
   margin: -1px;
   overflow: hidden;
   padding: 0;
   position: absolute;
   width: 1px;

}

/* --- Amount Buttons --- */

  1. WMDE_Banner-amounts legend {
   display: block;

}

  1. WMDE_Banner-amounts li {
   display: table-cell;
   width: 23%;
   height: 100%;
   clear: none;
   padding: 0 2% 0 0;
   vertical-align: top;
   font-weight: bold;

} body.rtl #WMDE_Banner-amounts li {

   padding: 0 0 0 2%;

}

/* Chrome specific - need to be floated for height 100% to work */ @media screen and (-webkit-min-device-pixel-ratio:0) {

   #WMDE_Banner-amounts li { float: left; }
   body.rtl #WMDE_Banner-amounts li { float: right; }

}

  1. WMDE_Banner-amounts li input[type="radio"] {
   border: 0;
   clip: rect(0 0 0 0);
   height: 1px;
   margin: -1px;
   overflow: hidden;
   padding: 0;
   position: absolute;
   width: 1px;

}

  1. WMDE_Banner-amounts label {
   font-size: .9em;
   text-transform: none;

}

/*@media (min-width : 800px) { #WMDE_Banner-amounts .predefined_amount { font-size: 1em; } } @media (min-width : 1100px) { #WMDE_Banner-amounts .predefined_amount { font-size: 1.1em; } }*/

/* --- Other Amount --- */

  1. amount_custom .WMDE_Banner-btn {
   display: inline-block;
   height: 100%;
   width: 100%;
   padding: 0.2em 0 0.4em 0;

}

  1. amount_custom label {
   display: block;
   height: auto;
   margin-bottom: 0.2em;
   font-size: .7em;
   line-height: 1;
   cursor: pointer;

}

  1. amount_custom input {
   width: 85%;
   font-size: .9em;
   padding: 11px .4em;
   text-align: center;
   border: 1px solid #9aa0a7;
   margin: 0 1px;

}

  1. amount_custom .checked input {
   background: #2a4b8d;
   color: #ffffff;

}

  1. amount_custom input:hover {
   box-shadow: 0 0 0 1px #3366cc inset;
   background-color: #ffffff;
   color: #444444;
   border-color: #a2a9b1;

}

/* --- Payment method Buttons --- */

  1. WMDE_Banner-payment {
   padding-bottom: 0.25em;

}

  1. WMDE_Banner-payment ul li {
   display: table-cell;
   padding: 0 2% 0 0;
   vertical-align: top;
   width: 50%;
   margin-bottom: 4px;

} body.rtl #WMDE_Banner-payment ul li {

   padding: 0 0 0 2%;

}

  1. WMDE_Banner-window button {
   width: 100%;
   height: 100%;
   font-size: .9em;
   float: none;
   font-family: inherit;

}

@media all and (min-width: 1px) and (max-width: 900px), all and (min-width: 1050px) and (max-width: 1200px) {

 #WMDE_Banner-payment .btn-payment-type {
   min-height: 4em;
 }

}

@media all and (min-width: 1px) and (max-width: 1050px) {

 #WMDE_Banner-payment ul {
   margin: 0;
   width: 100%;
 }
 #WMDE_Banner-payment ul li {
   display: block;
   width: 100%;
 }

}

  1. WMDE_Banner div.active {
   text-decoration: underline;
   border-bottom: none;
   background: transparent;

}

  1. WMDE_Banner .highlight {
   background-color: #ffdd5b;
   color: #000000;

}

/* --- Donation meter --- */

  1. WMDE_Banner #donationMeterWrapper {
    margin: 0 10px 10px 35px;

}

  1. WMDE_Banner-close {
   background-image: url('//upload.wikimedia.org/wikipedia/commons/c/cb/Close_x_-_black.png');
   background-color: transparent;
   background-size: 12px auto;

}

  1. application-of-funds-link {
   cursor: pointer;
   margin-left: 1.5em;

}

  1. application-of-funds-link:hover {
   text-decoration: underline;

}

  1. info-application-of-funds {
   width: 720px;
   margin-top: -5px;

}

  1. info-application-of-funds hr {
   margin: 1.4em 0;

}

  1. info-application-of-funds-footer {
   font-size: 0.8em;

}

  1. info-application-of-funds-footer div {
   width: 49%;
   display: inline-block;
   text-align: center;

}

  1. info-application-of-funds-footer a {
   color: #3366cc;

}

</style>

   <form id="WMDE_Banner-form" method="post" name="donationForm"
         action="https://spenden.wikimedia.de/donation/new?piwik_campaign={{{CampaignName}}}&piwik_kwd={{{BannerName}}}">
<tbody> </tbody>
<tbody> </tbody>

{{{banner-text-salutation}}}

{{{banner-text}}}

MediaWiki:WMDE FR2016/Resources/ProgressBar

                           Wohin geht meine Spende?
                     Spendenkonto
                     Wikimedia Foerdergesellschaft
                     BIC
                     BFSWDE33BER
                     IBAN DE33 1002 0500 0001 1947 00
           <fieldset id="WMDE_Banner-frequency" class="cf">
  • <input type="radio" id="interval_multiple" />
           </fieldset>
           <fieldset id="WMDE_Banner-amounts" class="cf">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_1" value="5">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_2" value="15">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_3" value="25">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_4" value="50">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_5" value="75">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_6" value="100">
  • <input type="radio" name="betrag_auswahl" id="field-amount_total_7" value="250">
  • <input type="text" name="amountGiven" id="amount-other-input" size="3" autocomplete="off" value="" placeholder="anderer">
           </fieldset>
           <fieldset id="WMDE_Banner-payment" class="cf">
  • <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('BEZ');"> Lastschrift </button>
  • <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('UEB');"> Überweisung </button>
  • <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('MCP');"> Kreditkarte </button>
  • <button class="WMDE_Banner-btn btn-payment-type" onclick="$('#zahlweise').val('PPL');"> PayPal </button>
           </fieldset>
            
     <input type="hidden" id="periode" name="periode" value="0"/>
     <input type="hidden" id="intervalType" name="intervalType" value="0"/>
     <input type="hidden" id="impCount" name="impCount" value=""/>
     <input type="hidden" id="bImpCount" name="bImpCount" value=""/>
     <input type="hidden" id="zahlweise" name="zahlweise" value=""/>
   </form>
 
  • Jederzeit und ab sofort kündbar. Eine formlose E-Mail genügt.
  • Betrag und Zahlungsintervall problemlos änderbar.
  • Vergrößerte Planungssicherheit und Nachhaltigkeit.
  • Automatischer Versand der Zuwendungsbestätigung.
  • Auf Wunsch Versand unseres Tätigkeitsberichts.
           Wohin geht meine Spende?
           <a href="http://wikimedia.de/wiki/Transparenz" target="_blank"></a>

           

<script type="text/javascript">

 $( '#interval_onetime' ).off( 'click' ).on( 'click', function () {
      $( '#interval_multiple' ).prop( 'checked', false );
      $( '.donation-interval' ).removeClass( 'checked' );
 } );
 $( '#WMDE_Banner-frequency' ).find( 'label' ).click( function () {
   $( '#WMDE_Banner-frequency' ).find( 'label' ).removeClass( 'checked' );
   $( this ).addClass( 'checked' );
 } );
 $( '.donation-interval' ).click( function () {
   $( '.donation-interval' ).removeClass( 'checked' );
   $( this ).addClass( 'checked' );
   $( '.donation-frequency' ).removeClass( 'checked' );
   $( '#interval_onetime' ).prop( 'checked', false );
   $( '#interval_multiple' ).prop( 'checked', 'checked' );
 });
 $( '#WMDE_Banner-amounts' ).find( 'label' ).click( function () {
   $( '#WMDE_Banner-amounts' ).find( 'label' ).removeClass( 'checked' );
   $( '#amount-other-input' ).parent().removeClass( 'checked' );
   $( this ).addClass( 'checked' );
 } );
 $( '#amount-other-input' ).click( function () {
   $( '#WMDE_Banner-amounts' ).find( 'label' ).removeClass( 'checked' );
   $( this ).parent().addClass( 'checked' );
 } );
 function addSpace() {
   if ( !$( '#WMDE_Banner' ).is( ':visible' ) ) {
     return;
   }
   var bannerHeight = $( 'div#WMDE_Banner' ).height(),
       skin = getSkin();
   switch ( skin ) {
     case 'vector':
       $( '#mw-panel' ).animate( {'top':bannerHeight + 160},1000 );
       $( '#mw-head' ).animate( {'top':bannerHeight},1000 );
       $( '#mw-page-base' ).animate( {'padding-top':bannerHeight},1000);
     case 'minerva':
       $( '#mw-mf-viewport' ).animate( {'top':bannerHeight},1000 );
       break;
   }
 }
 function addSpaceInstantly() {
   if ( !$( '#WMDE_Banner' ).is( ':visible' ) ) {
     return;
   }
   var bannerHeight = $( 'div#WMDE_Banner' ).height(),
       skin = getSkin();
   switch ( skin ) {
     case 'vector':
       $( '#mw-panel' ).css( { top: bannerHeight + 160 } );
       $( '#mw-head' ).css( { top: bannerHeight } );
       $( '#mw-page-base' ).css( { paddingTop: bannerHeight } );
     case 'minerva':
       $( '#mw-mf-viewport' ).css( { top: bannerHeight } );
       break;
   }
 }
 function displayBanner() {
   if ( !showBanner ) {
     return;
   }

   var bannerElement = $( '#WMDE_Banner' ),
       bannerHeight = bannerElement.height();
   $( 'body' ).prepend( $( '#centralNotice' ) );
   bannerElement.css( 'top', -bannerHeight );
   bannerElement.css( 'display', 'block' );
   addSpace();
   bannerElement.animate( { top: 0 }, 1000 );
   setTimeout( function () {
     Banner.progressBar.animateProgressBar();
   }, 1000 );
   $( window ).resize( function () {
     addSpaceInstantly();
     calculateLightboxPosition();
     Banner.progressBar.setProgressBarSize.apply( Banner.progressBar );
   } );
 }
 function calculateLightboxPosition() {
     $( '#wlightbox' ).css( { right: ( $('body').width() - 750 ) / 2 + 'px', top: '20px', top: ( $( '#WMDE_Banner' ).height() + 20 ) + 'px' } );
 }
 function addMiniBanner() {
   /* add the "nag" bar. Has to be done after we show the main banner (to get its height) */
   var bigBannerHeight = $('#WMDE_Banner').height();
   $( window ).scroll( function () {
     if ( $( window ).scrollTop() <= bigBannerHeight ) {
       $( '#WMDE_Banner-nag' ).finish();
       $( '#WMDE_Banner-nag' ).css( 'display', 'none' );
     } else {
       // only show mini banner if no lightbox is visible
       if ( !$( '#wlightbox' ).is(':visible') ) {
         $( '#WMDE_Banner-nag' ).delay( 1500 ).slideDown();
       }
     }
   });
   $( '#WMDE_Banner-nag-close' ).click( function ( event ) {
     $( '#WMDE_Banner-nag' ).remove();
     event.stopPropagation();
   });
   $( '#WMDE_Banner-nag' ).click( function () {
     window.scrollTo( 0, 0 );
   });
 }
 $( document ).ready( function() {
   var lightboxOpened = false;
   $( '#WMDE_Banner-payment button' ).click( function( e ) {
     return validateForm();
   } );
   $( '#interval_onetime' ).off( 'click' ) // remove handler from common-banner.js
     .on( 'click', function () {
        $( '#interval_multiple' ).prop( 'checked', false );
        $(".donation-interval").removeClass("checked");
   } );
 
   var impCount = increaseImpCount();
   $( '#impCount' ).val( impCount );
   var bannerImpCount = increaseBannerImpCount( "{{{banner}}}" );
   $( '#bImpCount' ).val( bannerImpCount );
   if ( mw.config.get( 'wgAction' ) === "view" ) {
     setTimeout( displayBanner, 7500 );
   }
   if ( mw.config.get( 'wgUserName' ) !== null ) {
     $( '#wikilogin' ).val( 'yes' );
   }
   $( 'span#numDaysLeft' ).text( getDaysRemaining() );
   $( 'span#weekday' ).text( getCurrentDayName( getCurrentGermanDay ) );
   if ( getCurrentDayName( getCurrentGermanDay ) !== getCurrentGermanDay() ) {
     $( '#weekdayPrepPhrase' ).text( 'am heutigen' );
   }
   $( 'span#campaignDay' ).text( getCampaignDayString() );
   $( 'span#donorsValue' ).html( addPointsToNum( Math.floor( getApprDonatorsRaw() ) ) );
   $( '.bannerImpressions').text( window.GlobalBannerSettings[ 'milion-impressions-per-day' ] );
   $( '#campaignDaySentence' ).text( getCampaignDaySentence() );
   if ( getDaysSinceCampaignStart() < 1 ) {
       $( '#donationRemaining' ).text( 'Unser Spendenziel: ' + ( GlobalBannerSettings.goalSum / 1000000 ).toFixed( 1 ).replace( '.', ',' ) + ' Mio. €' );
       $( '#donationText' ).html(  );
   }
   $( '#application-of-funds-link' ).wlightbox( { container: $( '#mw-page-base' ), right: ( $('body').width() - 750 ) / 2 + 'px', top: function() { return ( $( '#WMDE_Banner' ).height() + 20 ) + 'px'; } } );
   $( '#application-of-funds-link' ).click( function ( e ) {
       $( '#WMDE_Banner-close-ct' ).attr( 'src', 'https://tracking.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/application-of-funds-lightbox-opened/{{{BannerName}}}&rec=1' );
   } );
   $( '#link-wmf-annual-plan' ).click( function ( e ) {
       $( '#WMDE_Banner-close-ct' ).attr( 'src', 'https://tracking.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/wmf-annual-plan/{{{BannerName}}}&rec=1' );
   } );
   $( '#link-wmde-annual-plan' ).click( function ( e ) {
       $( '#WMDE_Banner-close-ct' ).attr( 'src', 'https://tracking.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/wmde-annual-plan/{{{BannerName}}}&rec=1' );
   } );
 } );

</script>