github
/
hexo-theme-icarus
mirror of https://github.com/ppoffice/hexo-theme-icarus
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: change to timeline layout for non-index pages

pull/116/head
ppoffice 2016-03-17 23:53:53 +08:00
parent 511f243a63
commit a7822ed9df
10 changed files with 147 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
layout/archive.ejs
View File

@ -1 +1,32 @@
<%- partial('common/archive', {type: 'archive', index: true}) %>
<div class="timeline timeline-wrap">
<% var last;
page.posts.each(function(post, i) {
var year = post.date.year();
if (last != year) {
last = year; %>
<div class="timeline-row timeline-row-major">
<span class="node"><i class="fa fa-calendar"></i></span>
<h1 class="title"><%= year %></h1>
</div>
<% } %>
<div class="timeline-row">
<span class="node"></span>
<div class="content">
<%- partial('common/post/title', { post: post, index: true, class_name: 'timeline-article-title' }) %>
<div class="article-meta">
<%- partial('common/post/date', { post: post, class_name: 'article-date', date_format: null }) %>
<%- partial('common/post/category', { post: post }) %>
<%- partial('common/post/tag', { post: post }) %>
</div>
</div>
</div>
<% }); %>
</div>
<% if (page.total > 1) { %>
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% } %>

2
layout/category.ejs
View File

@ -1 +1 @@
<%- partial('common/archive', {type: 'category', index: true}) %>
<%- partial('common/timeline', { type: 'category' }) %>

60
layout/common/archive.ejs
View File

@ -1,60 +0,0 @@
<% switch (type) {
case 'archive':
var last;
page.posts.each(function(post, i) {
var year = post.date.year();
if (last != year) {
if (last != null) { %>
</div></section>
<% }
last = year; %>
<div class="archive-year-wrap">
<a href="<%- url_for('archives/' + year) %>" class="archive-year"><%= year %></a>
</div>
<section class="archives-wrap">
<div class="archives">
<% } %>
<%- partial('summary', {post: post, archive: true}) %>
<% });
if (page.posts.length) { %>
</div></section>
<% }
break;
case 'category': %>
<section class="archives-wrap">
<div class="archive-category-wrap">
<span class="archive-category"><%= page.category %></span>
</div>
<div class="archives">
<% page.posts.each(function (post, i) { %>
<%- partial('summary', {post: post, archive: false}) %>
<% }); %>
</div></section>
<%
break;
case 'tag': %>
<section class="archives-wrap">
<div class="archive-tag-wrap">
<span class="archive-tag">#<%= page.tag %></span>
</div>
<div class="archives">
<% page.posts.each(function (post, i) { %>
<%- partial('summary', {post: post, archive: false}) %>
<% }); %>
</div></section>
<%
break;
default:
page.posts.each(function(post) { %>
<%- partial('article', { post: post, index: true }) %>
<% })
break;
}
if (page.total > 1) { %>
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% } %>

4
layout/common/article.ejs
View File

@ -15,8 +15,8 @@
</header>
<% } %>
<div class="article-entry" itemprop="articleBody">
<% if (index) { %>
<p><%- excerpt(post) %></p>
<% if (index && post.excerpt) { %>
<p><%- post.excerpt %></p>
<p class="article-more-link">
<a href="<%- url_for(post.path) %>#more"><%= __('article.more') %></a>
</p>

23
layout/common/summary.ejs
View File

@ -1,23 +0,0 @@
<article class="archive-article archive-type-summary">
<% if(theme.customize.thumbnail == true) { %>
<div class="archive-article-thumbnail">
<%- partial('thumbnail.ejs', { post: post }) %>
</div>
<% } %>
<div class="archive-article-content">
<header class="archive-article-header">
<%- partial('post/title', { class_name: 'archive-article-title' }) %>
<div class="article-meta">
<%- partial('post/date', { class_name: 'article-date', date_format: null }) %>
<%- partial('post/category') %>
<%- partial('post/tag') %>
</div>
</header>
<div class="article-entry">
<p><%- excerpt(post) %></p>
<p class="article-more-link">
<a href="<%- url_for(post.path) %>#more"><%= __('article.more') %></a>
</p>
</div>
</div>
</article>

39
layout/common/timeline.ejs Normal file
View File

@ -0,0 +1,39 @@
<%
switch (type) {
case 'category':
title = page.category;
icon = 'folder';
break;
case 'tag':
title = '#' + page.tag;
icon = 'tag';
break;
}
%>
<div class="timeline timeline-wrap">
<div class="timeline-row timeline-row-major">
<span class="node"><i class="fa fa-<%= icon %>"></i></span>
<h1 class="title"><%= title %></h1>
</div>
<% page.posts.each(function (post, i) { %>
<div class="timeline-row">
<span class="node"></span>
<div class="content">
<%- partial('post/title', { post: post, index: true, class_name: 'timeline-article-title' }) %>
<div class="article-meta">
<%- partial('post/date', { post: post, class_name: 'article-date', date_format: null }) %>
<%- partial('post/category', { post: post }) %>
<%- partial('post/tag', { post: post }) %>
</div>
</div>
</div>
<% }); %>
</div>
<% if (page.total > 1) { %>
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% } %>

12
layout/index.ejs
View File

@ -1 +1,11 @@
<%- partial('common/archive', {type: '', index: true}) %>
<% page.posts.each(function(post) { %>
<%- partial('common/article', { post: post, index: true }) %>
<% });
if (page.total > 1) { %>
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% } %>

2
layout/tag.ejs
View File

@ -1 +1 @@
<%- partial('common/archive', {type: 'tag', index: true}) %>
<%- partial('common/timeline', { type: 'tag' }) %>

60
source/css/_partial/timeline.styl Normal file
View File

@ -0,0 +1,60 @@
.timeline-wrap
border-left: 4px solid #e7e7e7
margin: 40px 20px 40px 40px
.timeline-row
clearfix()
margin: 20px 0
.node,
.title
float: left
.node
width: 12px
color: white
height: 12px
border-radius: 50%
margin: 11px 0 0 -8px
display: inline-block
background-color: #38b7ea
.content
margin-left: 25px
position: relative
background-color: white
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05)
&:after,
&:before
content: ''
position: absolute
display: inline-block
&:after
top: 10px
left: -14px
border: 7px solid transparent
border-right-color: white
&:before
top: 9px
left: -16px
border: 8px solid transparent
border-right-color: rgba(0, 0, 0, 0.05)
h1,
.article-meta
padding: 10px
h1
font-size: 16px
a
@extend $link-dark
.article-meta
border-top: 1px solid #f7f7f7
background-color: rgba(244, 246, 247, 0.2)
.timeline-row-major
.node
width: 14px
height: 14px
font-size: 14px
margin: 0 0 0 -17px
padding: 6px 8px 10px
.title
font-size: 18px
margin-left: 15px
line-height: 30px

1
source/css/style.styl
View File

@ -80,6 +80,7 @@ code
@import "_partial/article"
@import "_partial/comment"
@import "_partial/archive"
@import "_partial/timeline"
@import "_partial/footer"
@import "_partial/sidebar"
@import "_highlight/index"