5.651
Bearbeitungen
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
Zeile 6: | Zeile 6: | ||
---------- | ---------- | ||
<!-- For guidance or help with this banner, contact Seddon (WMF) --> | |||
<!-- This banners is set up to run to loggedin users only --> | |||
<style> | |||
@font-face { | |||
font-family: 'Montserrat'; | |||
font-style: normal; | |||
src: local('Montserrat'), local('Montserrat'), url(https://upload.wikimedia.org/wikipedia/donate/c/cd/Montserrat.woff2) format('woff2');} | |||
/* Main banner container. Banner: background | /* Main banner container. Banner: background, border colour and width and adding a margin between banner and article header*/ | ||
.cnotice { | .cnotice { | ||
position: relative; | position: relative; | ||
overflow: hidden; | overflow: hidden; | ||
background: # | background: #f8f9fa; | ||
border: 1px solid | border: 1px solid #a2a9b1; | ||
border-radius: 2px; | |||
margin-bottom: 1em; | margin-bottom: 1em; | ||
cursor: pointer; | cursor: pointer; | ||
color: #222; | color: #222; | ||
font-weight: 500; | font-weight: 500; | ||
} | } | ||
Zeile 27: | Zeile 32: | ||
display: table; | display: table; | ||
width: 100%; | width: 100%; | ||
height: | height: 80px; /* need to set height for height 100% to work on elements within it */ | ||
} | |||
/*MOBILE - Adjust mobile height of banner*/ | |||
body.skin-minerva #cnotice-main { | |||
height: 100px; | |||
} | } | ||
/*IMPORTANT - don't touch*/ | |||
.cnotice-message-container, | .cnotice-message-container, | ||
.cnotice-logo-container { | .cnotice-logo-container, | ||
.cnotice-misc-container { | |||
display: table-cell; | display: table-cell; | ||
height: 100%; | height: 100%; | ||
vertical-align: middle; | vertical-align: middle; | ||
} | } | ||
Zeile 55: | Zeile 53: | ||
position: relative; | position: relative; | ||
margin: 0; | margin: 0; | ||
line-height: 1.2; | line-height: 1.2; | ||
padding: 5px 5px 5px 5px; | |||
padding: | |||
} | } | ||
@media (min-width: 1200px) { | @media (min-width: 1200px) { | ||
.cnotice-message { | .cnotice-message { | ||
padding: 11px | padding: 15px 0px 11px 30px; | ||
} | } | ||
} | } | ||
body.rtl .cnotice-message { | body.rtl .cnotice-message { | ||
padding: | padding: 5px 5px 5px 5px; | ||
} | } | ||
.cnotice-message p { | .cnotice-message p { | ||
margin: 0; | margin: 0; | ||
color: #222; | |||
font-family: Arial, sans-serif; | font-family: Arial, sans-serif; | ||
font- | font-weight: bold; | ||
font-size: | font-size: 100%; | ||
opacity: 1; | opacity: 1; | ||
text-align: center; | text-align: center; | ||
Zeile 84: | Zeile 80: | ||
@media (min-width: 1200px) { | @media (min-width: 1200px) { | ||
.cnotice-message p { font-size: | .cnotice-message p { font-size: 120%; } | ||
} | } | ||
Zeile 91: | Zeile 87: | ||
.cnotice-logo-container { | .cnotice-logo-container { | ||
width: 10%; | width: 10%; | ||
} | } | ||
body.rtl .cnotice-logo-container { | body.rtl .cnotice-logo-container { | ||
padding: | padding: 0 .25em 0 .9em; | ||
} | } | ||
Zeile 101: | Zeile 96: | ||
opacity: 1; | opacity: 1; | ||
display: block; | display: block; | ||
margin: | margin-left: 15%; | ||
margin-top: 2px; | |||
margin-bottom: 1px; | |||
} | |||
/*Misc containter stuff starts here*/ | |||
.cnotice-misc-container { | |||
width: 10%; | |||
padding-right: 40px; | |||
} | } | ||
/*Detects and adjusts for mobile skin */ | |||
body.skin-minerva .cnotice-misc-container { | |||
padding-right: 10px; | |||
} | |||
/* --- Close Options --- */ | /* --- Close Options --- */ | ||
#cnotice-toggle-box-options { | #cnotice-toggle-box-options { | ||
display: | display: table-cell; | ||
font-size: .8em; | font-size: .8em; | ||
text-transform: uppercase; | text-transform: uppercase; | ||
width: 38px; | |||
height: 38px; | |||
border-radius: 19px; | |||
vertical-align: middle; | |||
} | } | ||
#cnotice-toggle-box { | #cnotice-toggle-box { | ||
cursor: pointer; | cursor: pointer; | ||
opacity: . | position: absolute; | ||
top: 2px; | |||
right: 3px; | |||
z-index: 1; | |||
opacity: .8; | |||
} | } | ||
#cnotice-toggle-box | body.rtl #cnotice-toggle-box { | ||
left: 3px; | |||
right: unset; | |||
} | } | ||
#cnotice-toggle-box:hover { | |||
opacity: 1; | |||
} | } | ||
Zeile 151: | Zeile 153: | ||
.cnotice a.cnotice-full-banner-click:hover { | .cnotice a.cnotice-full-banner-click:hover { | ||
text-decoration: underline | text-decoration: underline; | ||
} | } | ||
.cnotice-button { | .cnotice-button { | ||
display: inline-block; | |||
border: | border: 2px solid #36c; | ||
border-radius: 2px; | |||
border-radius: | color: #fff; | ||
color: | padding: 5px 5px; | ||
padding: | |||
text-align: center; | text-align: center; | ||
font-weight: bold; | font-weight: bold; | ||
text-decoration: none; | text-decoration: none; | ||
font-size: | font-size: 14px; | ||
margin: 4px 2px; | margin: 4px 2px; | ||
-webkit-transition-duration: | -moz-transition-duration: 100ms; /* Firefox */ | ||
transition-duration: | -webkit-transition-duration: 100ms; /* Safari */ | ||
transition-duration: 100ms; | |||
cursor: pointer; | cursor: pointer; | ||
z-index: | z-index: 1; | ||
min-width: 80px; | |||
} | } | ||
@media (min-width: | @media (min-width: 1100px) { | ||
.cnotice-button { | .cnotice-button { | ||
min-width: 110px; | |||
width: 25%; | width: 25%; | ||
margin: auto; | margin: auto; | ||
} | } | ||
} | } | ||
Zeile 189: | Zeile 187: | ||
cursor: pointer; | cursor: pointer; | ||
text-decoration: none; | text-decoration: none; | ||
color: | color: #000; | ||
} | } | ||
.cnotice a.cnotice-buttonlink:hover { | .cnotice a.cnotice-buttonlink:hover { | ||
color: | color: #fff; | ||
} | } | ||
.cnotice-button1 { | .cnotice-button1 { | ||
background-color: # | background-color: #36c; | ||
color: | border-color: #36c; | ||
color: #fff; | |||
} | } | ||
.cnotice-button1:hover { | |||
background-color: #447ff5; | |||
border-color: #447ff5; | |||
} | |||
.cnotice-button1: | .cnotice-button1:active { | ||
background-color: # | background-color: #2a4b8d; | ||
border-color: #2a4b8d; | |||
} | |||
.rtl .cnotice-button1 { | |||
left: 23px; | |||
right: auto; | |||
margin-left: 20px; | |||
} | |||
#cnotice-translation-link { | |||
position: absolute; | |||
right: 65px; | |||
bottom: 0px; | |||
font-size: 0.8em; | |||
white-space: nowrap; | |||
} | |||
#cnotice-translation-link:hover { | |||
text-decoration: underline; | |||
} | |||
.rtl #cnotice-translation-link { | |||
text-align: left; | |||
left: 65px; | |||
} | } | ||
</style> | </style> | ||
<div class="cnotice" id="{{{banner}}}"> | <div class="cnotice" id="{{{banner}}}"> | ||
<a class="cnotice-full-banner-click external text" href="// | <a class="cnotice-full-banner-click external text" href="//de.wikipedia.org/wiki/Wikipedia:WikiDACH/2018/Anmeldung"> | ||
<div id="cnotice-main"> | <div id="cnotice-main"> | ||
<div class="cnotice-logo-container"> | <div class="cnotice-logo-container"> | ||
<img src="//upload.wikimedia.org/wikipedia/commons/ | <img src="//upload.wikimedia.org/wikipedia/commons/e/e7/2018_05_16_barcamp_meets_Logo_Kopie_querformat.svg" alt="Banner logo" width="188px" height="55px"> | ||
</div> | </div> | ||
<div class="cnotice-message-container"> | <div class="cnotice-message-container"> | ||
<div class="cnotice-message"> | <div class="cnotice-message"> | ||
<p> | <p>Erfahre mehr über die Wikipedia und triff Beteiligte beim Barcamp WikiDACH am 22. + 23. September in Heidelberg. Jetzt Ticket sichern!</p> | ||
</div> | </div> | ||
</div> | </div> | ||
<div | <div class="cnotice-misc-container"> | ||
<div class="cnotice-button cnotice-button1">{{int:Centralnotice-strategic_plan1-learn-more}}</div> | |||
</div> | |||
</div> | </div> | ||
</a> | </a> | ||
<div id="cnotice-toggle-box | <div id="cnotice-toggle-box"> | ||
< | <a href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;"><img border="0" src="//upload.wikimedia.org/wikipedia/donate/a/ac/Close_oojs.png" alt="{{int:centralnotice-shared-hide}}" /></a> | ||
</div> | </div> | ||
</div> | </div> |