m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-22 01:46:51 +01:00
Code

starting archive, related posts

Browse Source
This commit is contained in:
Matthias Kretschmann 2013-11-24 17:31:03 +01:00
parent b565720c4c
commit c5e2cfd2cb
52 changed files with 328 additions and 259 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
Gruntfile.js
View File

@ -37,16 +37,8 @@ module.exports = function(grunt){
// Jekyll
jekyll: {
options: {
},
production : {
// options: {
// lsi: true
// }
src: '<%= config.src %>/'
},
serve: {
production: {
lsi: true,
src: '<%= config.src %>/'
}
},
@ -165,7 +157,7 @@ module.exports = function(grunt){
'<%= config.src %>/_layouts/**',
'<%= config.src %>/_posts/**'
],
tasks: ['jekyll:serve', 'less', 'uglify']
tasks: ['jekyll', 'less', 'uglify']
},
},
@ -178,8 +170,9 @@ module.exports = function(grunt){
copy_media: {
options: {
src: '<%= config.src %>/_media/',
dest: '<%= config.site %>/media/',
args: ["--exclude='gen'"]
dest: '<%= config.site %>/media',
exclude: ['**/gen'],
syncDestIgnoreExcl: true
}
},
// deployment
@ -187,7 +180,7 @@ module.exports = function(grunt){
options: {
syncDest: true,
src: '<%= config.site %>/',
dest: 'domains/kremalicious.com/html/',
dest: 'domains/kremalicious.com/html',
host: 'kremalicious',
ssh: true,
args: ['--verbose'],
@ -218,7 +211,7 @@ module.exports = function(grunt){
// Dev server
grunt.registerTask('server', [
'rsync:copy_media',
'jekyll:serve',
'jekyll',
'less',
'cmq',
'cssmin',
@ -236,7 +229,7 @@ module.exports = function(grunt){
grunt.registerTask('build', [
'clean',
'rsync:copy_media',
'jekyll:production',
'jekyll',
//'imagemin',
'less',
'cmq',

64
_src/_includes/index.html Normal file
View File

@ -0,0 +1,64 @@
{% if post.layout == "link" %}
<article class="hentry format-link">
<header>
<h1 class="entry-title">
<a href="{{ post.linkurl }}" title="Go to source">{{ post.title }} <i class="icon-forward"></i></a>
</h1>
</header>
<section class="entry-content">
{{ post.content }}
<p>
<a class="more-link" href="{{ post.linkurl }}">Go to source <i class="icon-forward"></i></a>
<a class="permalink-link" href="{{ post.url }}" rel="tooltip" title="Permalink">&#8734;</a>
</p>
</section>
</article>
{% elsif post.layout == "photo" %}
<article class="hentry format-image">
<a class="photoPost" href="{{ post.url }}">
<figure class="hmedia">
{% picture {{ post.image }} %}
<figcaption class="entry-title fn">{{ post.title }}</figcaption>
exif
</figure>
</a>
</article>
{% else %}
<article class="hentry format-post">
<header>
<h1 class="entry-title"><a href="{{ post.url }}">{{ post.title }}</a></h1>
</header>
<section class="entry-content">
{% if post.image %}
<a href="{{ post.url }}">
{% picture {{ post.image }} class="teaser" %}
</a>
{% endif %}
{% capture has_more %}{{ post.content | has_more }}{% endcapture %}
{% if has_more == 'true' %}
{{ post.content | post.excerpt | excerpt }}
{% else %}
{{ post.excerpt }}
{% endif %}
<a class="more-link" href="{{ post.url }}">Continue reading <i class="icon-arrow-right"></i></a>
</section>
</article>
{% endif %}

22
_src/_includes/paginator.html Normal file
View File

@ -0,0 +1,22 @@
<nav class="row pager pagination">
{% if paginator.previous_page %}
<p class="previous col2 alignleft">
<i class="icon-arrow-left"></i>
{% if paginator.previous_page == 1 %}
<a href="/" rel="prev">Previous</a>
{% else %}
<a href="/page/{{ paginator.previous_page }}/" rel="prev">Previous</a>
{% endif %}
</p>
{% endif %}
<p class="col2 pagenumber textcenter">
<span class="page_number ">Page {{ paginator.page }} of {{ paginator.total_pages }}</span>
</p>
{% if paginator.next_page %}
<p class="next col2 alignright">
<a href="/page/{{ paginator.next_page }}/" rel="next">Next</a>
<i class="icon-arrow-right"></i>
</p>
{% endif %}
</nav>

19
_src/_includes/related_posts.html Normal file
View File

@ -0,0 +1,19 @@
<aside class="related-posts">
<h1 class="related-title">Related</h1>
<div class="row">
{% for post in site.posts limit:6 %}
<article class="related-post col2">
<a href="{{ post.url }}">
<h1 class="post-title">{{ post.title }}</h1>
</a>
</article>
{% endfor %}
</div>
</aside>

6
_src/_layouts/link.html
View File

@ -2,7 +2,7 @@
layout: base
---
<section role="main" id="main" class="row">
<section role="main" id="main" class="page-single row">
<article class="hentry format-link">
<header>
@ -30,4 +30,6 @@ layout: base
</footer>
</article>
</section>
</section>
{% include related_posts.html %}

6
_src/_layouts/image.html → _src/_layouts/photo.html
View File

@ -2,7 +2,7 @@
layout: base
---
<section role="main" id="main" class="row">
<section role="main" id="main" class="page-single row">
<article class="hentry format-image">
@ -32,4 +32,6 @@ layout: base
</article>
</section>
</section>
{% include related_posts.html %}

6
_src/_layouts/post.html
View File

@ -2,7 +2,7 @@
layout: base
---
<section role="main" id="main" class="row">
<section role="main" id="main" class="page-single row">
<article class="hentry format-post">
<header>
@ -33,4 +33,6 @@ layout: base
</footer>
</article>
</section>
</section>
{% include related_posts.html %}

2
_src/_posts/2008-09-23-a-long-time-ago.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: A Long Time Ago...
image: A-Long-Time-Ago.jpg

2
_src/_posts/2010-03-27-office-desk.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Office Desk
image: Office-Desk.jpg

2
_src/_posts/2010-07-18-typeface-condoms.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Typeface condoms
image: Typeface-condoms.jpg

2
_src/_posts/2010-08-07-bonsai.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Bonsai
image: Bonsai-5-Version-2.jpg

2
_src/_posts/2010-09-01-gdr-helvetica.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: GDR Helvetica
image: GDR-Helvetica.jpg

2
_src/_posts/2010-12-11-iphone-coasters.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: iPhone Coasters
image: iPhone-Coasters-1-Version-2.jpg

2
_src/_posts/2010-12-29-basically-the-monolith-is-on-my-desk.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Basically, The Monolith Is On My Desk
image: Basically-The-Monolith-Is-On-My-Desk.jpg

2
_src/_posts/2010-12-29-free-monkey-breath-not-soylent-green.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Free Monkey Breath, Not Soylent Green
image: Free-Monkey-Breath-Not-Soylent-Green.jpg

2
_src/_posts/2011-01-08-enjoying-paper.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Enjoying Paper
image: Enjoying-Paper.jpg

2
_src/_posts/2011-01-08-glowing-star-inside.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Glowing Star Inside
image: Glowing-Star-Inside.jpg

2
_src/_posts/2011-01-18-historic-flood-levels.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Historic Flood Levels
image: Historic-Flood-Levels.jpg

2
_src/_posts/2011-10-11-broken-nexus-s-screen.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Broken Nexus S Screen
image: Broken-Nexus-S-Screen.jpg

2
_src/_posts/2012-03-04-relaxing-cat.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Relaxing Cat
image: 7f9397a265d811e1b9f1123138140926_7.jpg

2
_src/_posts/2012-04-03-blaue-turme.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Blaue Türme
image: Blaue-Türme-1.jpg

2
_src/_posts/2012-04-03-skeletor.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Skeletor
image: 6313cc1e7db611e180c9123138016265_7.jpg

2
_src/_posts/2012-04-03-train-station-leipzig.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Train Station Leipzig
image: de2ac24c7db911e1b9f1123138140926_7.jpg

2
_src/_posts/2012-04-05-current-sushi-status.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Current Sushi Status
image: aff38e2c7f5311e1b10e123138105d6b_7.jpg

2
_src/_posts/2012-04-07-buna.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Buna
image: 44af28f2805b11e18cf91231380fd29b_7.jpg

2
_src/_posts/2012-04-07-cat-enjoying-a-good-ipad-game.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Cat enjoying a good iPad game
image: 7838011c80ce11e19e4a12313813ffc0_7.jpg

2
_src/_posts/2012-04-07-ipad-porn.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: iPad Porn
image: 97a44d6080b711e181bd12313817987b_7.jpg

2
_src/_posts/2012-04-07-opera.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Opera
image: 5df6e0a280c911e1a87612313804ec91_7.jpg

2
_src/_posts/2012-04-08-common-kitchen-decoration.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Common kitchen decoration
image: 2ba6eeba81b111e1989612313815112c_7.jpg

2
_src/_posts/2012-04-08-graffiti-old-school-style.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Graffiti, old school style
image: 7e2b28f881b711e1af7612313813f8e8_7.jpg

2
_src/_posts/2012-05-03-antique-chrome.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Antique Chrome
image: 5fc688aa953811e180c9123138016265_7.jpg

2
_src/_posts/2012-05-23-like-modern-heating-only-more-badass.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Like modern heating only more badass
image: 41b5a454a43811e1989612313815112c_7.jpeg

2
_src/_posts/2012-05-27-balloon.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Balloon
image: 690fe368a81911e1b2fe1231380205bf_7.jpg

2
_src/_posts/2012-06-27-typography-window.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Typography window
image: 80a136dabff711e188131231381b5c25_7.jpg

2
_src/_posts/2012-07-20-mmmmh-coffee.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Mmmmh, Coffee
image: 66a6e0c0d25a11e1a94522000a1e8aaf_7.jpg

2
_src/_posts/2012-08-08-amazingly-early.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Amazingly early
image: 2ca7a094e10f11e1868c12313817a130_7.jpg

2
_src/_posts/2012-08-25-so-much-room.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: So much room
image: c0c45b6eeea211e1ad8e22000a1cdbb8_7.jpg

2
_src/_posts/2012-09-07-huge-station-is-huge.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Huge station is huge
image: 619b3900f92911e1a31922000a1cddf1_7.jpg

2
_src/_posts/2012-09-10-subway-firefox.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Subway Firefox
image: 84f9d2c4fb7411e19ca422000a1d0119_7.jpg

2
_src/_posts/2012-09-12-sweet-typography.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Sweet typography
image: 01f8b0b8fcc611e19b5b123138140bce_7.jpg

2
_src/_posts/2012-09-14-bvg-dos.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: BVG DOS
image: 6c4003f2fe9911e1ae9122000a1e9e21_7.jpg

2
_src/_posts/2013-02-17-castle-garden.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: Castle Garden
image: 8372983659_da0e88ca79_o.jpg

2
_src/_posts/2013-02-17-ezeep-android-app-design.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: ezeep Android App Design
image: 8455835942_a9b9100373_o.jpg

2
_src/_posts/2013-02-17-ezeep-office-view.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: ezeep office view
image: 8450618380_83c64006c6_o.jpg

2
_src/_posts/2013-05-23-ezeep-birds.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: ezeep birds
image: 8776417095_43553c88c2_o.jpg

2
_src/_posts/2013-05-23-ezeep-origami.markdown
View File

@ -1,5 +1,5 @@
---
layout: image
layout: photo
title: ezeep origami
image: 8782995066_e90ff6b3ae_o.jpg

20
_src/archive.html Normal file
View File

@ -0,0 +1,20 @@
---
layout: base
title: Archive
---
<section role="main" id="main archive" class="row">
<h1 class="page-title">Archive</h1>
{% for post in site.posts %}
<article class="hentry">
<header>
<h1 class="entry-title"><a href="{{ post.url }}">{{ post.title }}</a></h1>
</header>
</article>
{% endfor %}
</section>

4
_src/assets/js/app.js
View File

@ -41,7 +41,7 @@ var photoGrid = {
init: function(){
// only fire when photo post present and screen bigger than 480px
if ( $('#main .masonry').length > 0 && Modernizr.mq('only screen and (min-width: 480px)') ) {
if ( $('#photos').length > 0 ) {
this.masonryLayout();
}
}
@ -66,7 +66,7 @@ var infiniteScroll = {
infiniteScrollSetup: function() {
if ( $('body.archive.category-photos').length > 0 ) {
if ( $('#photos').length > 0 ) {
var items = '#main .masonry';
} else {
var items = '#main article.hentry';

214
_src/assets/less/content.less
View File

@ -3,12 +3,16 @@
padding: @line-height-computed*2 0;
@media @breakpoint2 {
padding: (@line-height-computed * 4) 0;
padding: @line-height-computed*4 0;
}
&:first-child {
padding-top: @line-height-computed;
}
.page-single & {
padding-bottom: @line-height-computed
}
}
// post title
@ -64,6 +68,79 @@
}
}
// LINK POST
/////////////////////////////////////
.hentry.format-link {
}
.permalink-link {
float: right;
}
// PHOTO POST
/////////////////////////////////////
.hentry.format-image {
text-align: center;
figure {
display: inline-block;
margin-left: auto;
margin-right: auto;
position: relative;
padding: .4em;
background: #fcfeff;
border: 1px solid rgba(158, 170, 178, .6);
border-radius: 2px;
.box-shadow(0 1px 4px rgba(0, 0, 0, 0.1));
.transition();
@media @breakpoint2 {
.box-shadow(~"0 1px 4px rgba(0, 0, 0, 0.1), inset 0 0 30px rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff");
}
img {
.box-shadow(none);
border-radius: 2px;
margin-left: auto;
margin-right: auto;
margin-bottom: 1em;
}
figcaption {
text-align: center;
margin-bottom: .5em;
color: rgba(46, 79, 92, .7);
font-family: @headings-font-family;
font-weight: @headings-font-weight;
font-style: normal;
font-size: .9em
}
}
}
a.photoPost {
display: block;
&:hover {
figure { background: #c4e4df; }
}
}
#exif {
font-size: @font-size-small;
color: #b9c3c9;
text-align: center;
margin-bottom: .5em;
span {
margin-right: 1em;
}
}
// POST META
/////////////////////////////////////
@ -113,113 +190,48 @@
}
// LINK POST
/////////////////////////////////////
.permalink-link {
float: right;
//
// Related posts
//
.related-title {
.h5;
color: @text-color-dimmed;
text-align: center;
margin-top: 0;
margin-bottom: @line-height-computed;
}
// GOODIES POST
/////////////////////////////////////
#goodiesDownload {
margin: 1em 0 0 0;
p {
margin-bottom: 1em;
}
.btn {
display: block;
margin-bottom: 0;
&:before {
margin-right: .5em;
}
}
.related-posts {
&:hover .post-title {
color: @text-color;
}
}
// PHOTO POST
/////////////////////////////////////
.hentry.format-image {
text-align: center
}
.photoPost {
display: block;
figure {
display: inline-block;
margin-left: auto;
margin-right: auto;
position: relative;
padding: .4em;
background: #fcfeff;
border: 1px solid rgba(158, 170, 178, .6);
border-radius: 2px;
.box-shadow(0 1px 4px rgba(0, 0, 0, 0.1));
.transition();
.related-post {
text-align: center;
@media @breakpoint2 {
.box-shadow(~"0 1px 4px rgba(0, 0, 0, 0.1), inset 0 0 30px rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff");
}
img {
.box-shadow(none);
border-radius: 2px;
margin-left: auto;
margin-right: auto;
margin-bottom: 1em;
}
figcaption {
text-align: center;
margin-bottom: .5em;
color: rgba(46, 79, 92, .7);
font-family: @headings-font-family;
font-weight: @headings-font-weight;
font-style: normal;
font-size: .9em
}
.post-title {
font-size: .9em;
color: @text-color-light;
line-height: @line-height-base;
margin-top: 0;
margin-bottom: @line-height-computed;
.transition;
}
// Single View
.single & {
text-align: center;
figure { margin-bottom: 1.5em; }
a {
display: block;
// show big size on larger screens
@media @breakpoint3 {
margin-left: -7em;
margin-right: -7em;
}
&:hover .post-title { color: @link-color-hover }
}
}
a.photoPost {
&:hover {
figure { background: #c4e4df; }
}
}
#exif {
font-size: @font-size-small;
color: #b9c3c9;
text-align: center;
margin-bottom: .5em;
span {
margin-right: 1em;
}
}
// Masonry
.masonryWrap {
.masonry {
@media @breakpoint2 {
width: 125%;
@ -258,24 +270,6 @@ a.photoPost {
}
}
@media @breakpoint2 {
#goodiesDownload p {
width: 49%;
float: left;
margin-left: 2%;
&:first-child {
margin-left: 0;
}
}
.btn.btn-block.col2 { width: 30%; float: left; }
.btn.btn-block.col4,
.btn.btn-primary.col4 { width: 65%; float: left; }
}
// TABLES
/////////////////////////////////////

8
_src/assets/less/grid.less
View File

@ -62,7 +62,13 @@
.col3:first-child,
.col4:first-child,
.col5:first-child,
.col6 { margin-left: 0; }
.col6,
.col3:nth-child(2n+3),
.col2:nth-child(3n+4),
.col1:nth-child(6n+7) {
margin-left: 0;
clear: both
}
.col1 { width: 13%; }
.col2 { width: 30.6%; }

87
_src/index.html
View File

@ -12,93 +12,10 @@ description: 'Blog of designer & developer Matthias Kretschmann'
{% for post in paginator.posts %}
{% if post.layout == "link" %}
<article class="hentry format-link">
<header>
<h1 class="entry-title">
<a href="{{ post.linkurl }}" title="Go to source">{{ post.title }} <i class="icon-forward"></i></a>
</h1>
</header>
<section class="entry-content">
{{ post.content }}
<p>
<a class="more-link" href="{{ post.linkurl }}">Go to source <i class="icon-forward"></i></a>
<a class="permalink-link" href="{{ post.url }}" rel="tooltip" title="Permalink">&#8734;</a>
</p>
</section>
</article>
{% elsif post.layout == "image" %}
<article class="hentry format-image">
<a class="photoPost" href="{{ post.url }}">
<figure class="hmedia">
{% picture {{ post.image }} %}
<figcaption class="entry-title fn">{{ post.title }}</figcaption>
exif
</figure>
</a>
</article>
{% else %}
<article class="hentry format-post">
<header>
<h1 class="entry-title"><a href="{{ post.url }}">{{ post.title }}</a></h1>
</header>
<section class="entry-content">
{% if post.image %}
<a href="{{ post.url }}">
{% picture {{ post.image }} class="teaser" %}
</a>
{% endif %}
{% capture has_more %}{{ post.content | has_more }}{% endcapture %}
{% if has_more == 'true' %}
{{ post.content | post.excerpt | excerpt }}
{% else %}
{{ post.excerpt }}
{% endif %}
<a class="more-link" href="{{ post.url }}">Continue reading <i class="icon-arrow-right"></i></a>
</section>
</article>
{% endif %}
{% include index.html %}
{% endfor %}
</section>
<nav class="row pager pagination">
{% if paginator.previous_page %}
<p class="previous col2 alignleft">
<i class="icon-arrow-left"></i>
{% if paginator.previous_page == 1 %}
<a href="/" rel="prev">Previous</a>
{% else %}
<a href="/page/{{ paginator.previous_page }}/" rel="prev">Previous</a>
{% endif %}
</p>
{% endif %}
<p class="col2 pagenumber textcenter">
<span class="page_number ">Page {{ paginator.page }} of {{ paginator.total_pages }}</span>
</p>
{% if paginator.next_page %}
<p class="next col2 alignright">
<a href="/page/{{ paginator.next_page }}/" rel="next">Next</a>
<i class="icon-arrow-right"></i>
</p>
{% endif %}
</nav>
{% include paginator.html %}

28
_src/photos.html Normal file
View File

@ -0,0 +1,28 @@
---
layout: base
title: Photos kremalicious
---
<section role="main" id="main photos" class="row">
<div class="masonry">
{% for post in site.categories.photos %}
<article class="hentry format-image">
<a class="photoPost" href="{{ post.url }}">
<figure class="hmedia">
<figcaption class="entry-title fn">{{ post.title }}</figcaption>
exif
</figure>
</a>
</article>
{% endfor %}
</div>
</section>