MediaWiki:Centralnotice-template-Fundraiser2022v4

/* Hide when editing */ .action-edit #centralNotice, .ve-activated #centralNotice { display: none !important; } /* --- Close Options --- */

display: table-cell; font-size: .8em; text-transform: uppercase; width: 38px; height: 38px;
 * 1) cnotice-toggle-box-options {

background: #eee; -moz-border-radius: 19px; -webkit-border-radius: 19px; border-radius: 19px; vertical-align: middle; }

cursor: pointer; position: absolute; top: 2px; right: 3px; z-index: 1; }
 * 1) cnotice-toggle-box {

body.rtl #cnotice-toggle-box { left: 3px; right: unset; }

opacity: 1; }
 * 1) cnotice-toggle-box:hover {

/* Fix fixed position z-index for de.wikipedia */ .mw-body { z-index: auto; }
 * 1) siteNotice { z-index: 2; }

/* Border-Box */

.frb, .frb *, .frb *:before, .frb *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* Banner wide settings */

.frb input, .frb button { font-size: inherit; font-family: inherit; }

.frb button { cursor: pointer; border: 0; background: transparent; padding: 0; }

/* --- Main banner wrapper --- */

z-index: 2; }
 * 1) siteNotice {

.frb { display: none; background-color: #fff; color: #000; font-size: 16px; line-height: 1.1875; /*19px @16px*/ font-family: system-ui, -apple-system,BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, Lato, "Helvetica Neue", Helvetica, Arial, sans-serif; text-align: left; font-weight: normal; font-style: normal; /* needed for uk.wikipedia */ }

.frb-in-article { position: relative; top: 0; width: calc(100% + 12px); margin-bottom: 20px; }

.frb-nag, .frb-fixed { position: fixed; top: 0; left: 0; width: 100%; padding: 16px; background-color: #fff; border-bottom: 1px solid #c8ccd1; box-shadow: 0 1px 1px rgba(0,0,0,0.1); }

.frb-layout { position: relative; display: table; width: 100%; padding: 0; }

/* --- Icon buttons --- */

.frb .frb-icon-btn { display: block; cursor: pointer; background-repeat: no-repeat; background-position: center; opacity: .55; } .frb .frb-icon-btn:hover { opacity: 1; }

.frb .frb-close { position: absolute; top: 0; right: 0; width: 18px; height: 18px; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%23000' fill='none' stroke-linecap='round'%3E%3Cpath d='M1 1 l8 8 M9 1 l-8 8'%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); background-size: 12px 12px; } body.rtl .frb .frb-close { right: auto; left: 0; }

.frb .frb-back { position: absolute; top: 0; left: 0; width: 20px; height: 18px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 16'%3E%3Cg fill='none' fill-rule='evenodd' transform='translate(1 1)'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.778' d='M7.181 13.285L.753 7 7.181.715'%3E%3C/path%3E%3Crect fill='%23000' width='18.182' height='1.778' x='.818' y='6.111' rx='.889'%3E%3C/rect%3E%3C/g%3E%3C/svg%3E"); background-size: 20px 13px; }

/* --- RML Close button --- */

.close-rml { display: none; } .frb-nag .close-rml { text-align: center; margin: 0 auto; padding: 2px; font-size: 11px; line-height: 1; text-transform: uppercase; cursor: pointer; color: #54595d; } .frb-nag .close-rml:hover { color: #000; }

.frb-rml-displayed .close-rml { display: block; }

/* -- Message -- */

.frb-message { display: table-cell; width: auto; vertical-align: top; font-weight: normal; color: #000; font-size: 15px; line-height: 1.6; /*24px @15px*/ }

.frb-translateme { float: right; font-size: 60%; }

.frb-learnmore { text-align: center; font-size: 70%; } .frb-message-inner { position: relative; z-index: 1; background-color: #F8FFF5; border-left: 6px solid #2C670F; padding: 12px 18px 14px; }

@media all and (min-width: 1100px) { .frb-message-inner { padding: 15px 26px 19px; } }

@media (min-width: 1100px) { .frb-message { font-size: 18px; }   html[lang="en"] .frb-message { font-size: 19px; } }

@media (min-width: 1300px) { .frb-message { font-size: 20px; } html[lang="en"] .frb-message { font-size: 21px; } }

@media (min-width: 1500px) { .frb-message { font-size: 21px; } html[lang="en"] .frb-message { font-size: 22px; } }

@media (min-width: 1700px) { .frb-message { font-size: 22px; } html[lang="en"] .frb-message { font-size: 23px; } }

.frb-message-icon { float: left; margin-top: 4px; /*in px since margin is consistent on all bp*/ margin-right: 2px; height: 5em; width: 2em; }

.frb-nag .frb-message-icon { margin-top: 3px; }

@media all and (min-width: 1300px) { .frb-nag .frb-message-icon { margin-top: 4px; } }

body.rtl .frb-message-icon { float: right; margin-left: 2px; }

.frb-message p { margin: 0; }

.frb-greeting { display: block; margin-bottom: 0.5em; font-size: 70%; }

.frb-highlight { border-bottom: 3px solid #900; padding-bottom: 2px; }

/* Nag styles */

.frb-nag { cursor: pointer; }

.frb-nag .frb-message { vertical-align: middle; }

.frb-nag .frb-message-inner { padding: 12px 18px; font-size: 14px; }

@media (min-width: 1100px) { .frb-nag .frb-message-inner { font-size: 16px; } }

@media (min-width: 1400px) { .frb-nag .frb-message-inner { padding: 16px 26px; font-size: inherit; } }

.frb-nag .frb-form-wrapper { padding: 0 16px; width: 360px; overflow: visible; vertical-align: middle; }

@media all and (min-width: 1200px) { .frb-nag .frb-form-wrapper { width: 440px; } }

/*Triangle*/ .frb-nag .frb-message-inner:before { position: absolute; top: 50%; right: -26px; content: " "; margin: -10px 0 0 0; border: 10px solid transparent; border-left-color: #900; pointer-events: none; }

/* -- Form -- */

.frb-form-wrapper { vertical-align: top; display: table-cell; position: relative; width: 320px; height: 100%; vertical-align: top; background: #fff; }

/*Triangle in article and fixed expanded state*/

.frb-triangle:before { content: " "; position: absolute; top: 50%; left: -25px; margin-top: -13px; content: " "; border: 10px solid transparent; border-left-color: #900; pointer-events: none; }

.frb-form-wrapper fieldset { border: 0; margin: 0 auto; padding: 0 0 6px 0; }

.frb-form-wrapper .frb-amounts { padding: 0; margin-top: 8px; }

.frb-form-wrapper legend, .frb-rml-form-legend { display: block; margin: 0 0 2px; padding: 0 4px; font-weight: normal; text-align: left; font-size: 14px; line-height: 1.2142857143; /*17px @14px*/ color: #54595d; transition: all .25s ease-in-out; }

.frb-rml-form-legend { padding: 0 0 2px; }

.frb-frequency legend, .frb-amounts legend { padding: 0 5px; }

.frb-form-wrapper fieldset:first-of-type legend { padding-top: 0; }

.frb-form-wrapper ul { display: table; table-layout: fixed; width: 100%; margin: 0; padding: 0; list-style: none; }

.frb-form-wrapper li { display: table-cell; vertical-align: top; }

.frb-form-wrapper .frb-methods li { padding: 4px !important; }

padding-left: 25px; position: relative; overflow: hidden; }
 * 1) frb-form {

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

/* Hide radio buttons */ .frb-form-wrapper .frb-methods input[type="radio"], .frb-form-wrapper input[type="checkbox"] { position: absolute; overflow: hidden; height: 1px; width: 1px; clip: rect(0 0 0 0); border: 0; margin: -1px; padding: 0; }

/* Focus styles */

/*Outline reset*/ .frb-form-wrapper input[type=radio]:focus, .frb-radio:focus + .frb-radio-label, outline: 0; }
 * 1) frb-amt-other-input:focus,
 * 2) frb-rml-email:focus {

.frb button:focus, .frb-btn:focus, .frb-icon-btn:focus, .frb-btn-submit:focus, .frb-form-wrapper input[type=radio]:focus + .frb-btn, .frb-form-wrapper input[type=radio]:focus + #frb-amt-other-label, .frb-rml-displayed .frb-rml-form input:focus, .frb-nag-btn:focus, outline: 0; border-color: #36c !important; box-shadow: inset 0 0 0 2px #36c; }
 * 1) frb-amt-other-input:focus,
 * 1) nag-rml-btn:focus {

.frb button.frb-submit:focus { box-shadow: inset 0 0 0 1px #447ff5, inset 0 0 0 2px #fff; }

.frb-rml-displayed .frb-rml-form input:focus, .frb-rml-displayed .frb-rml-form .frb-btn-submit:focus { position: relative; }

.frb-radio:focus + .frb-radio-label, .frb-radio:hover + .frb-radio-label { color: #36c; text-decoration: underline; }

border-color: #36c !important; box-shadow: none; color: #36c; }
 * 1) frb-amt-other-input:focus,
 * 2) frb-amt-other-input:hover {

.frb-form-wrapper input[type=radio]:focus + .frb-btn, .frb-form-wrapper input[type=radio]:focus + #frb-amt-other-label, .frb-form-wrapper input[type=radio]:checked + .frb-btn:focus, .frb-form-wrapper input[type=radio]:checked + #frb-amt-other-label:focus, .frb-form-wrapper .frb-btn-submit:focus, box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff; }
 * 1) nag-yes-btn:focus {

.frb-btn img { padding: 0 4px; max-width: 100%; max-height: 20px; /*must equal font line height of frb-btn*/ }

.frb-methods .frb-btn { height: 64px; line-height: 1.125; /*18px @16px*/ }

.frb-methods svg { max-width: 100%; width: 64px; }

/* Blue text buttons */ .frb-btn.frb-btn-btxt { color: #36c; } .frb-btn.frb-btn-btxt:active { color: #2a4b8d; }

/* --- Show and Hiding (Minimize and Maximize) --- */

.frb-nag-btns { display: flex; }

.frb.frb-rml-displayed .frb-nag-btns { display: none; }

button.frb-nag-btn { flex: 1 0 0; margin: 0 8px; padding: 6px; min-height: 48px; background-color: white; border: 1px solid #9aa0a7; border-radius: 2px; outline: 0; color: #000; cursor: pointer; font-weight: normal; font-size: 13px; line-height: 1.3; transition: all 100ms; }

@media all and (min-width: 1100px) { button.frb-nag-btn { font-size: 14px; } }

@media all and (min-width: 1200px) { button.frb-nag-btn { font-size: 16px; } }

button.frb-nag-btn:hover { -moz-transform: scale(1.043478); -ms-transform: scale(1.043478); -webkit-transform: scale(1.043478); transform: scale(1.043478); }

font-weight: bold; background-color: #36c; border: 1px solid #36c; color: white; }
 * 1) nag-yes-btn {

/* --- Maybe later --- */

.frb-rml-disabled .frb-rml, .frb-rml-disabled .frb-rml-link, .frb-rml-disabled #nag-rml-btn { display: none; }

.frb-rml-form { display: none; position: absolute; margin-top: 12px; margin-left: 12px; width: calc(100% - 12px); padding: 16px; text-align: left; background: #fff; border: 1px solid #c8ccd1; border-radius: 2px; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.15); z-index: 10; }

.frb-rml-form:after, .frb-rml-form:before { bottom: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }

.frb-rml-form:after { border-bottom-color: #fff; border-width: 10px; margin-left: -10px; }

.frb-rml-form:before { border-bottom-color: #c8ccd1; border-width: 11px; margin-left: -11px; }

.frb-rml-form input { width: 100%; padding: 6px 8px 7px; border: 1px solid #a2a9b1; border-radius: 2px; color: #000; font-size: 14px; }

border-color: #d33 !important; box-shadow: inset 0 0 0 1px #d33 !important; }
 * 1) frb-rml-email.frb-haserror {

.frb-error-invalidemail { margin: 2px 0 0 !important; }

.frb-rml-ty { text-align: center; margin: 16px 16px 0 25px; }

.frb-rml-displayed .frb-rml-form { position: relative; z-index: 10; display: table !important; margin: -4px auto 0; padding: 0 12px; width: 100%; max-width: 340px; background: transparent; border: none; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }

.frb-rml-displayed .frb-rml-form:after, .frb-rml-displayed .frb-rml-form:before { display: none !important; }

.frb-rml-displayed .frb-rml { display: block !important; margin-top: 0; }

.frb-rml-displayed .frb-rml-form legend { font-size: 12px; line-height: 1; /*12px @12px*/ padding-bottom: 4px; }

@media all and (min-width: 1200px) { .frb-rml-displayed .frb-rml-form legend { font-size: 14px; line-height: 1.2142857143; /*17px @14px*/ } }

.frb-rml-displayed .frb-rml-form input { display: inline; vertical-align: middle; width: 200px; height: 32px; padding: 7px 8px; margin: 0; border: 1px solid #a2a9b1; border-radius: 2px; color: #000; direction: ltr; line-height: 1; }

.frb-rml-displayed .frb-rml-form .frb-btn-submit { display: inline; vertical-align: middle; width: auto; height: 32px; margin-top: 0; margin-left: 2px; line-height: 1; padding: 9px 14px; font-size: 14px; border-radius: 2px; }

.frb-prevent-page-jump { display: none; }

/* -- Submit/"Donate now" button -- */

.frb .frb-submit { height: 52px; display: inline-block; cursor: default; margin: 4px 5px 0; padding: 3px 6px 5px; width: calc(100% - 9px); background-color: #f8f9fa; border: 1px solid #a2a9b1; border-radius: 2px; color: #36c; font-weight: bold; transition: background-color 0.5s ease; opacity: .5; }

.frb .frb-submit.active { background-color: #36c; border-color: #36c; color: #fff; cursor: pointer; opacity: 1; }

.frb .frb-submit.active:hover { background-color: #447ff5; border-color: #447ff5; }

.frb-submit-amount { display: none; } .frb-submit-label-monthly { display: none; } .frb-submit-label-now { display: inline; } .form-monthly .frb-submit-label-monthly { display: inline; } .form-monthly .frb-submit-label-now { display: none; } .frb-icon-lock { fill: #fff; width: 14px; height: 14px; }

.frb-payment-options { display: table; table-layout: fixed; width: 100%; }

.frb-payment-options .frb-button { width: 100%; }

/* For 4 payment options, 2 rows of 2 */ .frb-payment-options .frb-button:first-child:nth-last-child(4), .frb-payment-options .frb-button:first-child:nth-last-child(4) ~ .frb-button { float: left; width: 50%; }

.frb-methods .frb-button { display: table-cell; padding: 5px; float: none; vertical-align: top; }

.frb-button-table { display: table; width: 100%; }

.frb-label { display: table-cell; /* To vertical align content */ vertical-align: middle; width: 100%; height: 52px; color: #36c; background-color: #f8f9fa; border-radius: 2px; border: 1px solid #a2a9b1; text-align: center; transition: background-color 0.5s ease; cursor: pointer; transition: all 0.5s ease; padding: 0 10px; }

.frb-label:hover, .frb-rml-email:hover { background-color: #eaf3ff; }

.form-monthly .no-monthly .frb-label:hover { background-color: #f8f9fa; }

.frb-radio:checked + .frb-label { background-color: #2a4b8d; border-color: #2a4b8d; color: #fff; font-weight: bold; }

.frb-radio:focus + .frb-label, box-shadow: inset 0 0 0 1px #36c; border-color: #36c; }
 * 1) frb-rml-email:focus {

.frb-radio:focus:checked + .frb-label { box-shadow: inset 0 0 0 1px #2a4b8d, inset 0 0 0 2px #fff; }

.frb-radio:checked + .frb-label .frb-logo-payments--paypal path, .frb-radio:checked + .frb-label .frb-logo-payments--paypal-usd path, .frb-radio:checked + .frb-label .frb-logo-payments--amazon path { fill: #fff; }

/* Error messages */ .frb-error { display: none; margin: 5px 0 5px 5px; font-size: 14px; line-height: 1.3; color: #d33; }

.frb-form-wrapper fieldset.frb-haserror legend { color: #d33; font-weight: bold; }

/* steps */ position: absolute; top: 0; width: 280px; padding-top: 24px; margin-left: 320px; visibility: hidden; /* Prevent tabbing to inputs */ }
 * 1) frb-form .frb-step {

position: relative; margin-left: 0; visibility: visible; }
 * 1) frb-form .frb-step-1 {

        



var frb = frb || {};

frb.show = function { $('.frb-in-article').css('display', 'block'); };

frb.hide = function { /* Hide the banner, and remove related event handlers */ /* Don't set a cookie: this is a large banner and only shown on first view anyway */ $('.frb').hide; $('.frb-prevent-page-jump').hide; $(window).off('.frb'); $('#toc a').off('.frb'); };   /* Hide banner outside of main namespace (and Main Page, for sites where that isn't in main namespace) */ if ( mw.config.get('wgNamespaceNumber') > 0 && !mw.config.get('wgIsMainPage') ) { mw.centralNotice.bannerData.hideResult = true; mw.centralNotice.bannerData.hideReason = 'namespace'; }   /* Hide banner on mobile site, in case wrong device settings were chosen */ if ( mw.config.get('skin') === 'minerva' ) { mw.centralNotice.bannerData.hideResult = true; mw.centralNotice.bannerData.hideReason = 'other'; }

if (!mw.centralNotice.bannerData.hideResult) { frb.show; }