Introduce new post loop partial + new multi-author post meta

This commit is contained in:
John O'Nolan 2014-07-21 18:20:36 +02:00
parent 088a867cea
commit 6ae074b724
5 changed files with 78 additions and 83 deletions

View File

@ -217,7 +217,6 @@ h1 {
h2 {
font-size: 4.4rem;
letter-spacing: -1px;
text-indent: -2px;
}
h3 {
@ -245,11 +244,6 @@ a:hover {
color: #111;
}
h1 a, h2 a, h3 a,
h4 a, h5 a, h6 a {
color: #50585D;
}
.post-template .post-title {
margin-bottom: 3.4rem;
}
@ -672,6 +666,10 @@ margin on the iframe, cause it breaks stuff. */
box-shadow: #FFF 0 0 0 5px;
}
body:not(.post-template) .post-title {
font-size: 4rem;
}
.post-title a {
text-decoration: none;
}
@ -685,13 +683,22 @@ margin on the iframe, cause it breaks stuff. */
}
.post-meta {
display: inline-block;
margin: 0 0 5px 0;
display: block;
margin: 2rem 0 0.6rem 0;
font-family: "Open Sans", sans-serif;
font-size: 1.5rem;
line-height: 2.2rem;
color: #9EABB3;
}
.author-thumb {
width: 24px;
height: 24px;
float: left;
margin-right: 9px;
border-radius: 100%;
}
.post-meta a {
color: #9EABB3;
text-decoration: none;
@ -707,6 +714,15 @@ margin on the iframe, cause it breaks stuff. */
min-height: 77px;
}
.post-date {
display: inline-block;
margin-left: 8px;
padding-left: 12px;
border-left: #d5dbde 1px solid;
text-transform: uppercase;
font-size: 1.3rem;
}
.user-image {
position: absolute;
top: 0;
@ -1240,6 +1256,10 @@ margin on the iframe, cause it breaks stuff. */
font-size: 2rem;
}
body:not(.post-template) .post-title {
font-size: 3.6rem;
}
}
@ -1290,6 +1310,10 @@ margin on the iframe, cause it breaks stuff. */
font-size: 0.8em
}
body:not(.post-template) .post-title {
font-size: 3.2rem;
}
.post-template .post {
padding-bottom: 1rem;
}
@ -1441,6 +1465,10 @@ margin on the iframe, cause it breaks stuff. */
line-height: 1.55em;
}
.post-date {
display: none;
}
.post-template .post-title {
margin-bottom: 2rem;
}
@ -1493,6 +1521,10 @@ margin on the iframe, cause it breaks stuff. */
font-size: 1.7rem;
}
body:not(.post-template) .post-title {
font-size: 2.6rem;
}
.post-template .post {
padding-bottom: 0;
margin-bottom: 0;

View File

@ -1,9 +1,7 @@
{{!< default}}
{{! The tag above means - insert everything in this file into the {body} of the default.hbs template }}
{{! The comment above "< default" means - insert everything in this file into
the {body} of the default.hbs template, which contains our header/footer. }}
{{! The big featured header on the homepage, with the site logo and description }}
{{! The big featured header }}
<header class="main-header author-head" {{#if @blog.cover}}style="background-image: url({{author.cover}})"{{/if}}>
<nav class="main-nav overlay clearfix">
<a class="back-button icon-arrow-left" href="{{@blog.url}}">Home</a>
@ -29,26 +27,7 @@
{{! The main content area on the homepage }}
<main class="content" role="main">
{{! Previous/next page links - only displayed on page 2+ }}
<div class="extra-pagination inner">
{{pagination}}
</div>
{{! Each post will be output using this markup }}
{{#foreach posts}}
<article class="{{post_class}}">
<header class="post-header">
<span class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> {{tags prefix="on "}}</span>
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
</header>
<section class="post-excerpt">
<p>{{excerpt}} <a class="read-more" href="{{url}}">&raquo;</a></p>
</section>
</article>
{{/foreach}}
{{! After all the posts, we have the previous/next pagination links }}
{{pagination}}
{{! The tag below includes the post loop - partials/loop.hbs }}
{{> "loop"}}
</main>

View File

@ -1,9 +1,7 @@
{{!< default}}
{{! The tag above means - insert everything in this file into the {body} of the default.hbs template }}
{{! The comment above "< default" means - insert everything in this file into
the {body} of the default.hbs template, which contains our header/footer. }}
{{! The big featured header on the homepage, with the site logo and description }}
{{! The big featured header }}
<header class="main-header {{#if @blog.cover}}" style="background-image: url({{@blog.cover}}){{else}}no-cover{{/if}}">
<nav class="main-nav overlay clearfix">
{{#if @blog.logo}}<a class="blog-logo" href="{{@blog.url}}"><img src="{{@blog.logo}}" alt="Blog Logo" /></a>{{/if}}
@ -20,25 +18,7 @@
{{! The main content area on the homepage }}
<main class="content" role="main">
{{! Previous/next page links - only displayed on page 2+ }}
<div class="extra-pagination inner">
{{pagination}}
</div>
{{! Each post will be output using this markup }}
{{#foreach posts}}
<article class="{{post_class}}">
<header class="post-header">
<span class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> {{tags prefix="on "}}</span>
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
</header>
<section class="post-excerpt">
<p>{{excerpt}} <a class="read-more" href="{{url}}">&raquo;</a></p>
</section>
</article>
{{/foreach}}
{{! Previous/next page links - only displayed on every page }}
{{pagination}}
{{! The tag below includes the post loop - partials/loop.hbs }}
{{> "loop"}}
</main>

25
partials/loop.hbs Normal file
View File

@ -0,0 +1,25 @@
{{! Previous/next page links - only displayed on page 2+ }}
<div class="extra-pagination inner">
{{pagination}}
</div>
{{! This is the post loop - each post will be output using this markup }}
{{#foreach posts}}
<article class="{{post_class}}">
<header class="post-header">
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
</header>
<section class="post-excerpt">
<p>{{excerpt words="30"}} <a class="read-more" href="{{url}}">&raquo;</a></p>
</section>
<footer class="post-meta">
<img class="author-thumb" src="{{author.image}}" alt="Author image" nopin="nopin" />
<a href="{{@blog.url}}/author/{{author.slug}}">{{author.name}}</a>
{{tags prefix=" on "}}
<time class="post-date" datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMMM YYYY"}}</time>
</footer>
</article>
{{/foreach}}
{{! Previous/next page links - displayed on every page }}
{{pagination}}

31
tag.hbs
View File

@ -1,13 +1,11 @@
{{!< default}}
{{! The tag above means - insert everything in this file into the {body} of the default.hbs template }}
{{! The comment above "< default" means - insert everything in this file into
the {body} of the default.hbs template, which contains our header/footer. }}
{{! The big featured header on the homepage, with the site logo and description }}
{{! The big featured header }}
<header class="tag-head main-header" {{#if @blog.cover}}style="background-image: url({{@blog.cover}})"{{/if}}>
<nav class="main-nav overlay clearfix">
<a class="back-button icon-arrow-left" href="{{@blog.url}}">Home</a>
<a class="subscribe-button icon-feed" href="{{@blog.url}}/rss/">Subscribe</a>
<a class="subscribe-button icon-feed" href="{{@blog.url}}/tag/{{tag.slug}}/rss/">{{tag.name}}</a>
</nav>
<div class="vertical">
<div class="main-header-content inner">
@ -20,26 +18,7 @@
{{! The main content area on the homepage }}
<main class="content" role="main">
{{! Previous/next page links - only displayed on page 2+ }}
<div class="extra-pagination inner">
{{pagination}}
</div>
{{! Each post will be output using this markup }}
{{#foreach posts}}
<article class="{{post_class}}">
<header class="post-header">
<span class="post-meta"><time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> {{tags prefix="on "}}</span>
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
</header>
<section class="post-excerpt">
<p>{{excerpt}} <a class="read-more" href="{{url}}">&raquo;</a></p>
</section>
</article>
{{/foreach}}
{{! After all the posts, we have the previous/next pagination links }}
{{pagination}}
{{! The tag below includes the post loop - partials/loop.hbs }}
{{> "loop"}}
</main>