updated footer on inner pages

This commit is contained in:
Andrei Mironov 2017-03-13 12:22:52 +03:00
parent ff3995ac9d
commit 4322b6be79
5 changed files with 151 additions and 40 deletions

View File

@ -1959,6 +1959,11 @@ input.email-form__input--email:disabled {
background-color: #4A5C69;
border-top: 100px solid #4A5C69; }
.footer.footer--page {
position: static;
margin: -96px 0 0 0;
border-top: 56px solid #4A5C69; }
.footer-inner {
display: -ms-flexbox;
display: flex;
@ -2074,6 +2079,8 @@ input.email-form__input--email:disabled {
.footer {
position: static;
border-top: 0px; }
.footer.footer--page {
border-top: 100px solid #4A5C69; }
.footer-inner {
padding: 30px 0 0 0;
-ms-flex-direction: column;

View File

@ -65,20 +65,52 @@
<a class="page__footer-link" href="/">Learn more about Status</a>
</div>
</div>
</div>
</div>
<div class="footer footer--page">
<div class="footer-inner">
<div class="footer">
<ul class="social-links ">
<li class="social-link social-link--fb social-link--inversed"><a href="https://www.facebook.com/ethstatus" target="_blank"></a></li>
<li class="social-link social-link--tw social-link--inversed"><a href="https://twitter.com/ethstatus" target="_blank"></a></li>
<li class="social-link social-link--sl social-link--inversed"><a href="http://slack.status.im/" target="_blank"></a></li>
<li class="social-link social-link--gh social-link--inversed"><a href="https://github.com/status-im" target="_blank"></a></li>
<li class="social-link social-link--rd social-link--inversed"><a href="https://www.reddit.com/r/statusim/" target="_blank"></a></li>
</ul>
<div class="address">
Status Holdings Pte.&nbsp;Ltd.<br/>22&nbsp;Sin&nbsp;Ming&nbsp;Lane<br/>Singapore
</div>
<div class="footer-logo-wrap">
<div class="footer-logo-wrap__inner">
<div class="footer-logo"></div>
<div class="footer-address"> Status Holdings Pte.&nbsp;Ltd.<br/>22&nbsp;Sin&nbsp;Ming&nbsp;Lane<br/>Singapore</div>
</div>
</div>
<div class="footer-table">
<div class="footer-table__column">
<h4 class="footer-header">Social links</h4>
<ul class="footer-list">
<li class="footer-link footer-link--fb"><a href="https://www.facebook.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Facebook</span></a></li>
<li class="footer-link footer-link--tw"><a href="https://twitter.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Twitter</span></a></li>
<li class="footer-link footer-link--sl"><a href="http://slack.status.im/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Slack</span></a></li>
<li class="footer-link footer-link--gh"><a href="https://github.com/status-im" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Github</span></a></li>
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
</ul>
</div>
<div class="footer-table__column">
<h4 class="footer-header">More</h4>
<ul class="footer-list">
<li class="footer-link"><a href="https://wiki.status.im" target="_blank">Status Wiki</a></li>
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
</ul>
</div>
<div class="footer-table__column">
<h4 class="footer-header">Language</h4>
<ul class="footer-list">
<li class="footer-link">
<select class="language-switcher" name="lang">
<option value="en">English</option>
</select>
</li>
</ul>
</div>
</div>
</div>
</div>

View File

@ -64,23 +64,54 @@
<a class="page__footer-link" href="/">Learn more about Status</a>
</div>
</div>
<div class="footer">
<ul class="social-links ">
<li class="social-link social-link--fb social-link--inversed"><a href="https://www.facebook.com/ethstatus" target="_blank"></a></li>
<li class="social-link social-link--tw social-link--inversed"><a href="https://twitter.com/ethstatus" target="_blank"></a></li>
<li class="social-link social-link--sl social-link--inversed"><a href="http://slack.status.im/" target="_blank"></a></li>
<li class="social-link social-link--gh social-link--inversed"><a href="https://github.com/status-im" target="_blank"></a></li>
<li class="social-link social-link--rd social-link--inversed"><a href="https://www.reddit.com/r/statusim/" target="_blank"></a></li>
</ul>
<div class="address">
Status Holdings Pte.&nbsp;Ltd.<br/>22&nbsp;Sin&nbsp;Ming&nbsp;Lane<br/>Singapore
</div>
</div>
</div>
</div>
<div class="footer footer--page">
<div class="footer-inner">
<div class="footer-logo-wrap">
<div class="footer-logo-wrap__inner">
<div class="footer-logo"></div>
<div class="footer-address"> Status Holdings Pte.&nbsp;Ltd.<br/>22&nbsp;Sin&nbsp;Ming&nbsp;Lane<br/>Singapore</div>
</div>
</div>
<div class="footer-table">
<div class="footer-table__column">
<h4 class="footer-header">Social links</h4>
<ul class="footer-list">
<li class="footer-link footer-link--fb"><a href="https://www.facebook.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Facebook</span></a></li>
<li class="footer-link footer-link--tw"><a href="https://twitter.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Twitter</span></a></li>
<li class="footer-link footer-link--sl"><a href="http://slack.status.im/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Slack</span></a></li>
<li class="footer-link footer-link--gh"><a href="https://github.com/status-im" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Github</span></a></li>
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
</ul>
</div>
<div class="footer-table__column">
<h4 class="footer-header">More</h4>
<ul class="footer-list">
<li class="footer-link"><a href="https://wiki.status.im" target="_blank">Status Wiki</a></li>
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
</ul>
</div>
<div class="footer-table__column">
<h4 class="footer-header">Language</h4>
<ul class="footer-list">
<li class="footer-link">
<select class="language-switcher" name="lang">
<option value="en">English</option>
</select>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Google Analytics -->
<script>
(function(i, s, o, g, r, a, m) {

View File

@ -1,4 +1,3 @@
.footer {
position: fixed;
width: 100%;
@ -12,6 +11,12 @@
border-top: 100px solid #4A5C69
}
.footer.footer--page {
position: static;
margin: -96px 0 0 0;
border-top: 56px solid #4A5C69
}
.footer-inner {
display: flex;
justify-content: space-between;
@ -145,6 +150,10 @@
border-top: 0px;
}
.footer.footer--page {
border-top: 100px solid #4A5C69
}
.footer-inner {
padding: 30px 0 0 0;
flex-direction: column;

View File

@ -69,22 +69,54 @@
<a class="page__footer-link" href="http://slack.status.im/">Learn more about Status</a>
</div>
</div>
<div class="footer">
<ul class="social-links ">
<li class="social-link social-link--fb social-link--inversed"><a href="https://www.facebook.com/ethstatus" target="_blank"></a></li>
<li class="social-link social-link--tw social-link--inversed"><a href="https://twitter.com/ethstatus" target="_blank"></a></li>
<li class="social-link social-link--sl social-link--inversed"><a href="http://slack.status.im/" target="_blank"></a></li>
<li class="social-link social-link--gh social-link--inversed"><a href="https://github.com/status-im" target="_blank"></a></li>
<li class="social-link social-link--rd social-link--inversed"><a href="https://www.reddit.com/r/statusim/" target="_blank"></a></li>
</ul>
<div class="address">
Status Holdings Pte.&nbsp;Ltd.<br/>22&nbsp;Sin&nbsp;Ming&nbsp;Lane<br/>Singapore
</div>
</div>
</div>
</div>
<div class="footer footer--page">
<div class="footer-inner">
<div class="footer-logo-wrap">
<div class="footer-logo-wrap__inner">
<div class="footer-logo"></div>
<div class="footer-address"> Status Holdings Pte.&nbsp;Ltd.<br/>22&nbsp;Sin&nbsp;Ming&nbsp;Lane<br/>Singapore</div>
</div>
</div>
<div class="footer-table">
<div class="footer-table__column">
<h4 class="footer-header">Social links</h4>
<ul class="footer-list">
<li class="footer-link footer-link--fb"><a href="https://www.facebook.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Facebook</span></a></li>
<li class="footer-link footer-link--tw"><a href="https://twitter.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Twitter</span></a></li>
<li class="footer-link footer-link--sl"><a href="http://slack.status.im/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Slack</span></a></li>
<li class="footer-link footer-link--gh"><a href="https://github.com/status-im" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Github</span></a></li>
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
</ul>
</div>
<div class="footer-table__column">
<h4 class="footer-header">More</h4>
<ul class="footer-list">
<li class="footer-link"><a href="https://wiki.status.im" target="_blank">Status Wiki</a></li>
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
</ul>
</div>
<div class="footer-table__column">
<h4 class="footer-header">Language</h4>
<ul class="footer-list">
<li class="footer-link">
<select class="language-switcher" name="lang">
<option value="en">English</option>
</select>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Google Analytics -->
<script>
(function(i, s, o, g, r, a, m) {