Skip to content

Commit 15d318a

Browse files
bluenexbluenex
committed
trying to add avatar to post page
1 parent c21d12f commit 15d318a

File tree

6 files changed

+133
-27
lines changed

6 files changed

+133
-27
lines changed

Diff for: ‎_data/authors.yml

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# Authors
2+
3+
Titipata:
4+
name: TITIPATA
5+
web: http://thewhip.com
6+
email: [email protected]
7+
bio: "What do you want, jewels? I am a very extravagant man."
8+
avatar: bio-photo-2.jpg
9+
twitter: extravagantman
10+
google:
11+
plus: BillyRick
12+
13+
cornelius_fiddlebone:
14+
name: Cornelius Fiddlebone
15+
email: [email protected]
16+
bio: "I ordered what?"
17+
avatar: bio-photo.jpg
18+
twitter: rhymeswithsackit
19+
google:
20+
plus: CorneliusFiddlebone

Diff for: ‎_includes/_author-bio.html

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{% if page.author %}
2+
{% assign author = site.data.authors[page.author] %}{% else %}{% assign author = site.owner %}
3+
{% endif %}
4+
5+
<div itemscope itemtype="http://schema.org/Person">
6+
7+
{% if author.avatar contains 'http' %}
8+
<img src="{{ author.avatar }}" class="bio-photo" alt="{{ author.name }} bio photo">
9+
{% else %}
10+
<img src="{{ site.url }}/images/{{ author.avatar }}" class="bio-photo" alt="{{ author.name }} bio photo">
11+
{% endif %}
12+
13+
<h3 itemprop="name">{{ author.name }}</h3>
14+
<p>{{ author.bio }}</p>
15+
{% if author.email %}<a href="mailto:{{ author.email }}" class="author-social" target="_blank"><i class="fa fa-fw fa-envelope-square"></i>Email</a>{% endif %}
16+
{% if author.twitter %}<a href="http://twitter.com/{{ author.twitter }}" class="author-social" target="_blank"><i class="fa fa-fw fa-twitter-square"></i>Twitter</a>{% endif %}
17+
{% if author.facebook %}<a href="http://facebook.com/{{ author.facebook }}" class="author-social" target="_blank"><i class="fa fa-fw fa-facebook-square"></i>Facebook</a>{% endif %}
18+
{% if author.google.plus %}<a href="http://plus.google.com/+{{ author.google.plus }}" class="author-social" target="_blank"><i class="fa fa-fw fa-google-plus-square"></i>Google+</a>{% endif %}
19+
{% if author.linkedin %}<a href="http://linkedin.com/in/{{ author.linkedin }}" class="author-social" target="_blank"><i class="fa fa-fw fa-linkedin-square"></i>LinkedIn</a>{% endif %}
20+
{% if author.xing %}<a href="http://www.xing.com/profile/{{ author.xing }}" class="author-social" target="_blank"><i class="fa fa-fw fa-xing-square"></i>XING</a>{% endif %}
21+
{% if author.instagram %}<a href="http://instagram.com/{{ author.instagram }}" class="author-social" target="_blank"><i class="fa fa-fw fa-instagram"></i>Instagram</a>{% endif %}
22+
{% if author.tumblr %}<a href="http://{{ author.tumblr }}.tumblr.com" class="author-social" target="_blank"><i class="fa fa-fw fa-tumblr-square"></i>Tumblr</a>{% endif %}
23+
{% if author.github %}<a href="http://github.com/{{ author.github }}" class="author-social" target="_blank"><i class="fa fa-fw fa-github"></i>Github</a>{% endif %}
24+
{% if author.stackoverflow %}<a href="http://stackoverflow.com/users/{{ author.stackoverflow }}" class="author-social" target="_blank"><i class="fa fa-fw fa-stack-overflow"></i>Stackoverflow</a>{% endif %}
25+
{% if author.lastfm %}<a href="http://lastfm.com/user/{{ author.lastfm }}" class="author-social" target="_blank"><i class="fa fa-fw fa-music"></i>Last.fm</a>{% endif %}
26+
{% if author.dribbble %}<a href="http://dribbble.com/{{ author.dribbble }}" class="author-social" target="_blank"><i class="fa fa-fw fa-dribbble"></i>Dribbble</a>{% endif %}
27+
{% if author.pinterest %}<a href="http://www.pinterest.com/{{ author.pinterest }}" class="author-social" target="_blank"><i class="fa fa-fw fa-pinterest"></i>Pinterest</a>{% endif %}
28+
{% if author.foursquare %}<a href="http://foursquare.com/{{ author.foursquare }}" class="author-social" target="_blank"><i class="fa fa-fw fa-foursquare"></i>Foursquare</a>{% endif %}
29+
{% if author.steam %}<a href="http://steamcommunity.com/id/{{ author.steam }}" class="author-social" target="_blank"><i class="fa fa-fw fa-steam-square"></i>Steam</a>{% endif %}
30+
{% if author.youtube %}<a href="https://youtube.com/user/{{ author.youtube }}" class="author-social" target="_blank"><i class="fa fa-fw fa-youtube-square"></i>Youtube</a>{% endif %}
31+
{% if author.soundcloud %}<a href="http://soundcloud.com/{{ author.soundcloud }}" class="author-social" target="_blank"><i class="fa fa-fw fa-soundcloud"></i>Soundcloud</a>{% endif %}
32+
{% if author.weibo %}<a href="http://www.weibo.com/{{ author.weibo }}" class="author-social" target="_blank"><i class="fa fa-fw fa-weibo"></i>Weibo</a>{% endif %}
33+
{% if author.flickr %}<a href="http://www.flickr.com/{{ author.flickr }}" class="author-social" target="_blank"><i class="fa fa-fw fa-flickr"></i>Flickr</a>{% endif %}
34+
</div>

Diff for: ‎_layouts/post-index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ <h2>{{ page.title }}</h2>
3737
</footer>
3838
</div><!-- /.footer-wrapper -->
3939

40-
{% include scripts.html %}
40+
{% include scripts.html %}
4141

4242
</body>
43-
</html>
43+
</html>

Diff for: ‎_layouts/post.html

+19-9
Original file line numberDiff line numberDiff line change
@@ -40,15 +40,25 @@ <h2><span class="entry-date date published"><time datetime="{{ page.date | date_
4040
{% endif %}
4141
</div><!-- /.header-title-wrap -->
4242
</header>
43-
<div class="entry-content">
44-
{{ content }}
45-
<footer class="entry-meta">
46-
<span class="entry-tags">{% for tag in page.tags %}<a href="{{ site.url }}/tags/#{{ tag }}" title="Pages tagged {{ tag }}" class="tag"><span class="term">{{ tag }}</span></a>{% unless forloop.last %}{% endunless %}{% endfor %}</span>
47-
{% if page.modified %}<span>Updated on <span class="entry-date date updated"><time datetime="{{ page.modified }}">{{ page.modified | date: "%B %d, %Y" }}</time></span></span>
48-
<span class="author vcard"><span class="fn">{{ page.author }}</span></span>{% endif %}
49-
{% if page.share != false %}{% include social-share.html %}{% endif %}
50-
</footer>
51-
</div><!-- /.entry-content -->
43+
44+
<div class="entry-content">
45+
46+
<div class="author-side">
47+
{% include _author-bio.html %}
48+
</div>
49+
50+
<div class="post-content">
51+
{{ content }}
52+
<footer class="entry-meta">
53+
<span class="entry-tags">{% for tag in page.tags %}<a href="{{ site.url }}/tags/#{{ tag }}" title="Pages tagged {{ tag }}" class="tag"><span class="term">{{ tag }}</span></a>{% unless forloop.last %}{% endunless %}{% endfor %}</span>
54+
{% if page.modified %}<span>Updated on <span class="entry-date date updated"><time datetime="{{ page.modified }}">{{ page.modified | date: "%B %d, %Y" }}</time></span></span>
55+
<span class="author vcard"><span class="fn">{{ page.author }}</span></span>{% endif %}
56+
{% if page.share != false %}{% include social-share.html %}{% endif %}
57+
</footer>
58+
</div>
59+
60+
</div><!-- /.entry-content -->
61+
5262
{% if page.comments != false %}<section id="disqus_thread"></section><!-- /#disqus_thread -->{% endif %}
5363
{% if site.related_posts.size %}{% include read-more.html %}{% endif %}
5464
</article>

Diff for: ‎_sass/_page.scss

+58-16
Original file line numberDiff line numberDiff line change
@@ -103,9 +103,9 @@ body {
103103
}
104104
.entry-image {
105105
position: relative;
106-
top: -50%;
107-
left: -50%;
108-
width: 200%;
106+
top: -50%;
107+
left: -50%;
108+
width: 200%;
109109
height: 200%;
110110
min-height: 400px;
111111
overflow: hidden;
@@ -119,12 +119,12 @@ body {
119119
background-color: rgba($base-color,0.3);
120120
}
121121
img {
122-
position: absolute;
123-
top: 0;
124-
left: 0;
125-
right: 0;
126-
bottom: 0;
127-
margin: auto;
122+
position: absolute;
123+
top: 0;
124+
left: 0;
125+
right: 0;
126+
bottom: 0;
127+
margin: auto;
128128
min-width: 50%;
129129
min-height: 400px; // match .entry-image min-height
130130
}
@@ -210,14 +210,19 @@ header .entry-meta {
210210
margin-right: 10px;
211211
padding: 20px 30px;
212212
}
213+
213214
@media #{$large} {
214-
max-width: 800px;
215+
max-width: 950px;
215216
margin: 50px auto 30px auto;
216217
padding: 50px 80px;
217218
> p:first-child {
218219
@include font-size(20);
219220
}
220221
}
222+
223+
.post-content {
224+
max-width: 540px;
225+
}
221226
}
222227
#disqus_thread {
223228
margin: 40px 2px 20px 2px;
@@ -314,7 +319,7 @@ header .entry-meta {
314319
h3 {
315320
margin: 0;
316321
@include font-rem(28);
317-
a {
322+
a {
318323
color: $text-color;
319324
}
320325
@media #{$medium} {
@@ -328,11 +333,11 @@ header .entry-meta {
328333
.list-item {
329334
width: 100%;
330335
text-align: left;
331-
h4 {
336+
h4 {
332337
@include font-rem(18);
333-
margin-bottom: 0;
338+
margin-bottom: 0;
334339
}
335-
span {
340+
span {
336341
display: block;
337342
@include font-rem(14);
338343
color: lighten($base-color,50);
@@ -346,7 +351,7 @@ header .entry-meta {
346351
}
347352
}
348353

349-
// Post Index
354+
// Post Index
350355
// --------------------------------------------------
351356
#post-index {
352357
#main {
@@ -415,7 +420,7 @@ header .entry-meta {
415420
// --------------------------------------------------
416421
.socialcount {
417422
@include font-rem(16);
418-
li {
423+
li {
419424
padding-left: 10px;
420425
padding-right: 10px;
421426
}
@@ -462,3 +467,40 @@ header .entry-meta {
462467
#goog-wm-sb {
463468
@extend .btn;
464469
}
470+
471+
// author
472+
// --------------------------------------------------
473+
.author-side {
474+
width: 150px;
475+
display: none;
476+
477+
@media #{$large} {
478+
display: block;
479+
}
480+
}
481+
.author-side h3,p {
482+
text-align: center;
483+
}
484+
485+
.author-side .bio-photo {
486+
width: 150px;
487+
@include rounded(150px);
488+
}
489+
490+
.author-social {
491+
display: block;
492+
margin: 5px;
493+
494+
&:visited {
495+
color: $black;
496+
}
497+
&:hover {
498+
@include scale(1.1);
499+
}
500+
&:active {
501+
@include translate(0, 2px);
502+
}
503+
.fa {
504+
margin-right: 5px;
505+
}
506+
}

Diff for: ‎images/bio-photo-2.jpg

3.08 KB
Loading

0 commit comments

Comments
 (0)