Introduce new post loop partial + new multi-author post meta
This commit is contained in:
parent
088a867cea
commit
6ae074b724
5 changed files with 78 additions and 83 deletions
|
@ -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;
|
||||
|
|
29
author.hbs
29
author.hbs
|
@ -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}}">»</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>
|
28
index.hbs
28
index.hbs
|
@ -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}}">»</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
25
partials/loop.hbs
Normal 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}}">»</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
31
tag.hbs
|
@ -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}}">»</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>
|
Loading…
Reference in a new issue