Added signature edge to footer.

This commit is contained in:
Stephan 2021-03-14 18:01:33 +01:00
parent 959dfffdb8
commit 4e57ddd4ba
3 changed files with 93 additions and 27 deletions

View File

@ -801,16 +801,41 @@ hr.-even {
/* footer - Start */ /* footer - Start */
footer { footer {
margin-top: 2px;
background-color: var(--wtf-footer-grey); background-color: var(--wtf-footer-grey);
color: white; color: white;
padding: 3% 1%; padding: 0 0 3% 0;
display: grid;
grid-template-rows: 46px auto;
grid-template-columns: auto 68px 15%;
}
.footer__wrapper {
grid-column: 1 / span 3;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
padding-top: 3%;
max-width: 1200px;
margin: 0 auto;
} }
.footer__wrapper, .footer__nav { .footer__top_bar_left {
background-color: var(--wtf-light-grey);
}
.footer__top_bar_mid {
background-image: url("../images/footer_triangles.svg");
}
.footer__top_bar_right {
background-color: var(--wtf-footer-grey);
}
.footer__content_box {
}
.footer__nav {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
@ -1464,4 +1489,28 @@ footer {
max-width: 450px; max-width: 450px;
} }
/* homepage - end */ /* homepage - end */
/* footer - start */
footer {
grid-template-rows: 23px auto;
grid-template-columns: auto 34px 15%;
}
.footer__wrapper {
padding: 6% 0%;
}
.footer__nav {
flex-direction: column;
}
.footer__navitem {
margin: 1rem 0;
padding: 0;
order: 2;
}
.footer__navitem.-second {
order: 1;
}
/* footer - end */
} }

View File

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 68 46" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g transform="matrix(0.829268,0,0,0.836364,-311.805,-398.945)">
<g id="bottom-left-corner" serif:id="bottom left corner">
<path d="M458,532L458,477L376,532L458,532Z" style="fill:#344b5d;"/>
</g>
</g>
<g transform="matrix(-0.829268,-8.68929e-19,-8.68929e-19,-0.836364,379.805,444.945)">
<g id="bottom-left-corner1" serif:id="bottom left corner">
<path d="M458,532L458,477L376,532L458,532Z" style="fill:#edefeb;"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 945 B

View File

@ -74,31 +74,34 @@ __ ____________________
</main> </main>
<footer> <footer>
<div class="footer__wrapper"> <div class="footer__top_bar_left"></div>
<ul class="footer__nav"> <div class="footer__top_bar_mid"></div>
<li class="footer__navitem"> <div class="footer__top_bar_right"></div>
<p>folgt uns auf:</p> <div class="footer__wrapper">
<a href="https://chaos.social/@HackerGeno"> <ul class="footer__nav">
<img alt="Mastodon Logo" class="social-logo" src="{{ '/images/mastodon_logo.svg'|url }}"/> <li class="footer__navitem -first">
</a> <p>folgt uns auf:</p>
<a href="https://chaos.social/@HackerGeno">
<img alt="Mastodon Logo" class="social-logo" src="{{ '/images/mastodon_logo.svg'|url }}"/>
</a>
</li> </li>
<li class="footer__navitem"> <li class="footer__navitem -second">
WTF Kooperative eG<br/> WTF Kooperative eG<br/>
Forsmannstr. 14b<br/> Forsmannstr. 14b<br/>
22303 Hamburg<br/> 22303 Hamburg<br/>
<a class="footer__navlink" href="mailto:info@wtf-eg.de">info@wtf-eg.de</a><br/> <a class="footer__navlink" href="mailto:info@wtf-eg.de">info@wtf-eg.de</a><br/>
<br/> <br/>
Registergericht: AG Hamburg<br/> Registergericht: AG Hamburg<br/>
Registernummer: GnR 1113<br/> Registernummer: GnR 1113<br/>
</li> </li>
<li class="footer__navitem"> <li class="footer__navitem -third">
<a class="footer__navlink" href="{{ '/impressum'|url }}">Impressum</a> | <a class="footer__navlink" href="{{ '/datenschutz'|url }}">Datenschutzerklärung</a> <br/> <a class="footer__navlink" href="{{ '/impressum'|url }}">Impressum</a> | <a class="footer__navlink" href="{{ '/datenschutz'|url }}">Datenschutzerklärung</a> <br/>
© 2021 WTF Kooperative eG © 2021 WTF Kooperative eG
</li> </li>
</ul> </ul>
</div> </div>
</footer> </footer>
<script type="text/javascript" src="{{ '/js/nav_toggle.js'|url }}"></script> <script type="text/javascript" src="{{ '/js/nav_toggle.js'|url }}"></script>
</body> </body>