summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--index.html76
-rw-r--r--js/abmahn.js1
-rw-r--r--style.css58
3 files changed, 90 insertions, 45 deletions
diff --git a/index.html b/index.html
index 8f1a411..8be56b8 100644
--- a/index.html
+++ b/index.html
@@ -234,42 +234,52 @@
234 <div class="push"></div> 234 <div class="push"></div>
235 </div> 235 </div>
236 <div id="footer" class="footer"> 236 <div id="footer" class="footer">
237 <div class="credits"> 237 <div class="scrollcontainer">
238 <div class="creditline"> 238 <div class="credits">
239 <div class="credit partner"><a href="https://ccc.de/">Chaos Computer Club</a></div> 239 <div class="creditline">
240 <a href="https://www.ccc.de/"><div class="credit ccc"><img src="img/ccc.svg" height="50px" alt="Logo des Chaos Computer Clubs"/></div></a> 240 <div class="credit partner"><a href="https://ccc.de/">Chaos Computer Club</a></div>
241 <div class="credit imprint" onclick="show_impressum()">Impressum + Datenschutz</div> 241 <a href="https://www.ccc.de/"><div class="credit ccc"><img src="img/ccc.svg" height="50px" alt="Logo des Chaos Computer Clubs"/></div></a>
242 </div> 242 <div class="credit imprint" onclick="show_impressum()"><span>Impressum + Datenschutz<span></div>
243 <div class="creditline small"> 243 </div>
244 <div class="credit empty"></div> 244 <div class="creditline small">
245 <div class="credit noimg empty"></div> 245 <div class="credit empty"></div>
246 <div class="credit implementor"><a href="http://elektrowecker.de/">Pepo</a> – UX</div> 246 <div class="credit noimg empty"></div>
247 </div> 247 <div class="credit implementor"><a href="http://elektrowecker.de/">Pepo</a> – UX</div>
248 <div class="creditline"> 248 </div>
249 <div class="credit partner"><a href="https://freifunk.net/">Förderverein Freie Netzwerke</a></div> 249 <div class="creditline">
250 <a href="https://freifunk.net/"><div class="credit freifunk"><img src="img/freifunk.svg" height="50px" alt="Logo des Freifunk e. V.s"/></div></a> 250 <div class="credit partner"><a href="https://freifunk.net/">Förderverein Freie Netzwerke</a></div>
251 <div class="credit implementor"><a href="http://www.schlicht-und-ergreifend.de">Malik Aziz</a> – Design</div> 251 <a href="https://freifunk.net/"><div class="credit freifunk"><img src="img/freifunk.svg" height="50px" alt="Logo des Freifunk e. V.s"/></div></a>
252 </div> 252 <div class="credit implementor"><a href="http://www.schlicht-und-ergreifend.de">Malik Aziz</a> – Design</div>
253 <div class="creditline small"> 253 </div>
254 <div class="credit empty"></div> 254 <div class="creditline small">
255 <div class="credit noimg empty"></div> 255 <div class="credit empty"></div>
256 <div class="credit implementor"><a href="https://erdgeist.org/">erdgeist</a> – Konzept &amp; Umsetzung</div> 256 <div class="credit noimg empty"></div>
257 <div class="credit implementor"><a href="https://erdgeist.org/">erdgeist</a> – Konzept &amp; Umsetzung</div>
258 </div>
259 <div class="creditline">
260 <div class="credit partner"><a href="https://freiheitsrechte.org/">Gesellschaft für Freiheitsrechte</a></div>
261 <a href="https://freiheitsrechte.org/"><div class="credit gff"><img src="img/gff.svg" height=50px" alt="Logo des Gesellschaft für Freiheitsrechte e. V."/></div></a>
262 <div class="credit implementor"><a href="https://kanzlei-hubrig.de/">Beata Hubrig</a> – Rechtliches</div>
263 </div>
257 </div> 264 </div>
258 <div class="creditline"> 265 <div class="impressum">
259 <div class="credit partner"><a href="https://freiheitsrechte.org/">Gesellschaft für Freiheitsrechte</a></div> 266 <p>Der Abmahnbeantworter ist ein Projekt des Chaos Computer Club e. V.,</p>
260 <a href="https://freiheitsrechte.org/"><div class="credit gff"><img src="img/gff.svg" height=50px" alt="Logo des Gesellschaft für Freiheitsrechte e. V."/></div></a> 267 <p>des Fördervereins Freie Netzwerke e. V. und der Gesellschaft für Freiheitsrechte e. V.</p>
261 <div class="credit implementor"><a href="https://kanzlei-hubrig.de/">Beata Hubrig</a> – Rechtliches</div> 268 <div class="back circle_num" onclick="hide_impressum()">⇦</div>
269 <div class="visdp">
270 <p><strong>V.i.S.d.P.</strong>
271 <p>Dirk Engling</p>
272 <p>c/o Chaos Computer Club</p>
273 <p>Zeiseweg 9</p>
274 <p>22765 Hamburg</p>
275 <p><a href="mailto:erdgeist@ccc.de">E-Mail: erdgeist@ccc.de</a></p>
276 </div>
277 <div class="datenschutz">
278 <p><strong>Datenschutzerklärung</strong></p>
279 <p>Eine Erhebung von personenbezogenen Daten der Nutzer dieser Website findet nicht statt. Auch der Webserver speichert keine IP-Adressen der Nutzer.</p>
280 </div>
262 </div> 281 </div>
263 </div> 282 </div>
264 <div class="impressum">
265 <p>Ein Projekt des Chaos Computer Club e. V.,</p>
266 <p>des Fördervereins Freie Netzwerke e. V. und der Gesellschaft für Freiheitsrechte e. V.</p>
267 <p>V.i.S.d.P: Dirk Engling</p>
268 <p>c/o Chaos Computer Club</p>
269 <p>Zeiseweg 9</p>
270 <p>22765 Hamburg</p>
271 <p><a href="mailto:erdgeist@ccc.de">E-Mail: erdgeist@ccc.de</a></p>
272 </div>
273 </div> 283 </div>
274 </body> 284 </body>
275</html> 285</html>
diff --git a/js/abmahn.js b/js/abmahn.js
index 7ecdff4..c8e5e9a 100644
--- a/js/abmahn.js
+++ b/js/abmahn.js
@@ -65,6 +65,7 @@ function step4_done() { scrollTo(289); setClass('wrapper', 'step5'); }
65function step5_done() { scrollTo(382); setClass('wrapper', 'step6'); } 65function step5_done() { scrollTo(382); setClass('wrapper', 'step6'); }
66function step6_done() { scrollTo(475); setClass('wrapper', 'step7'); } 66function step6_done() { scrollTo(475); setClass('wrapper', 'step7'); }
67 67
68function hide_impressum() { setClass('footer', 'footer'); }
68function show_impressum() { setClass('footer', 'footer show-imprint'); } 69function show_impressum() { setClass('footer', 'footer show-imprint'); }
69 70
70function waldorf() { 71function waldorf() {
diff --git a/style.css b/style.css
index 8a14966..8570410 100644
--- a/style.css
+++ b/style.css
@@ -468,13 +468,16 @@ select.zeit {
468 468
469.footer .partner a:link, 469.footer .partner a:link,
470.footer .implementor a:link, 470.footer .implementor a:link,
471.footer .imprint a:link,
472.footer .partner a:visited, 471.footer .partner a:visited,
473.footer .implementor a:visited, 472.footer .implementor a:visited,
474.footer .imprint a:visited { 473.footer .imprint span {
475 border-bottom: dotted 1px rgba(0,0,0,0.25); 474 border-bottom: dotted 1px rgba(0,0,0,0.25);
476} 475}
477 476
477.footer .imprint {
478 cursor: pointer;
479}
480
478.credit { 481.credit {
479 display: inline-block; 482 display: inline-block;
480 vertical-align: top; 483 vertical-align: top;
@@ -524,31 +527,62 @@ select.zeit {
524 width: 100px; 527 width: 100px;
525} 528}
526 529
530.scrollcontainer {
531 width: 200%;
532}
533
527.impressum { 534.impressum {
528 width: 100%; 535 float: right;
529 float: left; 536 width: 50%;
530 display: inline; 537 height: 260px;
531 position: relative; 538 position: relative;
532 transition: left 2s; 539 transition: left 2s;
533 top: 0; 540 top: 0;
534 left: 100%; 541 left: 0%;
542}
543
544.impressum p {
545 margin: 0 0 .1em 0;
535} 546}
536 547
537.footer.show-imprint .impressum { 548.footer.show-imprint .impressum {
538 left: 0%; 549 left: -50%;
550 top: 0;
539} 551}
540 552
541.credits { 553.credits {
542 width: 100%; 554 width: 50%;
543 float: left; 555 float: left;
544 display: inline;
545 position: relative; 556 position: relative;
557 overflow: hidden;
546 left: 0; 558 left: 0;
547 transition: max-width 2s, left 2s, width 2s; 559 transition: max-width 2s, left 2s, width 2s;
548} 560}
549 561
550.footer.show-imprint .credits { 562.footer.show-imprint .credits {
551 left: -100%; 563 left: -50%;
552 width: 0; 564}
553 max-width: 0; 565
566.visdp,
567.datenschutz {
568 vertical-align: top;
569 display: inline-block;
570 width: 250px;
571 margin-top: 2em;
572}
573
574.back {
575 background-color: #8E99A0;
576 display: inline-block;
577 float: none;
578 color: #F1F2E3;
579 line-height: 1.4em;
580 width: 40px;
581 height: 40px;
582 cursor: pointer;
583 margin-top: 65px;
584}
585
586.back:hover {
587 background-color: black;
554} 588}