Skip to content

S
solo
Commit 4b8dcedd authored by Van's avatar Van
Browse files
Options

就差 responsive 了

parent 45901615
Expand all Show whitespace changes
Inline Side-by-side
Showing with 795 additions and 608 deletions
src/main/webapp/skins/next/archives.ftl
View file @ 4b8dcedd
...@@ -8,42 +8,37 @@ ...@@ -8,42 +8,37 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="container one-column page-archive">
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main id="main" class="main"> <main class="main wrapper">
<div class="main-inner"> <div class="content page-archive">
<div id="content" class="content"> <section class="posts-collapse">
<section id="posts" class="posts-collapse">
<span class="archive-move-on"></span> <span class="archive-move-on"></span>
<span class="archive-page-counter"> <span class="archive-page-counter">
嗯..! 目前共计 ${statistic.statisticPublishedBlogArticleCount} 篇日志。 继续努力。 嗯..! 目前共计 ${statistic.statisticPublishedBlogArticleCount} 篇日志。 继续努力。
</span> </span>
<#if 0 != archiveDates?size> <#if 0 != archiveDates?size>
<#list archiveDates as archiveDate> <#list archiveDates as archiveDate>
<div class="collection-title"> <article>
<header class="post-header">
<h1>
<#if "en" == localeString?substring(0, 2)> <#if "en" == localeString?substring(0, 2)>
<h2 class="archive-year motion-element"> <a class="post-title" href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
<a href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount}) ${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount})
</a> </a>
</h2>
<#else> <#else>
<h2 class="archive-year motion-element"> <a class="post-title" href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
<a href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount}) ${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount})
</a> </a>
</h2>
</#if> </#if>
</div> </h1>
</header>
</article>
</#list> </#list>
</#if> </#if>
</section> </section>
</div> </div>
</div>
<#include "side.ftl"> <#include "side.ftl">
</main> </main>
<#include "footer.ftl"> <#include "footer.ftl">
</div>
</body> </body>
</html> </html>
src/main/webapp/skins/next/article.ftl
View file @ 4b8dcedd
...@@ -9,14 +9,10 @@ ...@@ -9,14 +9,10 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="container one-column page-post-detail">
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main id="main" class="main"> <main class="main wrapper">
<div class="main-inner"> <div class="content">
<div id="content" class="content"> <article class="posts-expand">
<div id="posts" class="posts-expand">
<article class="post post-type-normal">
<header class="post-header"> <header class="post-header">
<h1 class="post-title"> <h1 class="post-title">
${article.articleTitle} ${article.articleTitle}
...@@ -56,45 +52,39 @@ ...@@ -56,45 +52,39 @@
</div> </div>
</#if> </#if>
</div> </div>
<footer class="post-footer"> <footer>
<div class="post-tags"> <div class="post-tags">
<#list article.articleTags?split(",") as articleTag> <#list article.articleTags?split(",") as articleTag>
<a rel="tag" href="${servePath}/tags/${articleTag?url('UTF-8')}"> <a rel="tag" href="${servePath}/tags/${articleTag?url('UTF-8')}">
${articleTag}</a> ${articleTag}</a>
</#list> </#list>
</div> </div>
<div class="post-nav"> <div class="post-nav fn-clear">
<#if nextArticlePermalink?? || previousArticlePermalink??>
<#if previousArticlePermalink??> <#if previousArticlePermalink??>
<div class="post-nav-next post-nav-item"> <div class="post-nav-prev post-nav-item fn-left">
<a href="${servePath}${previousArticlePermalink}" rel="next" title="${previousArticleTitle}"> <a href="${servePath}${previousArticlePermalink}" rel="next" title="${previousArticleTitle}">
<i class="fa fa-chevron-left"></i> ${previousArticleTitle} < ${previousArticleTitle}
</a> </a>
</div> </div>
</#if> </#if>
<#if nextArticlePermalink??> <#if nextArticlePermalink??>
<div class="post-nav-prev post-nav-item"> <div class="post-nav-next post-nav-item fn-right">
<a href="${servePath}${nextArticlePermalink}" rel="prev" title="${nextArticleTitle}"> <a href="${servePath}${nextArticlePermalink}" rel="prev" title="${nextArticleTitle}">
${nextArticleTitle} <i class="fa fa-chevron-right"></i> ${nextArticleTitle} >
</a> </a>
</div> </div>
</#if> </#if>
</#if>
</div> </div>
</footer> </footer>
</article> </article>
</div> </div>
<@comments commentList=articleComments article=article></@comments> <@comments commentList=articleComments article=article></@comments>
</div>
</div>
<#include "side.ftl"> <#include "side.ftl">
</main> </main>
<#include "footer.ftl"> <#include "footer.ftl">
<@comment_script oId=article.oId> <@comment_script oId=article.oId>
page.tips.externalRelevantArticlesDisplayCount = "${externalRelevantArticlesDisplayCount}"; page.tips.externalRelevantArticlesDisplayCount = "${externalRelevantArticlesDisplayCount}";
</@comment_script> </@comment_script>
</div>
</body> </body>
</html> </html>
src/main/webapp/skins/next/css/fonts/icomoon.eot 100644 → 100755
View file @ 4b8dcedd
No preview for this file type
src/main/webapp/skins/next/css/fonts/icomoon.svg 100644 → 100755
View file @ 4b8dcedd
This diff is collapsed.
src/main/webapp/skins/next/css/fonts/icomoon.ttf 100644 → 100755
View file @ 4b8dcedd
No preview for this file type
src/main/webapp/skins/next/css/fonts/icomoon.woff 100644 → 100755
View file @ 4b8dcedd
No preview for this file type
src/main/webapp/skins/next/css/fonts/selection.json 100644 → 100755
View file @ 4b8dcedd
This diff is collapsed.
src/main/webapp/skins/next/css/next.css
View file @ 4b8dcedd
...@@ -58,6 +58,11 @@ blockquote { ...@@ -58,6 +58,11 @@ blockquote {
color: #666; color: #666;
border-left: 4px solid #ddd; border-left: 4px solid #ddd;
} }
img {
max-width: 100%;
height: auto;
}
/* end reset */ /* end reset */
/* start function */ /* start function */
...@@ -87,6 +92,47 @@ blockquote { ...@@ -87,6 +92,47 @@ blockquote {
/* end function */ /* end function */
/* start common */ /* start common */
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon.eot?a0psdo');
src: url('fonts/icomoon.eot?a0psdo#iefix') format('embedded-opentype'),
url('fonts/icomoon.ttf?a0psdo') format('truetype'),
url('fonts/icomoon.woff?a0psdo') format('woff'),
url('fonts/icomoon.svg?a0psdo#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-register:before {
content: "\e973";
}
.icon-setting:before {
content: "\e994";
}
.icon-login:before {
content: "\ea13";
}
.icon-logout:before {
content: "\ea14";
}
.icon-rss:before {
content: "\e901";
}
.form { .form {
width: 100%; width: 100%;
margin-top: 50px; margin-top: 50px;
...@@ -204,6 +250,12 @@ blockquote { ...@@ -204,6 +250,12 @@ blockquote {
margin: 0 auto; margin: 0 auto;
} }
.main {
position: relative;
top: -50px;
opacity: 0;
}
.header { .header {
background: #f5f5f5; background: #f5f5f5;
margin-bottom: 80px; margin-bottom: 80px;
...@@ -213,6 +265,9 @@ blockquote { ...@@ -213,6 +265,9 @@ blockquote {
.logo-wrap { .logo-wrap {
float: left; float: left;
margin-left: -20px; margin-left: -20px;
overflow: hidden;
top: 0;
opacity: 0;
} }
.logo-line-before, .logo-line-before,
...@@ -229,11 +284,20 @@ blockquote { ...@@ -229,11 +284,20 @@ blockquote {
display: block; display: block;
height: 2px; height: 2px;
background: #222; background: #222;
left: -100%;
}
.logo-line-after i {
left: auto;
right: -100%;
} }
.logo-wrap .site-title { .logo-wrap .site-title {
font-size: 22px; font-size: 22px;
font-weight: bolder; font-weight: bolder;
opacity: 0;
top: -10px;
position: relative;
} }
.logo-wrap > a { .logo-wrap > a {
...@@ -252,8 +316,9 @@ blockquote { ...@@ -252,8 +316,9 @@ blockquote {
.menu { .menu {
float: left; float: left;
margin: 15px 0 0 20px; margin: 5px 0 0 20px;
padding: 0 20px; padding: 0 20px;
opacity: 0;
} }
.menu .menu-item { .menu .menu-item {
...@@ -325,12 +390,47 @@ blockquote { ...@@ -325,12 +390,47 @@ blockquote {
width: 100%; width: 100%;
background: #fff; background: #fff;
margin-top: 4px; margin-top: 4px;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
} }
.sidebar-toggle-line:first-child { .sidebar-toggle-line:first-child {
margin-top: 0; margin-top: 0;
} }
.sidebar-toggle:hover .sidebar-toggle-line-first {
width: 50%;
transform: rotateZ(-45deg);
top: 3px;
}
.sidebar-toggle:hover .sidebar-toggle-line-middle {
width: 90%;
}
.sidebar-toggle:hover .sidebar-toggle-line-last {
width: 50%;
transform: rotateZ(45deg);
top: -3px;
}
.sidebar-toggle.sidebar-active .sidebar-toggle-line-first {
width: 100%;
transform: rotateZ(-45deg);
top: 6px;
}
.sidebar-toggle.sidebar-active .sidebar-toggle-line-middle {
opacity: 0;
}
.sidebar-toggle.sidebar-active .sidebar-toggle-line-last {
width: 100%;
transform: rotateZ(45deg);
top: -6px;
}
.back-to-top { .back-to-top {
position: fixed; position: fixed;
bottom: 19px; bottom: 19px;
...@@ -368,6 +468,10 @@ blockquote { ...@@ -368,6 +468,10 @@ blockquote {
box-shadow: inset 0 2px 6px #000; box-shadow: inset 0 2px 6px #000;
background: #222; background: #222;
-webkit-transform: translateZ(0); -webkit-transform: translateZ(0);
padding: 20px 10px;
color: #999;
text-align: center;
box-sizing: border-box;
} }
.sidebar a { .sidebar a {
color: #999; color: #999;
...@@ -376,12 +480,101 @@ blockquote { ...@@ -376,12 +480,101 @@ blockquote {
.sidebar a:hover { .sidebar a:hover {
color: #eee; color: #eee;
} }
.sidebar .site-author-image {
display: block;
margin: 20px auto 0;
max-width: 96px;
height: auto;
border: 2px solid #333;
padding: 2px;
}
.sidebar .site-author-name {
margin: 5px 0 0;
color: #f5f5f5;
}
.sidebar .site-description {
margin-top: 5px;
font-size: 14px;
color: #555;
}
.sidebar .site-state-item {
display: inline-block;
padding: 0 15px;
border-left: 1px solid #333;
}
.sidebar .site-state-item:first-child {
border-left: none;
}
.sidebar .site-state-item a {
border-bottom: none;
}
.sidebar .site-state-item-count {
display: block;
text-align: center;
font-size: 18px;
}
.sidebar .site-state-item-name {
font-size: 13px;
}
.sidebar .feed-link {
margin-top: 20px;
}
.sidebar .feed-link a {
display: inline-block;
padding: 3px 15px;
color: #fc6423;
border: 1px solid #fc6423;
border-radius: 4px;
}
.sidebar .feed-link a:hover {
color: #fff;
background: #fc6423;
}
.sidebar .links-of-author {
margin-top: 20px;
}
.sidebar .links-of-author a {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
margin-bottom: 10px;
border-bottom-color: #555;
font-size: 13px;
}
.sidebar .links-of-author a:before {
display: inline-block;
vertical-align: middle;
margin-right: 3px;
content: " ";
width: 4px;
height: 4px;
border-radius: 50%;
background: #0dd5ff;
}
.sidebar .b3-solo-list {
margin: 20px;
list-style: none;
text-align: left;
padding: 0;
font-size: 14px;
line-height: 2;
}
/* end side */ /* end side */
/* start list*/ /* start list*/
.posts-expand .post-item { .posts-expand .post-item {
margin-top: 120px; margin-top: 120px;
} }
.posts-expand .post-item:first-child {
margin-top: 0;
}
.post-title-link { .post-title-link {
display: inline-block; display: inline-block;
...@@ -462,6 +655,50 @@ blockquote { ...@@ -462,6 +655,50 @@ blockquote {
} }
/* end list*/ /* end list*/
/* start article */
.post-header {
text-align: center;
}
.post-body img {
box-sizing: border-box;
margin: auto;
padding: 3px;
border: 1px solid #ddd;
}
.posts-expand .post-tags {
margin-top: 40px;
}
.posts-expand .post-tags a {
padding: 1px 5px;
background: #f5f5f5;
border-bottom: none;
}
.posts-expand .post-tags a:hover {
background: #ccc;
}
.posts-expand .post-nav {
margin-top: 40px;
overflow: hidden;
padding: 10px;
white-space: nowrap;
border-top: 1px solid #eee;
}
.post-nav-item a:hover {
color: #222;
border-bottom: none;
}
.post-nav-item a {
position: relative;
display: inline-block;
line-height: 25px;
font-size: 14px;
color: #555;
border-bottom: none;
width: 50%;
}
/* end article */
/* start comments */ /* start comments */
ul.comments { ul.comments {
padding: 0; padding: 0;
...@@ -535,9 +772,14 @@ ul.comments .comment-meta time { ...@@ -535,9 +772,14 @@ ul.comments .comment-meta time {
/* end comments */ /* end comments */
/* start tags */ /* start tags */
.tag-cloud {
text-align: center;
}
#tags li { #tags li {
list-style: none; list-style: none;
display: inline-block; display: inline-block;
margin: 10px;
} }
#tags .tags1 { #tags .tags1 {
...@@ -566,8 +808,116 @@ ul.comments .comment-meta time { ...@@ -566,8 +808,116 @@ ul.comments .comment-meta time {
} }
/* end tags */ /* end tags */
/* start archives */
.posts-collapse .collection-title::before {
content: " ";
position: absolute;
left: 0;
top: 50%;
margin-left: -4px;
margin-top: -4px;
width: 8px;
height: 8px;
background: #bbb;
border-radius: 50%;
}
.posts-collapse .collection-title {
position: relative;
margin: 60px 0;
}
.posts-collapse .collection-title h2 {
margin-left: 20px;
}
.posts-collapse .collection-title small {
color: #bbb;
}
.posts-collapse .post-header::before {
content: " ";
position: absolute;
left: 0;
top: 12px;
width: 6px;
height: 6px;
margin-left: -4px;
background: #bbb;
border-radius: 50%;
border: 1px solid #fff;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
transition-property: background;
}
.posts-collapse .post-header {
position: relative;
transition-duration: 0.2s;
transition-timing-function: ease-in-out;
transition-delay: 0s;
transition-property: border;
border-bottom: 1px dashed #ccc;
text-align: left;
}
.posts-collapse .post-header:hover {
border-bottom-color: #666;
}
.posts-collapse .post-header:hover::before {
background: #222;
}
.posts-collapse .post-time {
position: absolute;
font-size: 12px;
left: 20px;
top: 8px;
}
.posts-collapse .post-title {
margin-left: 70px;
font-size: 16px;
font-weight: normal;
font-family: Lato, "PingFang SC", "Microsoft YaHei", sans-serif;
line-height: inherit;
text-decoration: none;
border-bottom: 0;
color: #666;
}
.page-archive .archive-page-counter {
position: relative;
top: 7px;
left: 20px;
margin-bottom: 50px;
display: block;
}
.page-archive .posts-collapse .archive-move-on {
position: absolute;
top: 11px;
left: 0;
margin-left: -6px;
width: 10px;
height: 10px;
opacity: 0.5;
background: #555;
border: 1px solid #fff;
border-radius: 50%;
}
.page-archive .post-title {
margin-left: 20px;
}
.page-archive .posts-collapse .post-header::before {
top: 8px;
}
.page-archive .posts-collapse::after {
top: 20px;
left: 0;
margin-left: -2px;
width: 4px;
height: 100%;
background: #f5f5f5;
z-index: -1;
content: " ";
position: absolute;
}
/* end archives */
/* start responsive */ /* start responsive */
@media (max-width: 767px) { @media (max-width: 500px) {
.site-nav-toggle { .site-nav-toggle {
display: block; display: block;
} }
......
src/main/webapp/skins/next/dynamic.ftl
View file @ 4b8dcedd
...@@ -8,22 +8,16 @@ ...@@ -8,22 +8,16 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="container one-column page-home">
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main id="main" class="main"> <main class="main wrapper">
<div class="main-inner"> <div class="content">
<div id="content" class="content">
<#if 0 != recentComments?size> <#if 0 != recentComments?size>
<ul class="comments" id="comments"> <ul class="comments" id="comments">
<#list recentComments as comment> <#list recentComments as comment>
<#if comment_index < 6>
<li class="fn-clear"> <li class="fn-clear">
<div class="fn-left avatar-warp">
<img class="avatar-48" title="${comment.commentName}" src="${comment.commentThumbnailURL}"> <img class="avatar-48" title="${comment.commentName}" src="${comment.commentThumbnailURL}">
</div> <div class="comment-body">
<div class="fn-left" style="width: 90%"> <div class="fn-clear comment-meta">
<div class="fn-clear post-meta">
<span class="fn-left"> <span class="fn-left">
<#if "http://" == comment.commentURL> <#if "http://" == comment.commentURL>
<span>${comment.commentName}</span> <span>${comment.commentName}</span>
...@@ -32,22 +26,20 @@ ...@@ -32,22 +26,20 @@
</#if> </#if>
<time>${comment.commentDate?string("yyyy-MM-dd HH:mm")}</time> <time>${comment.commentDate?string("yyyy-MM-dd HH:mm")}</time>
</span> </span>
<a class="fn-right" href="${servePath}${comment.commentSharpURL}">${viewLabel}»</a>
</div> </div>
<div class="comment-content"> <div class="comment-content">
${comment.commentContent} ${comment.commentContent}
</div> </div>
</div> </div>
</li> </li>
</#if>
</#list> </#list>
</ul> </ul>
</#if> </#if>
</div> </div>
</div>
<#include "side.ftl"> <#include "side.ftl">
</main> </main>
<#include "footer.ftl"> <#include "footer.ftl">
</div>
<script> <script>
var $commentContents = $(".comments .comment-content"); var $commentContents = $(".comments .comment-content");
......
src/main/webapp/skins/next/index.ftl
View file @ 4b8dcedd
...@@ -12,7 +12,6 @@ ...@@ -12,7 +12,6 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main class="main wrapper"> <main class="main wrapper">
<div class="content"> <div class="content">
......
src/main/webapp/skins/next/js/next.js
View file @ 4b8dcedd
...@@ -37,7 +37,6 @@ var NexT = { ...@@ -37,7 +37,6 @@ var NexT = {
$sidebar.animate({ $sidebar.animate({
right: -320 right: -320
}); });
} else { } else {
$(this).addClass('sidebar-active'); $(this).addClass('sidebar-active');
$('body').animate({ $('body').animate({
...@@ -52,9 +51,38 @@ var NexT = { ...@@ -52,9 +51,38 @@ var NexT = {
$('.site-nav-toggle').click(function () { $('.site-nav-toggle').click(function () {
$('.site-nav').slideToggle(); $('.site-nav').slideToggle();
}); });
$(document).ready(function () {
setTimeout(function () {
$('.logo-wrap').css('opacity', 1);
$('.logo-line-before i').animate({
'left': '0'
}, function () {
$('.site-title').css('opacity', 1).animate({
'top': 0
}, function () {
$('.menu').css('opacity', 1).animate({
'margin-top': '15px'
});
$('.main').css('opacity', 1).animate({
'top': '0'
});
});
});
$('.logo-line-after i').animate({
'right': '0'
});
}, 500);
});
}, },
initArticle: function () { initArticle: function () {
$('.sidebar-inner').html($('.b3-solo-list')); if ($('.b3-solo-list li').length > 0) {
$('.sidebar').html($('.b3-solo-list'));
$('.sidebar-toggle').click();
}
} }
}; };
NexT.init(); NexT.init();
\ No newline at end of file
src/main/webapp/skins/next/macro-comments.ftl
View file @ 4b8dcedd
<#macro comments commentList article> <#macro comments commentList article>
<ul class="comments fn-wrap" id="comments"> <ul class="comments" id="comments">
<#list commentList as comment> <#list commentList as comment>
<li id="${comment.oId}" class="fn-clear"> <li id="${comment.oId}" class="fn-clear">
<img class="avatar-48" title="${comment.commentName}" src="${comment.commentThumbnailURL}"> <img class="avatar-48" title="${comment.commentName}" src="${comment.commentThumbnailURL}">
......
src/main/webapp/skins/next/page.ftl
View file @ 4b8dcedd
...@@ -9,29 +9,17 @@ ...@@ -9,29 +9,17 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="container one-column page-post-detail">
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main id="main" class="main"> <main class="main wrapper">
<div class="main-inner"> <div class="content">
<div id="content" class="content"> <article class="post-body">
<div id="posts" class="posts-expand">
<article class="post post-type-normal">
<div class="post-body">
${page.pageContent} ${page.pageContent}
</div>
</article> </article>
</div>
<@comments commentList=pageComments article=page></@comments> <@comments commentList=pageComments article=page></@comments>
</div>
</div> </div>
<#include "side.ftl"> <#include "side.ftl">
</main> </main>
<#include "footer.ftl"> <#include "footer.ftl">
<@comment_script oId=page.oId></@comment_script> <@comment_script oId=page.oId></@comment_script>
</div>
</body> </body>
</html> </html>
src/main/webapp/skins/next/side.ftl
View file @ 4b8dcedd
...@@ -5,17 +5,14 @@ ...@@ -5,17 +5,14 @@
</div> </div>
<aside class="sidebar"> <aside class="sidebar">
<div class="sidebar-inner"> <section>
<section class="site-overview sidebar-panel sidebar-panel-active "> <img class="site-author-image" src="${adminUser.userAvatar}" title="${userName}"/>
<div class="site-author motion-element">
<img class="site-author-image skip" src="${adminUser.userAvatar}" title="${userName}"/>
<p class="site-author-name">${userName}</p> <p class="site-author-name">${userName}</p>
</div>
<#if "" != noticeBoard> <#if "" != noticeBoard>
<p class="site-description motion-element">${blogSubtitle}</p> <p class="site-description motion-element">${blogSubtitle}</p>
</#if> </#if>
<nav class="site-state motion-element"> <nav>
<div class="site-state-item site-state-posts"> <div class="site-state-item">
<a href="/archives"> <a href="/archives">
<span class="site-state-item-count">${statistic.statisticPublishedBlogArticleCount}</span> <span class="site-state-item-count">${statistic.statisticPublishedBlogArticleCount}</span>
<span class="site-state-item-name">日志</span> <span class="site-state-item-name">日志</span>
...@@ -35,24 +32,24 @@ ...@@ -35,24 +32,24 @@
</div> </div>
</nav> </nav>
<div class="feed-link motion-element"> <div class="feed-link">
<a href="${servePath}/blog-articles-rss.do" rel="alternate"> <a href="${servePath}/blog-articles-rss.do" rel="alternate">
<i class="fa fa-rss"></i> <i class="icon-rss"></i>
RSS RSS
</a> </a>
</div> </div>
<div class="links-of-author motion-element"> <div class="links-of-author">
<#if isLoggedIn> <#if isLoggedIn>
<span class="links-of-author-item"> <span class="links-of-author-item">
<a href="${servePath}/admin-index.do#main" title="${adminLabel}"> <a href="${servePath}/admin-index.do#main" title="${adminLabel}">
<i class="fa fa-github"></i> ${adminLabel} <i class="icon-setting"></i> ${adminLabel}
</a> </a>
</span> </span>
<span class="links-of-author-item"> <span class="links-of-author-item">
<a href="${logoutURL}"> <a href="${logoutURL}">
<i class="fa fa-weibo"></i> ${logoutLabel} <i class="icon-logout"></i> ${logoutLabel}
</a> </a>
</span> </span>
<#else> <#else>
...@@ -64,20 +61,20 @@ ...@@ -64,20 +61,20 @@
<span class="links-of-author-item"> <span class="links-of-author-item">
<a href="${servePath}/register"> <a href="${servePath}/register">
<i class="fa fa-weibo"></i> ${registerLabel} <i class="icon-register"></i> ${registerLabel}
</a> </a>
</span> </span>
</#if> </#if>
</div> </div>
<#if noticeBoard??> <#if noticeBoard??>
<div class="links-of-author motion-element"> <div class="links-of-author">
${noticeBoard} ${noticeBoard}
</div> </div>
</#if> </#if>
<#if 0 != links?size> <#if 0 != links?size>
<div class="links-of-author motion-element"> <div class="links-of-author">
<p class="site-author-name">Links</p> <p class="site-author-name">Links</p>
<#list links as link> <#list links as link>
<span class="links-of-author-item"> <span class="links-of-author-item">
...@@ -89,7 +86,5 @@ ...@@ -89,7 +86,5 @@
</#list> </#list>
</div> </div>
</#if> </#if>
</section> </section>
</div>
</aside> </aside>
\ No newline at end of file
src/main/webapp/skins/next/tag-articles.ftl
View file @ 4b8dcedd
...@@ -8,14 +8,9 @@ ...@@ -8,14 +8,9 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="container one-column">
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main id="main" class="main"> <main class="main wrapper">
<div class="main-inner"> <div class="content posts-collapse">
<div id="content" class="content">
<div id="posts" class="posts-collapse">
<div class="collection-title"> <div class="collection-title">
<h2> <h2>
${tag.tagTitle} ${tag.tagTitle}
...@@ -23,11 +18,11 @@ ...@@ -23,11 +18,11 @@
</h2> </h2>
</div> </div>
<#list articles as article> <#list articles as article>
<article class="post post-type-normal"> <article>
<header class="post-header"> <header class="post-header">
<h1 class="post-title"> <h1>
<a class="post-title-link" href="${servePath}${article.articlePermalink}"> <a class="post-title" href="${servePath}${article.articlePermalink}">
<span itemprop="name">${article.articleTitle}</span> <span>${article.articleTitle}</span>
<#if article.articlePutTop> <#if article.articlePutTop>
<sup> <sup>
${topArticleLabel} ${topArticleLabel}
...@@ -40,11 +35,9 @@ ...@@ -40,11 +35,9 @@
</#if> </#if>
</a> </a>
</h1> </h1>
<div class="post-meta">
<time class="post-time"> <time class="post-time">
${article.articleCreateDate?string("MM-dd")} ${article.articleCreateDate?string("MM-dd")}
</time> </time>
</div>
</header> </header>
</article> </article>
</#list> </#list>
...@@ -52,7 +45,7 @@ ...@@ -52,7 +45,7 @@
<#if 0 != paginationPageCount> <#if 0 != paginationPageCount>
<nav class="pagination"> <nav class="pagination">
<#if 1 != paginationPageNums?first> <#if 1 != paginationPageNums?first>
<a href="${servePath}${path}/${paginationPreviousPageNum}" class="extend"><i class="fa fa-angle-left"></i></a> <a href="${servePath}${path}/${paginationPreviousPageNum}" class="extend next"><<</a>
<a class="page-number" href="${servePath}${path}/1">1</a> ... <a class="page-number" href="${servePath}${path}/1">1</a> ...
</#if> </#if>
<#list paginationPageNums as paginationPageNum> <#list paginationPageNums as paginationPageNum>
...@@ -64,16 +57,13 @@ ...@@ -64,16 +57,13 @@
</#list> </#list>
<#if paginationPageNums?last != paginationPageCount> ... <#if paginationPageNums?last != paginationPageCount> ...
<a href="${servePath}${path}/${paginationPageCount}" class="page-number">${paginationPageCount}</a> <a href="${servePath}${path}/${paginationPageCount}" class="page-number">${paginationPageCount}</a>
<a href="${servePath}${path}/${paginationNextPageNum}" class="extend next"><i class="fa fa-angle-right"></i></a> <a href="${servePath}${path}/${paginationNextPageNum}" class="extend next">>></a>
</#if> </#if>
</nav> </nav>
</#if> </#if>
</div> </div>
</div>
</div>
<#include "side.ftl"> <#include "side.ftl">
</main> </main>
<#include "footer.ftl"> <#include "footer.ftl">
</div>
</body> </body>
</html> </html>
src/main/webapp/skins/next/tags.ftl
View file @ 4b8dcedd
...@@ -8,19 +8,11 @@ ...@@ -8,19 +8,11 @@
</@head> </@head>
</head> </head>
<body> <body>
<div class="container one-column">
<div class="headband"></div>
<#include "header.ftl"> <#include "header.ftl">
<main id="main" class="main"> <main class="main wrapper">
<div class="main-inner"> <div class="content">
<div id="content" class="content">
<div id="posts" class="posts-expand">
<div class="tag-cloud"> <div class="tag-cloud">
<div class="tag-cloud-title">
目前共计 ${tags?size} 个标签 目前共计 ${tags?size} 个标签
</div>
<ul class="tag-cloud-tags fn-clear" id="tags"> <ul class="tag-cloud-tags fn-clear" id="tags">
<#list tags as tag> <#list tags as tag>
<li> <li>
...@@ -34,14 +26,11 @@ ...@@ -34,14 +26,11 @@
</ul> </ul>
</div> </div>
</div> </div>
</div>
</div>
<#include "side.ftl"> <#include "side.ftl">
</main> </main>
<#include "footer.ftl"> <#include "footer.ftl">
<script> <script>
Util.buildTags(); Util.buildTags();
</script> </script>
</div>
</body> </body>
</html> </html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment