미디어위키:Centralnotice-template-maintence banner
<style>
- mw-mf-page-center {
background-color: #fff;
}
/* Resets */ .cbnnr * {
margin: 0; padding: 0;
}
.skin-monobook #siteNotice p {
padding-left: 90px !important; padding-right: 64px !important; padding-top: 4px !important;
}
/* Box-sizing */ .cbnnr, .cbnnr *, .cbnnr *:before, .cbnnr *:after {
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
/* Font sizes and line heights */
.cbnnr-message {
font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif; font-weight: medium; font-size: 13px; line-height: 1.4; color: #555A5F !important; text-align: left;
}
.cbnnr-special .cbnnr-message {
color: #d9e0f5 !important;
}
.cbnnr-headline {
font-weight: bold; color: #000;
} .cbnnr-cta {
font-size: 13px; font-weight: medium; color: #222;
}
.cbnnr-special .cbnnr-cta {
color: white;
}
@media all and (min-width: 720px) {
.cbnnr-message {
font-size: 18px;
line-height: 1.5;
}
.cbnnr-cta { font-size: 20px; }
}
/* Styles */
.cbnnr {
background-color: #fff; position: relative; margin-bottom: 12px;
}
/* Hide banner when Wikipedia site search is enabled */ .overlay-enabled .cbnnr {
display: none !important;
}
.cbnnr-main {
position: relative; clear: both; padding: 10px; background-color: white; border: 2px solid #FFCC33; min-height: 88px;
}
.cbnnr-special .cbnnr-main {
background-color: #c8ccd1; border: none;
}
@media all and (min-width: 720px) {
.cbnnr-main {
padding: 15px;
min-height: 98px;
}
}
.skin-minerva .cbnnr-main {
border: none;
border-bottom: 1px solid #c8ccd1;
}
@media all and (min-width: 1000px) {
.skin-minerva .cbnnr-main {
border: 1px solid #c8ccd1;
margin-top: 20px;
}
}
.cbnnr-message {
display: block;
} .rtl .cbnnr-message {
text-align:right;
}
.cbnnr-icon {
width: 68px; height: 68px; border-radius: 2px; overflow: hidden; top: 50%; position: absolute; float: left; transform: translateY(-50%); left: 10px; overflow: hidden; background: #fff;
}
@media all and (min-width: 720px) {
.cbnnr-icon {
left: 15px;
}
.rtl .cbnnr-icon {
right: 15px;
}
}
.cbnnr-icon-border {
border: 1px solid #c8ccd1;
}
.cbnnr-icon img {
max-width: 100%; max-height: 100%; position: absolute; top: 0; left: 0;
}
.cbnnr-icon-border img {
max-width: 80%; max-height: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
}
.cbnnr-message p {
padding-left: 78px; padding-right: 54px; padding-top: 5px; margin: auto;
} .rtl .cbnnr-message p {
padding-right: 78px; padding-left: 54px; padding-top: 5px; margin: auto;
}
@media all and (min-width: 720px) {
.cbnnr-message p {
padding-left: 83px;
padding-right: 64px;
padding-top: 4px;
}
.rtl .cbnnr-message p {
padding-right: 83px;
padding-left: 64px;
padding-top: 4px;
}
}
@media all and (max-width: 500px) {
.cbnnr-message p {
padding-left: 5px;
}
.rtl .cbnnr-message p {
padding-right: 5px;
padding-left: 0;
}
.cbnnr-icon {
display:none;
}
}
@media all and (max-width: 501px) {
.skin-minerva .cbnnr-message p {
padding-left: 83px;
}
.rtl .skin-minerva .cbnnr-message p {
padding-left: 0;
padding-right: 83px;
}
.skin-minerva .cbnnr-icon {
display:block;
}
}
@media all and (max-width: 350px) {
.skin-minerva .cbnnr-message p {
padding: 0 5px;
}
.skin-minerva .cbnnr-icon {
display:none;
}
} .cbnnr-headline, .cbnnr-text {
display: block;
}
@media all and (min-width: 720px) {
.cbnnr-headline,
.cbnnr-text {
display: inline;
}
.cbnnr-text:before {
content: ' | ';
}
}
.cbnnr-cta {
display: block; margin-top: 4px;
}
@media all and (min-width: 720px) {
.cbnnr-cta {
margin-top: 2px;
}
}
.cbnnr-cta:hover {
text-decoration: underline;
}
/* --- Close Options --- */
.cbnnr-close {
cursor: pointer; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); z-index: 1; opacity: .8; background: #eaecf0; border-radius: 50%; padding: 12px; width: 44px; height: 44px; transition: all .3s ease-in-out;
}
.cbnnr-special .cbnnr-close {
background: rgba(255,255,255,.5); opacity: 1;
}
body.rtl .cbnnr-close {
left: 10px; right: unset;
}
@media all and (min-width: 720px) {
.cbnnr-close {
right: 15px;
}
body.rtl .cbnnr-close {
left: 15px;
right: unset;
}
}
.cbnnr-close:hover {
opacity: 1;
}
.cbnnr-special .cbnnr-close:hover {
background: rgba(255,255,255,.7);
}
.cbnnr-close-icon {
background:
linear-gradient(transparent,transparent),
url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclose%3C/title%3E%3Cpath d=%22M4.34 2.93l12.73 12.73-1.41 1.41L2.93 4.35z%22/%3E%3Cpath d=%22M17.07 4.34L4.34 17.07l-1.41-1.41L15.66 2.93z%22/%3E%3C/svg%3E");
height: 100%;
width: 20px;
min-width: 20px;
min-height: 20px;
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
opacity: 0.8;
}
.cbnnr-special .cbnnr-close-icon {
background:
linear-gradient(transparent,transparent),
url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 fill=%22%23ffffff%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclose%3C/title%3E%3Cpath d=%22M4.34 2.93l12.73 12.73-1.41 1.41L2.93 4.35z%22/%3E%3Cpath d=%22M17.07 4.34L4.34 17.07l-1.41-1.41L15.66 2.93z%22/%3E%3C/svg%3E");
}
.cbnnr-special .cbnnr-close-icon {
opacity: 1;
}
.cbnnr-special .cbnnr-close-icon {
/* need new svg */
}
.cbnnr-close-icon:hover {
opacity: 1;
}
</style>
<a href="{{{noticeurl}}}" class="cbnnr-message">
<figure class="cbnnr-icon">
<img src="https://upload.wikimedia.org/wikipedia/donate/4/47/Alert_120x120.png" alt="Warning icon"/>
</figure>
{{{message1}}} {{{time}}} {{{message2}}}
</a>
<script> var cbnnr = cbnnr || {};
cbnnr.show = function() {
$('.cbnnr').css('display', 'block');
};
$(function() {
if ( !mw.centralNotice.bannerData.hideResult ) {
cbnnr.show();
}
}); </script>