mirror of
https://github.com/kremalicious/blog.git
synced 2024-11-22 01:46:51 +01:00
gravatar and footer refinements, closes #9
This commit is contained in:
parent
d46f6292a0
commit
199caa0b1a
@ -14,6 +14,7 @@ name: kremalicious
|
||||
description: 'Blog of designer & developer Matthias Kretschmann'
|
||||
url: http://kremalicious.com
|
||||
author: Matthias Kretschmann
|
||||
email: m@kretschmann.io
|
||||
|
||||
|
||||
# Urls
|
||||
|
@ -1,5 +1,7 @@
|
||||
<footer class="entry-meta">
|
||||
<p class="byline author vcard source-org"><span class="by">by</span> <a class="fn" rel="author" href="/about/">{{ page.author }}</a></p>
|
||||
<p class="byline author vcard source-org">
|
||||
<span class="by">by</span> <a class="fn" rel="author" href="/about/">{{ page.author }}</a>
|
||||
</p>
|
||||
|
||||
<time class="pubdate" datetime="{{ page.date | date_to_xmlschema }}" pubdate{% if updated %} data-updated="true"{% endif %}>{{ page.date | timeago }}</time>
|
||||
|
||||
|
@ -1,15 +1,16 @@
|
||||
<footer role="contentinfo" class="footer container">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<img class="gravatar photo" src="{{ site.email | to_secure_gravatar }}?s=160" />
|
||||
<p class="footer-description">Blog of designer & developer <a href="http://matthiaskretschmann.com">Matthias Kretschmann</a></p>
|
||||
|
||||
<aside class="subscribe">
|
||||
<h1 class="subscribe-title">Subscribe</h1>
|
||||
<p>
|
||||
<a class="btn rss" href="http://kremalicious.com/feed"><i class="icon-rss"></i> <span>RSS</span></a>
|
||||
<a class="btn twitter" href="https://twitter.com/kremaliciouscom"><i class="icon-twitter"></i> <span>Twitter</span></a>
|
||||
<a class="btn google" href="https://plus.google.com/100015950464424503954" rel="publisher"><i class="icon-googleplus"></i> <span>Google+</span></a>
|
||||
<a class="btn facebook" href="https://www.facebook.com/pages/kremalicious/154539134564052"><i class="icon-facebook"></i> <span>Facebook</span></a>
|
||||
<a class="btn rss icon-rss" href="http://kremalicious.com/feed"></a>
|
||||
<a class="btn twitter icon-twitter" href="https://twitter.com/kremaliciouscom"></a>
|
||||
<a class="btn google icon-googleplus" href="https://plus.google.com/100015950464424503954" rel="publisher"></a>
|
||||
<a class="btn facebook icon-facebook" href="https://www.facebook.com/pages/kremalicious/154539134564052"></a>
|
||||
</p>
|
||||
</aside>
|
||||
</div>
|
||||
|
@ -10,7 +10,7 @@
|
||||
|
||||
<nav role="navigation" class="nav-main">
|
||||
<a class="menu-btn icon-list" href="#"></a>
|
||||
<div class="nav-popover">
|
||||
<div class="nav-popover hide">
|
||||
<a class="nav-link goodies icon-gift" href="/goodies/">goodies</a>
|
||||
<a class="nav-link photos icon-pictures" href="/photos/">photos</a>
|
||||
<a class="nav-link personal icon-user" href="/personal/">personal</a>
|
||||
|
25
_src/_plugins/gravatar.rb
Normal file
25
_src/_plugins/gravatar.rb
Normal file
@ -0,0 +1,25 @@
|
||||
#
|
||||
# https://github.com/ldesgrange/jekyll-gravatar-filter
|
||||
#
|
||||
require 'digest/md5'
|
||||
|
||||
module Jekyll
|
||||
module GravatarFilter
|
||||
def to_gravatar(input)
|
||||
"http://www.gravatar.com/avatar/#{hash(input)}"
|
||||
end
|
||||
|
||||
def to_secure_gravatar(input)
|
||||
"https://secure.gravatar.com/avatar/#{hash(input)}"
|
||||
end
|
||||
|
||||
private :hash
|
||||
|
||||
def hash(email)
|
||||
email_address = email ? email.downcase.strip : ''
|
||||
Digest::MD5.hexdigest(email_address)
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
Liquid::Template.register_filter(Jekyll::GravatarFilter)
|
@ -95,9 +95,16 @@ var siteNavigation = {
|
||||
// toggle menu
|
||||
$('body').toggleClass('menu-open');
|
||||
|
||||
if ( $('body').hasClass('menu-open') ) {
|
||||
$thepop.removeClass('hide');
|
||||
} else {
|
||||
$thepop.addClass('hide');
|
||||
}
|
||||
|
||||
// bind the hide controls
|
||||
$(document).bind('click.hidethepop', function() {
|
||||
$('body').removeClass('menu-open');
|
||||
$thepop.toggleClass('hide');
|
||||
// unbind the hide controls
|
||||
$(document).unbind('click.hidethepop');
|
||||
});
|
||||
|
@ -200,6 +200,13 @@ time {
|
||||
margin-top: @line-height-computed;
|
||||
}
|
||||
|
||||
.gravatar {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
.border-radius(80px);
|
||||
border: 2px solid #fff;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Related posts
|
||||
|
@ -38,6 +38,7 @@
|
||||
.nav-popover {
|
||||
padding: @line-height-computed*1.5 0;
|
||||
width: 100%;
|
||||
background: @body-bg;
|
||||
.clearfix;
|
||||
|
||||
.nav-link {
|
||||
|
@ -116,8 +116,13 @@ a.close,
|
||||
border-top: 1px solid rgba(255,255,255,.7);
|
||||
box-shadow: inset 0 1px 4px fade(@brand-dark, 20%);
|
||||
|
||||
.gravatar {
|
||||
margin-bottom: @line-height-computed/2;
|
||||
}
|
||||
|
||||
.footer-description {
|
||||
.h5;
|
||||
a { display: block; }
|
||||
}
|
||||
|
||||
&,
|
||||
@ -143,45 +148,50 @@ a.close,
|
||||
p {
|
||||
margin: 0;
|
||||
.clearfix;
|
||||
.btn {
|
||||
margin-bottom: 0;
|
||||
padding: .3em 1em;
|
||||
&:first-child {
|
||||
margin-left:0
|
||||
}
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
span {
|
||||
.visuallyhidden;
|
||||
}
|
||||
}
|
||||
text-align: center;
|
||||
}
|
||||
i {
|
||||
display: block;
|
||||
|
||||
.btn {
|
||||
width: 48px;
|
||||
height: 40px;
|
||||
line-height: 34px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
color: @text-color-light;
|
||||
&:before {
|
||||
text-align: center;
|
||||
|
||||
&:first-child { margin-left: 0 }
|
||||
&:last-child { margin-right: 0 }
|
||||
|
||||
&:before {
|
||||
// Icon resets for color animations
|
||||
.transition(color .3s ease-in-out);
|
||||
color: inherit;
|
||||
margin-right: 0;
|
||||
}
|
||||
margin: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer:hover .subscribe .rss i:before {
|
||||
.subscribe-title {
|
||||
.h5;
|
||||
color: @text-color-dimmed;
|
||||
margin-bottom: @line-height-computed/2;
|
||||
}
|
||||
|
||||
.footer:hover .subscribe .rss:before {
|
||||
color: #e15a00;
|
||||
}
|
||||
|
||||
.footer:hover .subscribe .twitter i:before {
|
||||
.footer:hover .subscribe .twitter:before {
|
||||
color: #019ad2;
|
||||
}
|
||||
|
||||
.footer:hover .subscribe .google i:before {
|
||||
.footer:hover .subscribe .google:before {
|
||||
color: #c63b1e;
|
||||
}
|
||||
|
||||
.footer:hover .subscribe .facebook i:before {
|
||||
.footer:hover .subscribe .facebook:before {
|
||||
color: #3b5998;
|
||||
}
|
||||
|
||||
@ -213,7 +223,7 @@ a.close,
|
||||
.menu-open & {
|
||||
margin-top: 300px;
|
||||
}
|
||||
margin-bottom: 380px;
|
||||
margin-bottom: 580px;
|
||||
|
||||
border-top: 1px solid rgba(255,255,255,.7);
|
||||
border-bottom: 1px solid rgba(255,255,255,.7);
|
||||
@ -233,7 +243,7 @@ a.close,
|
||||
|
||||
.footer {
|
||||
z-index: 0;
|
||||
height: 380px;
|
||||
height: 580px;
|
||||
bottom: 0;
|
||||
box-shadow: none;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user