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

chore: redesign archive list style

pull/93/head
ppoffice 2016-02-06 00:11:56 +08:00
parent f095d234e3
commit ae697d4523
7 changed files with 94 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
layout/common/archive.ejs
View File

@ -18,14 +18,6 @@
<% }); <% });
if (page.posts.length) { %> if (page.posts.length) { %>
</div></section> </div></section>
<% }
if (page.total > 1) { %>
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% } <% }
break; break;
case 'category': %> case 'category': %>
@ -38,14 +30,7 @@
<%- partial('summary', {post: post, archive: false}) %> <%- partial('summary', {post: post, archive: false}) %>
<% }); %> <% }); %>
</div></section> </div></section>
<% if (page.total > 1) { %> <%
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% }
break; break;
case 'tag': %> case 'tag': %>
<section class="archives-wrap"> <section class="archives-wrap">
@ -57,19 +42,14 @@
<%- partial('summary', {post: post, archive: false}) %> <%- partial('summary', {post: post, archive: false}) %>
<% }); %> <% }); %>
</div></section> </div></section>
<% if (page.total > 1) { %> <%
<nav id="page-nav">
<%- paginator({
prev_text: '&laquo; ' + __('nav.prev'),
next_text: __('nav.next') + ' &raquo;'
}) %>
</nav>
<% }
break; break;
default: default:
page.posts.each(function(post) { %> page.posts.each(function(post) { %>
<%- partial('article', { post: post, index: true }) %> <%- partial('article', { post: post, index: true }) %>
<% }) <% })
break;
}
if (page.total > 1) { %> if (page.total > 1) { %>
<nav id="page-nav"> <nav id="page-nav">
<%- paginator({ <%- paginator({
@ -77,6 +57,4 @@
next_text: __('nav.next') + ' &raquo;' next_text: __('nav.next') + ' &raquo;'
}) %> }) %>
</nav> </nav>
<% } <% } %>
break;
} %>

7
layout/common/head.ejs
View File

@ -3,18 +3,19 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<% <%
function capitalize (str) { return str.charAt(0).toUpperCase() + str.substring(1).toLowerCase() }
var title = page.title; var title = page.title;
if (is_archive()) { if (is_archive()) {
title = __('index.archive'); title = capitalize(__('index.archive'));
if (is_month()) { if (is_month()) {
title += ': ' + page.year + '/' + page.month; title += ': ' + page.year + '/' + page.month;
} else if (is_year()) { } else if (is_year()) {
title += ': ' + page.year; title += ': ' + page.year;
} }
} else if (is_category()) { } else if (is_category()) {
title = __('index.category') + ': ' + page.category; title = capitalize(__('index.category')) + ': ' + page.category;
} else if (is_tag()) { } else if (is_tag()) {
title = __('index.tag') + ': ' + page.tag; title = capitalize(__('index.tag')) + ': ' + page.tag;
} }
%> %>
<title><% if (title) { %><%= title %> | <% } %><%= config.title %></title> <title><% if (title) { %><%= title %> | <% } %><%= config.title %></title>

20
layout/common/summary.ejs
View File

@ -1,17 +1,23 @@
<article class="archive-article archive-type-<%= post.layout %>"> <article class="archive-article archive-type-summary">
<div class="archive-article-inner">
<% if(theme.customize.thumbnail == true) { %> <% if(theme.customize.thumbnail == true) { %>
<div class="archive-article-thumbnail"> <div class="archive-article-thumbnail">
<%- partial('thumbnail.ejs', { post: post }) %> <%- partial('thumbnail.ejs', { post: post }) %>
</div> </div>
<% } %> <% } %>
<div class="archive-article-content">
<header class="archive-article-header"> <header class="archive-article-header">
<%- partial('post/title', { class_name: 'archive-article-title' }) %> <%- partial('post/title', { class_name: 'archive-article-title' }) %>
<% if(archive) { %> <div class="article-meta">
<%- partial('post/date', {class_name: 'archive-article-date', date_format: 'MMM D'}) %> <%- partial('post/date', { class_name: 'article-date', date_format: null }) %>
<% } else { %> <%- partial('post/category') %>
<%- partial('post/date', {class_name: 'archive-article-date', date_format: 'YYYY MMM D'}) %> <%- partial('post/tag') %>
<% } %> </div>
</header> </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> </div>
</article> </article>

2
source/css/_extend.styl
View File

@ -9,7 +9,7 @@ $link-dark
$block-caption $block-caption
line-height: 1em line-height: 1em
color: color-grey // color: color-grey
text-decoration: none text-decoration: none
text-transform: uppercase text-transform: uppercase

49
source/css/_partial/archive.styl
View File

@ -22,22 +22,34 @@
@media mq-mini @media mq-mini
padding: 0 15px padding: 0 15px
.archive-year
@extend $block-caption
.archive-article .archive-article
clearfix() clearfix()
avoid-column-break() avoid-column-break()
@extend $block @extend $block
padding: 0 padding: 0
margin-bottom: 15px margin-bottom: 15px
&.archive-type-summary
padding: 15px
.article-entry
padding: 0
p
margin: 12px 0
.archive-article-content,
.archive-article-thumbnail
display: table-cell
vertical-align: top
@media mq-mini
display: block
.archive-article-thumbnail .archive-article-thumbnail
float: left
margin-right: 10px
.thumbnail
width: 160px width: 160px
height: 90px padding-right: 15px
@media mq-mini
width: 100%
padding-bottom: 15px
.thumbnail
height: 0
width: 100%
padding-bottom: 56.25%
display: block display: block
position: relative position: relative
overflow: hidden overflow: hidden
@ -51,25 +63,22 @@
background-position: center background-position: center
.thumbnail-none .thumbnail-none
background-image: url(thumbnail-default-small) background-image: url(thumbnail-default-small)
@media mq-mini
.thumbnail .archive-year
width: 120px @extend $block-caption
height: 67.5px
.archive-article-header .archive-article-header
padding: 10px
a a
@extend $link-dark @extend $link-dark
.archive-article-title .archive-article-title
font-size: 1.2em
line-height: 1.2em
@media mq-mini
font-size: 1em
line-height: 1em
height: 1em
overflow: hidden
display: block display: block
font-size: 1.6em
line-height: 1.4em
margin-bottom: 12px
@media mq-mini
display: block
font-size: 1.3em
.archive-article-date .archive-article-date
display: block display: block

4
source/css/_partial/article.styl
View File

@ -19,7 +19,6 @@
font-size: 2em font-size: 2em
color: color-default color: color-default
text-decoration: none text-decoration: none
transition: color 0.2s
line-height: line-height-title line-height: line-height-title
a&:visited a&:visited
color: color-default color: color-default
@ -37,11 +36,10 @@
& > div & > div
float: left float: left
margin-right: 10px margin-right: 10px
color: color-default + #444
.fa .fa
margin-right: 3px margin-right: 3px
a a
color: color-default + #444 color: color-default
&:hover &:hover
color: color-link color: color-link