1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-06-30 05:31:56 +02:00

footer tweaks

This commit is contained in:
Matthias Kretschmann 2017-09-21 17:30:30 +02:00
parent 935d2376ab
commit ce653065fe
Signed by: m
GPG Key ID: 606EEEF3C479A91F
7 changed files with 50 additions and 51 deletions

View File

@ -15,7 +15,7 @@ url: https://kremalicious.com
author:
name: Matthias Kretschmann
email: m@kretschmann.io
uri: https://kretschmann.io
uri: https://matthiaskretschmann.com
twitter: kremalicious
facebook: matthiaskretschmann
googleplus: +MatthiasKretschmann

View File

@ -8,8 +8,8 @@
@extend .textcenter
padding-top: ($spacer*2)
.gravatar
margin-bottom: ($spacer/2)
.avatar
margin-bottom: ($spacer / 2)
&,
.footer-description
@ -21,6 +21,9 @@
.footer-description
@extend .h5
margin-top: 0
margin-bottom: ($spacer / 4)
a
display: block
@ -46,35 +49,35 @@
@extend .textcenter
margin: 0
.link
@extend .textcenter, .link--nounderline
width: 42px
padding: $padding-small-vertical
margin: 0
display: inline-block
color: $text-color-light
.link
@extend .textcenter, .link--nounderline
width: 1.5rem
padding: $padding-small-vertical
margin: 0
display: inline-block
color: $text-color-light
&:first-child
margin-left: 0
&:first-child
margin-left: 0
&:last-child
margin-right: 0
&:last-child
margin-right: 0
.icon
transition: color .3s ease-in-out
display: block
margin: 0 auto
.icon
transition: color .3s ease-in-out
display: block
margin: 0 auto
.rss:hover .icon
fill: #e15a00
.json:hover .icon
fill: #8BE028
.twitter:hover .icon
fill: #019ad2
.google:hover .icon
fill: #c63b1e
.facebook:hover .icon
fill: #3b5998
.rss:hover .icon
fill: #e15a00
.json:hover .icon
fill: #8BE028
.twitter:hover .icon
fill: #019ad2
.google:hover .icon
fill: #c63b1e
.facebook:hover .icon
fill: #3b5998
.subscribe-title
@extend .h5, .text-dimmed

View File

@ -5,7 +5,6 @@
//
.site__header
background: $body-bg
margin-top: ($spacer/2)
margin-bottom: ($spacer/2)

View File

@ -40,7 +40,7 @@
@media $screen-xs
transform: translate3d(0,-($spacer*7.2),0)
@media $screen-sm
@media $screen-md
transform: translate3d(0,-($spacer*5),0)
.has-menu-open &
@ -49,13 +49,13 @@
.site__footer
margin-top: -($spacer*6.5)
@media $screen-sm
@media $screen-md
margin-top: 0
.has-menu-open &
margin-top: 0
@media $screen-sm and (min-height: 650px)
@media $screen-md and (min-height: 650px)
.site
position: relative
@ -63,7 +63,7 @@
@extend .transition
position: relative
z-index: 2
margin-bottom: 30rem
margin-bottom: 32rem
transform: translate3d(0,($spacer*3),0)
.has-menu-open &

View File

@ -50,7 +50,6 @@
padding: $spacer 0
margin-top: $spacer
margin-bottom: 0
background: $body-bg
display: flex // .nav-popver overwrite
margin-left: 0 // .grid overwrite

View File

@ -1,7 +1,7 @@
<footer class="entry-meta">
<p class="byline author vcard source-org">
<span class="by">by</span> <a class="fn" rel="author" href="https://matthiaskretschmann.com">
<span class="by">by</span> <a class="fn" rel="author" href="{{ site.author.uri }}">
{% if page.author %}
{{ page.author }}
{% else %}

View File

@ -5,7 +5,20 @@
<div class="vcard author">
<img class="avatar photo" src="/assets/img/avatar.jpeg" />
<p class="footer-description">Blog of designer &amp; developer <a class="fn" rel="author" href="https://matthiaskretschmann.com">{{ site.author.name }}</a>
<p class="footer-description">Blog of designer &amp; developer <a class="fn" rel="author" href="{{ site.author.uri }}">{{ site.author.name }}</a>
<p>
<a class="link twitter" href="https://twitter.com/{{ site.author.twitter }}">
<svg class="icon icon-twitter">
<use xlink:href="/assets/img/sprite.svg#twitter"></use>
</svg>
</a>
<a class="link facebook" href="https://www.facebook.com/{{ site.author.facebook }}">
<svg class="icon icon-facebook">
<use xlink:href="/assets/img/sprite.svg#facebook"></use>
</svg>
</a>
</p>
</div>
<aside class="subscribe">
@ -21,21 +34,6 @@
<use xlink:href="/assets/img/sprite.svg#jsonfeed"></use>
</svg>
</a>
<a class="link twitter" href="https://twitter.com/kremaliciouscom">
<svg class="icon icon-twitter">
<use xlink:href="/assets/img/sprite.svg#twitter"></use>
</svg>
</a>
<a class="link google" href="https://plus.google.com/100015950464424503954" rel="publisher">
<svg class="icon icon-google+">
<use xlink:href="/assets/img/sprite.svg#google+"></use>
</svg>
</a>
<a class="link facebook" href="https://www.facebook.com/pages/kremalicious/154539134564052">
<svg class="icon icon-facebook">
<use xlink:href="/assets/img/sprite.svg#facebook"></use>
</svg>
</a>
</p>
</aside>