Changed footer layout
This commit is contained in:
parent
46d13e2bba
commit
af569859e5
@ -1,39 +1,12 @@
|
|||||||
<footer class="site-footer">
|
<footer class="site-footer">
|
||||||
|
|
||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
|
|
||||||
<h2 class="footer-heading">{{ site.title | escape }}</h2>
|
<h2 class="footer-heading">{{ site.title | escape }}</h2>
|
||||||
|
<p><em>{{ site.description | escape }}</em></p>
|
||||||
<div class="footer-col-wrapper">
|
{% if site.author %}
|
||||||
<div class="footer-col footer-col-1">
|
<br>{{ site.author | escape }}
|
||||||
<ul class="contact-list">
|
{% endif %}
|
||||||
<li>
|
{% if site.email %}
|
||||||
{% if site.author %}
|
<br><a href="mailto:{{ site.email }}">{{ site.email }}
|
||||||
{{ site.author | escape }}
|
{% endif %}
|
||||||
{% else %}
|
|
||||||
{{ site.title | escape }}
|
|
||||||
{% endif %}
|
|
||||||
</li>
|
|
||||||
{% if site.email %}
|
|
||||||
<li><a href="mailto:{{ site.email }}">{{ site.email }}</a></li>
|
|
||||||
{% endif %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="footer-col footer-col-2">
|
|
||||||
<ul class="social-media-list">
|
|
||||||
{% if site.github_username %}
|
|
||||||
<li>
|
|
||||||
{% include icon-github.html username=site.github_username %}
|
|
||||||
</li>
|
|
||||||
{% endif %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="footer-col footer-col-3">
|
|
||||||
<p>{{ site.description | escape }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|||||||
@ -82,62 +82,6 @@
|
|||||||
margin-bottom: $spacing-unit / 2;
|
margin-bottom: $spacing-unit / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.contact-list,
|
|
||||||
.social-media-list {
|
|
||||||
list-style: none;
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-col-wrapper {
|
|
||||||
font-size: 15px;
|
|
||||||
margin-left: -$spacing-unit / 2;
|
|
||||||
@extend %clearfix;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-col {
|
|
||||||
float: left;
|
|
||||||
margin-bottom: $spacing-unit / 2;
|
|
||||||
padding-left: $spacing-unit / 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-col-1 {
|
|
||||||
width: -webkit-calc(35% - (#{$spacing-unit} / 2));
|
|
||||||
width: calc(35% - (#{$spacing-unit} / 2));
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-col-2 {
|
|
||||||
width: -webkit-calc(20% - (#{$spacing-unit} / 2));
|
|
||||||
width: calc(20% - (#{$spacing-unit} / 2));
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-col-3 {
|
|
||||||
width: -webkit-calc(45% - (#{$spacing-unit} / 2));
|
|
||||||
width: calc(45% - (#{$spacing-unit} / 2));
|
|
||||||
}
|
|
||||||
|
|
||||||
@include media-query($on-laptop) {
|
|
||||||
.footer-col-1,
|
|
||||||
.footer-col-2 {
|
|
||||||
width: -webkit-calc(50% - (#{$spacing-unit} / 2));
|
|
||||||
width: calc(50% - (#{$spacing-unit} / 2));
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-col-3 {
|
|
||||||
width: -webkit-calc(100% - (#{$spacing-unit} / 2));
|
|
||||||
width: calc(100% - (#{$spacing-unit} / 2));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include media-query($on-palm) {
|
|
||||||
.footer-col {
|
|
||||||
float: none;
|
|
||||||
width: -webkit-calc(100% - (#{$spacing-unit} / 2));
|
|
||||||
width: calc(100% - (#{$spacing-unit} / 2));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Page content
|
* Page content
|
||||||
*/
|
*/
|
||||||
|
|||||||
Reference in New Issue
Block a user