new footer

This commit is contained in:
meaz 2019-10-25 19:09:22 +02:00
parent 0e21e2672c
commit 95eebf512f
3 changed files with 68 additions and 43 deletions

View File

@ -224,8 +224,9 @@ Disroot Media Queries
/* Footer
------------------------------------*/
/* copyleft */
footer #copyleft { display: none; }
/* Icons */
footer #footer-icons { display: none; }
footer #footer-logo { display: none; }
/* Go To Top Button */
#go-top { margin-left: -22px; }

View File

@ -755,36 +755,65 @@ textarea {
------------------------------------*/
footer {
height: 110px;
padding-top: 20px;
padding-bottom: 24px;
height: 80px;
background-color: #2e131e;
color: #FFFFFF;
font-size: 10px;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 1.5px;
color: #b9a2ab;
font-weight: 600;
line-height: 8px;
margin-top: -60px;
position: relative;
z-index: 9;
left: 0;
bottom: 0;
width: 100%;
display: flex;
justify-content: center;
text-align: center;
align-items: center;
}
footer #footer-logo {
float: left;
display: block;
background: url("../images/logo_white.png") no-repeat right center;
background-size: 200px auto;
height: 60px;
width: 300px;
height: 45px;
width: 15%;
background: url("../images/d-white.png") no-repeat left center;
background-size: 40px 40px;
opacity: 0.7;
display: inline-block;
}
footer .dot {
height: 5px;
width: 5px;
background-color: #b9a2ab;
border-radius: 50%;
display: inline-block;
}
footer #footer-links {
float: right;
text-align: left;
padding-right: 70px;
text-align: center;
width: 60%;
}
footer ul.footer-links {
display: flex;
justify-content: center;
align-items: center;
}
footer ul.footer-icons {
display: flex;
justify-content: end;
align-items: center;
}
footer div#footer-links ul li {
padding-left: 20px;
padding-right: 20px;
margin: 0;
padding-top: 13px;
}
footer #footer-links a {
color: #b9a2ab;
}
@ -792,33 +821,25 @@ footer #footer-links a:hover {
color: #FFFFFF;
}
footer #copyleft {
position: absolute;
pointer-events: none;
footer #footer-icons {
width: 25%;
background: transparent;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 100%;
clear: both;
}
opacity: 0.7;
}
footer .button, footer .button:active, footer .button:visited {
background: none;
color: #b9a2ab;
pointer-events: auto;
padding: 0px 10px;
footer #footer-icons ul li {
margin: 0;
padding-right: 10px;
padding-top: 10px;
text-align: right;
}
footer .button:hover{
background: transparent;
color: #FFFFFF;
}
footer a, footer a:visited { color: #FFFFFF; }
footer a:hover, footer a:focus { color: #1F5C60; }
/* Go To Top Button */
#go-top {
position: absolute;

View File

@ -1,16 +1,19 @@
<footer>
<div id="footer-logo"></div>
<div id="footer-logo" ></div>
<div id="footer-links">
<ul>
<ul class="footer-links">
<li><a href="https://disroot.org/tos">Copyleft Disroot.org</a></li>
<li><span class="dot"></span></li>
<li><a href="https://disroot.org/tos">Terms Of Service</a></li>
<li><span class="dot"></span></li>
<li><a href="https://disroot.org/privacy_policy">Privacy Policy</a></li>
</ul>
</div>
<div id="copyleft">
<p>
<a class="button" href="{{ base_url }}/blog.atom"><i class="fa fa-rss-square fa-fw"></i> Atom 1.0</a>
<a class="button" href="{{ base_url }}/blog.rss"><i class="fa fa-rss-square fa-fw"></i> RSS</a>
<br>copyleft disroot.org
</p>
<div id="footer-icons">
<ul class="footer-icons">
<li><a href="https://hub.disroot.org/channel/disroot"><i class="fa fa-hubzilla fa-fw fa-3x"></i></a></li>
<li><a href="https://social.weho.st/@disroot"><i class="fa fa-mastodon fa-fw fa-3x"></i></a></li>
<li><a href="{{ base_url }}/blog.atom"><i class="fa fa-rss-square fa-fw fa-3x"></i></a></li>
</ul>
</div>
</footer>