Nofated095
/
hexo-theme-amane
mirror of https://github.com/Nofated095/hexo-theme-amane.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: redesign archive list style

This commit is contained in:
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

74
layout/common/archive.ejs
View File

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

@ -6,9 +6,9 @@
<%- partial('post/gallery') %>
<% if (post.link || post.title) { %>
<header class="article-header">
<%- partial('post/title', {class_name: 'article-title'}) %>
<%- partial('post/title', { class_name: 'article-title' }) %>
<div class="article-meta">
<%- partial('post/date', {class_name: 'article-date', date_format: null}) %>
<%- partial('post/date', { class_name: 'article-date', date_format: null }) %>
<%- partial('post/category') %>
<%- partial('post/tag') %>
</div>

7
layout/common/head.ejs
View File

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

32
layout/common/summary.ejs
View File

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

2
source/css/_extend.styl
View File

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

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

@ -22,54 +22,63 @@
@media mq-mini
padding: 0 15px
.archive-year
@extend $block-caption
.archive-article
clearfix()
avoid-column-break()
@extend $block
padding: 0
margin-bottom: 15px
.archive-article-thumbnail
float: left
margin-right: 10px
.thumbnail
width: 160px
height: 90px
display: block
position: relative
overflow: hidden
span
width: 100%
height: 100%
&.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
.thumbnail-image
position: absolute
background-size: cover
background-position: center
.thumbnail-none
background-image: url(thumbnail-default-small)
@media mq-mini
.archive-article-thumbnail
width: 160px
padding-right: 15px
@media mq-mini
width: 100%
padding-bottom: 15px
.thumbnail
width: 120px
height: 67.5px
height: 0
width: 100%
padding-bottom: 56.25%
display: block
position: relative
overflow: hidden
span
width: 100%
height: 100%
display: block
.thumbnail-image
position: absolute
background-size: cover
background-position: center
.thumbnail-none
background-image: url(thumbnail-default-small)
.archive-year
@extend $block-caption
.archive-article-header
padding: 10px
a
@extend $link-dark
.archive-article-title
font-size: 1.2em
line-height: 1.2em
display: block
font-size: 1.6em
line-height: 1.4em
margin-bottom: 12px
@media mq-mini
font-size: 1em
line-height: 1em
height: 1em
overflow: hidden
display: block
font-size: 1.3em
.archive-article-date
display: block

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

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