User:Msz2001/Banner

Banner for Wikimania scholarships. It automatically fetches translated messages from wm2023scholarcfp_2 banner (i.e. those). Screenshots can be seen here.

The following file is used in the banner: File:Młyńczyska - panorama (wiosna 2013).jpg (should be protected during the campaign)

<style type="text/css">
#centralNotice.collapsed #{{{banner}}} {
    display: none !important;
}

#{{{banner}}} {
    position: relative;
    margin-bottom: 0.5em;
    background: #fff url('//upload.wikimedia.org/wikipedia/commons/thumb/9/9b/M%C5%82y%C5%84czyska_-_panorama_%28wiosna_2013%29.jpg/360px-M%C5%82y%C5%84czyska_-_panorama_%28wiosna_2013%29.jpg') no-repeat;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-position: bottom -3px right -8px;
    display: none;
    overflow: hidden;
}
body.rtl #{{{banner}}} {
    background-position: bottom -3px left -40px;
}

#{{{banner}}} a.scholar-full-banner-click {
    display: block;
    width: 100%;
    cursor: pointer;
}

#{{{banner}}} a:hover {
    text-decoration: none;
}

#{{{banner}}}-logo {
    background: url('//upload.wikimedia.org/wikipedia/commons/thumb/a/a3/Wikimania2011stock.svg/40px-Wikimania2011stock.svg.png') no-repeat;
    height: 55px;
    width: 40px;
    margin-top: 5px;
    flex-shrink: 0;
}

#{{{banner}}}-content {
    font-size: 14px;
    font-weight: bold;
    color: black;
    padding: 0.7em 20px 1em 20px !important;
    margin-inline-end: calc(230px - 4%);
    text-align: center;
    line-height: 1.6em;
    box-sizing: border-box;
    min-height: 100px;
    display: flex;
    align-items: center;
    background-image: linear-gradient(98deg, #fff 96%, transparent 97%);
}
body.rtl #{{{banner}}}-content {
    background-image: linear-gradient(262deg, #fff 96%, transparent 97%);
}

#{{{banner}}}-text {
    flex-grow: 1;
}

#{{{banner}}}-text:hover {
    text-decoration: underline;
}

#{{{banner}}} div#scholar-toggle-box {
    position: absolute;
    top: 0;
    right: 0;
    height: 32px;
    width: 27px;
    text-align: right;
}
body.rtl #{{{banner}}} div#scholar-toggle-box {
    text-align: left;
    right: unset;
    left: 0;
}

#{{{banner}}} div#scholar-translation-link {
    position: absolute;
    right: 230px;
    bottom: 5px;
    font-size: 0.8em;
    white-space: nowrap;
}

#{{{banner}}} #scholar-translation-link:hover {
    text-decoration: underline;
}
body.rtl #{{{banner}}} div#scholar-translation-link {
    right: unset;
    left: 230px;
}

#{{{banner}}} div#scholar-photo-attribution {
    position: absolute;
    right: 8px;
    bottom: 1px;
    font-size: 9px;
    white-space: nowrap;
    color: #fff;
    text-shadow: 1px 0 0 #000, 0 1px 0 #000, -1px 0 0 #000, 0 -1px 0 #000,
    1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000;
}
body.rtl #{{{banner}}} div#scholar-photo-attribution {
    right: unset;
    left: 8px;
}

@media screen and (min-width: 1000px) {
    #{{{banner}}}-content {
        font-size: 16px;
    }
}

@media screen and (max-width: 800px) {
    #{{{banner}}} {
        background-position: bottom 0px right -67px;
    }
    body.rtl #{{{banner}}} {
        background-position: bottom 0px left -100px;
    }
    #{{{banner}}}-content {
        margin-inline-end: calc(160px - 4%);
    }
    #{{{banner}}} div#scholar-translation-link {
        right: 160px;
    }
    body.rtl #{{{banner}}} div#scholar-translation-link {
        right: unset;
        left: 160px;
    }
}

@media screen and (max-width: 650px) {
    #{{{banner}}} {
        background-image: none;
        border-radius: 0;
    }
    #{{{banner}}}-content {
        margin-inline-end: 0;
        background: #fff;
    }
    #{{{banner}}} #scholar-photo-attribution {
        display: none;
    }
    #{{{banner}}} div#scholar-translation-link {
        right: 10px;
    }
    body.rtl #{{{banner}}} div#scholar-translation-link {
        right: unset;
        left: 10px;
    }
}
</style>

<div id="{{{banner}}}">
    <a class="scholar-full-banner-click" href="//wikimania.wikimedia.org/wiki/Special:MyLanguage/2024:Scholarships">
    <div id="{{{banner}}}-content">
        <div id="{{{banner}}}-logo"></div>
        <div id="{{{banner}}}-text">{{{wm2023scholarcfp_2,text1}}}<br/>{{{wm2023scholarcfp_2,text2}}}</div>
    </div>
    <div id="scholar-photo-attribution" lang="zxx" dir="ltr">Tomasz Perełka, CC BY-SA 3.0</div>
    </a>
    
    <div id="scholar-toggle-box">
    <a href="#" title="{{int:centralnotice-close-title}}" onclick="mw.centralNotice.hideBanner();return false;"><img border="0" src="//upload.wikimedia.org/wikipedia/foundation/2/20/CloseWindow19x19.png" alt="{{int:centralnotice-close-title}}" /></a> 
    </div>
    
    <div id="scholar-translation-link">
    [<a id="wikimania2024schref" href="//meta.wikimedia.org/w/index.php?title=Special:Translate&group=Centralnotice-tgroup-wm2023scholarcfp_2">{{int:centralnotice-shared-help-translate}}</a>]
    </div>
</div>

<script>
$(document).ready(function() {
    if (mw.config.get( 'wgUserEditCount' ) >= 50) {
    $('#{{{banner}}}').show();
    } 
});

if(document.getElementById("wikimania2024schref")) document.getElementById("wikimania2024schref").setAttribute("href", "//meta.wikimedia.org/w/index.php?title=Special:Translate&group=Centralnotice-tgroup-wm2023scholarcfp_2&language=" + mw.config.get('wgPageContentLanguage'));
</script>