|
|
Zeile 3: |
Zeile 3: |
| <br> | | <br> |
| <br> | | <br> |
|
| |
|
| |
|
| |
|
| |
| <style type="text/css">
| |
| #wlm-de {
| |
| padding: 0;
| |
| width: 100%;
| |
| margin-bottom: 1em;
| |
| position: relative;
| |
| }
| |
|
| |
| #mw-mf-viewport #wlm-de {
| |
| margin-bottom: 0!important;
| |
| }
| |
|
| |
| #wlm-de>a {
| |
| display: table;
| |
| table-layout: fixed;
| |
| border: 1px solid rgba(0, 0, 0, 0.3);
| |
| background-color: #FFF;
| |
| font-size: 15px;
| |
| font-weight: bold;
| |
| line-height: 1.4;
| |
| text-align: left;
| |
| width: 100%;
| |
| padding: 0;
| |
| box-shadow: 0.1em 0.1em 0.6em 0 rgba(0, 0, 0, 0.4);
| |
| transition: box-shadow 0.3s;
| |
| height: auto;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| #wlm-de>a:hover {
| |
| text-decoration: none;
| |
| box-shadow: 0.06em 0.06em 0.4em 0 rgba(0, 0, 0, 0.7);
| |
| }
| |
|
| |
| #wlm-de,
| |
| #wlm-de * {
| |
| box-sizing: border-box;
| |
| }
| |
|
| |
| #wlm-de>a>* {
| |
| display: table-cell;
| |
| vertical-align: middle;
| |
| padding: 0.7em 1.5em;
| |
| }
| |
|
| |
| #wlm-de>a .wlm-logo {
| |
| width: 13rem;
| |
| text-indent: -1000em;
| |
| background-image: url('//upload.wikimedia.org/wikipedia/commons/b/b3/WLM_Sharing_Heritage_Logo.svg');
| |
| background-repeat: no-repeat;
| |
| background-size: contain;
| |
| background-position: 40% 47%;
| |
| height:5rem;
| |
| }
| |
|
| |
| @keyframes scroll {
| |
| 100% { background-position: 1000em 50% }
| |
| }
| |
|
| |
| #wlm-de>a .wlm-image {
| |
| background-size: auto 100%;
| |
| background-repeat: repeat-x;
| |
| background-image: url('//upload.wikimedia.org/wikipedia/commons/thumb/d/de/WLM-Banner-Bg-2017.jpg/865px-WLM-Banner-Bg-2017.jpg');
| |
| background-position: 0 50%;
| |
| animation: scroll 500s infinite linear;
| |
| }
| |
|
| |
| #wlm-de>a:hover .wlm-image {
| |
| animation-play-state: paused;
| |
| }
| |
|
| |
| #wlm-de .wlm-cta {
| |
| position: relative;
| |
| background-color: #8F0000;
| |
| color: #FFF;
| |
| width: 20em;
| |
| padding-right: 2.5em;
| |
| overflow: hidden;
| |
| }
| |
|
| |
| #wlm-de .wlm-cta .cta-slides {
| |
| position:relative;
| |
| }
| |
|
| |
| #wlm-de .cta-slide {
| |
| display: flex;
| |
| flex-direction: column;
| |
| justify-content: center;
| |
| }
| |
|
| |
| #wlm-de .wlm-cta .cta-slide:last-child {
| |
| position:absolute;
| |
| top:200%;
| |
| left:0;
| |
| right:0;
| |
| bottom:-200%;
| |
| }
| |
|
| |
| @keyframes jump {
| |
| 0% {transform: translateY(0)}
| |
| 50% {transform: translateY(0)}
| |
| 60% {transform: translateY(-200%)}
| |
| 100% {transform: translateY(-200%)}
| |
| }
| |
|
| |
| #wlm-de .wlm-cta .cta-slides {
| |
| animation: jump 7s infinite ease-in-out;
| |
| animation-direction: alternate;
| |
| }
| |
|
| |
|
| |
|
| |
| #wlm-de .wlm-cta:after {
| |
| position: absolute;
| |
| right: 0.7em;
| |
| top: 50%;
| |
| transform: translateY(-61%);
| |
| content: '»';
| |
| display: block;
| |
| font-size: 2em;
| |
| font-weight: normal;
| |
| transition: right 0.3s;
| |
| }
| |
|
| |
| #wlm-de a:hover .wlm-cta:after {
| |
| right: 0.4em;
| |
| }
| |
|
| |
| #wlm-de .wlm-close {
| |
| position: absolute;
| |
| right: 0.4em;
| |
| top: 0.4em;
| |
| }
| |
|
| |
| .banner-container {
| |
| margin: 0;
| |
| max-width: 100%;
| |
| }
| |
|
| |
| @media screen and (max-width:719px) {
| |
| #wlm-de > a .wlm-logo {
| |
| position: absolute;
| |
| background-image: url('//upload.wikimedia.org/wikipedia/commons/9/99/WLM_Sharing_Heritage_Logo_neg.svg');
| |
| }
| |
| #wlm-de>a {
| |
| display: block;
| |
| table-layout: auto;
| |
| height: auto;
| |
| }
| |
| #wlm-de>a>* {
| |
| display: block;
| |
| width: 100%!important;
| |
| min-height: 88px;
| |
| vertical-align: middle;
| |
| }
| |
|
| |
|
| |
|
| |
| #wlm-de>a>.wlm-cta {
| |
| font-size: .8em;
| |
| min-height: 2.8em;
| |
| padding-right: 3em;
| |
| }
| |
|
| |
| #wlm-de>a .wlm-logo {
| |
| background-position: 48% 47%;
| |
| }
| |
| #wlm-de>a br {
| |
| display: none;
| |
| }
| |
| #wlm-de .wlm-close {
| |
| right: 0;
| |
| top: 0;
| |
| }
| |
| #wlm-de .wlm-close a {
| |
| display: block;
| |
| padding: 1em 1em .5em .5em;
| |
| }
| |
| }
| |
|
| |
| @media screen and (max-width:55.8em) {
| |
| .wlm-de {
| |
| position: relative;
| |
| top: -1px;
| |
| margin-left: -20px!important;
| |
| margin-right: -20px!important;
| |
| }
| |
| .wlm-de .outer-box,
| |
| .wlm-de .inner-box {
| |
| padding-left: 2em!important;
| |
| padding-right: 2em!important;
| |
| }
| |
| .wlm-de .inner-box {
| |
| margin-left: -2em!important;
| |
| margin-right: -2em!important;
| |
| }
| |
| .wlm-de .wlm-title {
| |
| font-size: 5.4vw!important;
| |
| }
| |
| }
| |
|
| |
| @media screen and (max-width:30em) {
| |
| .wlm-de .wlm-title {
| |
| font-size: 7.2vw!important;
| |
| }
| |
| }
| |
| </style>
| |
|
| |
| <script type="text/javascript">
| |
| function updateTime(){
| |
|
| |
| var fs = 1000;
| |
| var fm = fs * 60;
| |
| var fh = fm * 60;
| |
| var fd = fh * 24;
| |
|
| |
| var delta = Math.max(0, Date.UTC(2018, 8, 30, 22, 0) - new Date());
| |
|
| |
| var days = Math.floor(delta / fd);
| |
| var hours = Math.floor((delta % fd) / fh);
| |
| var minutes = Math.floor((delta % fh) / fm);
| |
| var seconds = Math.floor((delta % fm) / fs);
| |
|
| |
| var str = (days>1)? days + ' Tage, ' :
| |
| (days<=0)? '' : 'ein Tag, ' ;
| |
|
| |
| str += (hours >1)? hours + ' Stunden und ' :
| |
| (hours <=0)? '' : 'eine Stunde und ' ;
| |
|
| |
| str += (minutes>1)? minutes + ' Minuten' :
| |
| (minutes <=0)? '' : 'eine Minute' ;
| |
|
| |
| console.log('delta :' + delta + ' str: '+str);
| |
| $('.count-down').text(str);
| |
| }
| |
|
| |
| setInterval(updateTime, 30000);
| |
| updateTime();
| |
| </script>
| |
|
| |
| <div id="wlm-de">
| |
| <a href="https://de.m.wikipedia.org/wiki/Wikipedia:Wiki_Loves_Monuments_2018/Deutschland" target="_blank">
| |
| <div class="wlm-logo">WIKI loves monuments</div>
| |
| <div class="wlm-image"></div>
| |
| <div class="wlm-cta"><div class="cta-slides"><div class="cta-slide"><div>{{{text}}}</div></div><div class="cta-slide"><div>{{{Text2}}}</div></div><!--<div class="cta-slide"><div>Nur noch <span class="count-down">wenige Tage</span> – Jetzt hochladen!</div></div>//--></div></div>
| |
| </a>
| |
| <div id="cn-toggle-box" class="wlm-close">
| |
| <a href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;">
| |
| <img border="0" src="https://upload.wikimedia.org/wikipedia/foundation/2/20/CloseWindow19x19.png" alt="{{int:centralnotice-shared-hide}}" /></a>
| |
| </div>
| |
| </div>
| |