This commit is contained in:
Van 2018-09-02 01:09:53 +08:00
parent 8cc787a718
commit b2fa8216a0
No known key found for this signature in database
GPG Key ID: 7059B8783A78F16C
11 changed files with 603 additions and 246 deletions

View File

@ -17,34 +17,32 @@
along with this program. If not, see <https://www.gnu.org/licenses/>. along with this program. If not, see <https://www.gnu.org/licenses/>.
--> -->
<li id="${comment.oId}"> <li id="${comment.oId}" class="comments__item">
<div> <div class="comments__avatar" style="background-image: url(${comment.commentThumbnailURL})"></div>
<div class="avatar tooltipped tooltipped-n" aria-label="${comment.commentName}" <div class="comments__meta fn__flex">
style="background-image: url(${comment.commentThumbnailURL})"></div> <div class="fn__flex-1">
<main> <#if "http://" == comment.commentURL>
<div class="fn-clear">
<#if "http://" == comment.commentURL>
${comment.commentName} ${comment.commentName}
<#else> <#else>
<a class="user-name" href="${comment.commentURL}" target="_blank">${comment.commentName}</a> <a href="${comment.commentURL}" target="_blank">${comment.commentName}</a>
</#if> </#if>
<#if comment.isReply>
<#if comment.isReply> @<a href="${servePath}${article.permalink}#${comment.commentOriginalCommentId}"
@<a class="user-name" href="${servePath}${article.permalink}#${comment.commentOriginalCommentId}" onmouseover="page.showComment(this, '${comment.commentOriginalCommentId}', 28);"
onmouseover="page.showComment(this, '${comment.commentOriginalCommentId}', 23);" onmouseout="page.hideComment('${comment.commentOriginalCommentId}')"
onmouseout="page.hideComment('${comment.commentOriginalCommentId}')" >${comment.commentOriginalCommentName}</a>
>${comment.commentOriginalCommentName}</a> </#if>
</#if> </div>
<time>${comment.commentDate?string("yyyy-MM-dd HH:mm")}</time>
<time class="ft-gray">${comment.commentDate?string("yyyy-MM-dd HH:mm")}</time>
<#if article?? && article.commentable>
<a class="reply-btn" href="javascript:replyTo('${comment.oId}')">${replyLabel}</a>
</#if>
</div>
<div class="content-reset">
${comment.commentContent}
</div>
</main>
</div> </div>
<main class="comments__content fn__clear">
<div class="content-reset">
${comment.commentContent}
</div>
<#if article?? && article.commentable>
<a class="fn__right breadcrumb" href="javascript:replyTo('${comment.oId}')">${replyLabel}</a>
<#else>
<a class="fn__right breadcrumb" href="${servePath}${comment.commentSharpURL}">${viewLabel}»</a>
</#if>
</main>
</li> </li>

View File

@ -503,6 +503,77 @@ blockquote {
margin-top: -5px; margin-top: -5px;
border-right-color: rgba(0, 0, 0, 0.8); } border-right-color: rgba(0, 0, 0, 0.8); }
/*
* Symphony - A modern community (forum/BBS/SNS/blog) platform written in Java.
* Copyright (C) 2012-2018, b3log.org & hacpai.com
*
* 本文件属于 Sym 商业版的一部分请仔细阅读项目根文件夹的 LICENSE 并严格遵守相关约定
*/
/**
* comment
*
* @author <a href="http://vanessa.b3log.org">Liyuan Li</ta>
* @version 0.1.0.0, Sep 1, 2018
*/
.em00, .em01, .em02, .em03, .em04, .em05, .em06, .em07, .em08, .em09, .em10, .em11, .em12, .em13, .em14 {
cursor: pointer;
background-image: url(../../../images/emotions/emotions.png);
background-size: 120px;
float: left;
height: 24px;
margin-right: 5px;
width: 24px;
transition: all .2s ease-out;
-webkit-transition: all .2s ease-out;
-moz-transition: all .2s ease-out; }
#emotions span:hover {
transform: scale(1.2) rotate(360deg);
-webkit-transform: scale(1.2) rotate(360deg);
-moz-transform: scale(1.2) rotate(360deg); }
.em01 {
background-position: -24px 0; }
.em02 {
background-position: -48px 0; }
.em03 {
background-position: -72px 0; }
.em04 {
background-position: -96px 0; }
.em05 {
background-position: 0 -24px; }
.em06 {
background-position: -24px -24px; }
.em07 {
background-position: -48px -24px; }
.em08 {
background-position: -72px -24px; }
.em09 {
background-position: -96px -24px; }
.em10 {
background-position: 0 -48px; }
.em11 {
background-position: -24px -48px; }
.em12 {
background-position: -48px -48px; }
.em13 {
background-position: -72px -48px; }
.em14 {
background-position: -96px -48px; }
/** /**
* Solo - A small and beautiful blogging system written in Java. * Solo - A small and beautiful blogging system written in Java.
* Copyright (c) 2010-2018, b3log.org & hacpai.com * Copyright (c) 2010-2018, b3log.org & hacpai.com
@ -598,6 +669,12 @@ a {
transition: all .3s; transition: all .3s;
cursor: url(../images/pointer.cur), url(../images/pointer.cur), auto; } cursor: url(../images/pointer.cur), url(../images/pointer.cur), auto; }
.content-reset img {
vertical-align: sub; }
.ft__red {
color: #b94a48; }
.module { .module {
border-radius: 5px; border-radius: 5px;
overflow: hidden; overflow: hidden;
@ -717,6 +794,11 @@ a {
left: 30px; } left: 30px; }
.header__nav { .header__nav {
text-align: center; } text-align: center; }
.header__nav img {
float: left;
height: 20px;
width: 20px;
margin: 15px 5px 0 0; }
.header__login { .header__login {
position: absolute; position: absolute;
right: 30px; right: 30px;
@ -857,6 +939,92 @@ a {
text-decoration: none; text-decoration: none;
background-color: #6658b8; } background-color: #6658b8; }
.comments {
position: relative; }
.comments__item {
border-radius: 5px;
list-style: none;
margin-bottom: 30px;
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
transition: all .3s;
position: relative; }
.comments__item:hover {
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.8); }
.comments__item:hover .comments__avatar {
transform: rotate(720deg);
border-radius: 0; }
.comments__item:hover .comments__content {
background-color: #fff; }
.comments__item:hover .comments__meta {
background-color: #d9edf7; }
.comments__meta {
border-radius: 5px 5px 0 0;
min-height: 37px;
line-height: 37px;
padding-left: 45px;
background: rgba(217, 237, 247, 0.6);
color: #3d4450;
padding-right: 15px; }
.comments__meta a {
font-weight: 700;
color: #3d4450; }
.comments__meta a:hover {
color: #b94a48; }
.comments__meta--only {
border-radius: 5px; }
.comments__content {
border-radius: 0 0 5px 5px;
background-color: rgba(255, 255, 255, 0.8);
padding: 15px 15px 15px 45px; }
.comments__avatar {
position: absolute;
height: 54px;
width: 54px;
background-position: center center;
background-size: cover;
border: 2px solid #fff;
border-radius: 35px;
left: -29px;
top: 15px;
transition: all .8s ease; }
.comments__captcha {
height: 30px; }
.comments__reply {
border-radius: 5px;
margin: 15px auto 0; }
.comment-body-ref {
right: 0;
position: absolute;
left: 64px; }
.comment-body-ref .breadcrumb {
display: none; }
.form input,
.form textarea {
border: 1px solid #d1d5da;
background-color: #fafafa;
border-radius: 3px;
box-shadow: inset 0 1px 2px rgba(27, 31, 35, 0.075);
padding: 7px 8px;
width: 100%;
line-height: 17px;
box-sizing: border-box; }
.form input:focus,
.form textarea:focus {
background-color: #fff;
box-shadow: inset 0 1px 2px rgba(27, 31, 35, 0.075), 0 0 0 0.2em #dbedff;
border: 1px solid #4285f4; }
.form .ft__red {
line-height: 34px; }
.form .btn {
float: right;
height: 34px;
margin: 0 0 0 10px;
padding: 0 15px; }
@media (max-width: 768px) { @media (max-width: 768px) {
.header__nav { .header__nav {
display: none; } display: none; }

View File

@ -25,6 +25,7 @@
@import "../../../scss/reset-content"; @import "../../../scss/reset-content";
@import "../../../scss/function"; @import "../../../scss/function";
@import "../../../scss/tooltipped"; @import "../../../scss/tooltipped";
@import "../../../scss/comment";
@import "icon"; @import "icon";
$purple: #7266BA !default; $purple: #7266BA !default;
@ -42,6 +43,14 @@ a {
cursor: url(../images/pointer.cur), url(../images/pointer.cur), auto cursor: url(../images/pointer.cur), url(../images/pointer.cur), auto
} }
.content-reset img {
vertical-align: sub;
}
.ft__red {
color: $red;
}
// module // module
.module { .module {
border-radius: 5px; border-radius: 5px;
@ -216,6 +225,13 @@ a {
&__nav { &__nav {
text-align: center; text-align: center;
img {
float: left;
height: 20px;
width: 20px;
margin: 15px 5px 0 0;
}
} }
&__login { &__login {
@ -412,6 +428,126 @@ a {
} }
} }
// comment
.comments {
position: relative;
&__item {
border-radius: 5px;
list-style: none;
margin-bottom: 30px;
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
transition: all .3s;
position: relative;
&:hover {
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.8);
.comments__avatar {
transform: rotate(720deg);
border-radius: 0;
}
.comments__content {
background-color: #fff;
}
.comments__meta {
background-color: rgba(217, 237, 247, 1);
}
}
}
&__meta {
border-radius: 5px 5px 0 0;
min-height: 37px;
line-height: 37px;
padding-left: 45px;
background: rgba(217, 237, 247, 0.6);
color: $black;
padding-right: 15px;
a {
font-weight: 700;
color: $black;
&:hover {
color: $red;
}
}
&--only {
border-radius: 5px;
}
}
&__content {
border-radius: 0 0 5px 5px;
background-color: rgba(255, 255, 255, 0.8);
padding: 15px 15px 15px 45px;
}
&__avatar {
position: absolute;
height: 54px;
width: 54px;
background-position: center center;
background-size: cover;
border: 2px solid #fff;
border-radius: 35px;
left: -29px;
top: 15px;
transition: all .8s ease;
}
&__captcha {
height: 30px;
}
&__reply {
border-radius: 5px;
margin: 15px auto 0
}
}
.comment-body-ref {
right: 0;
position: absolute;
left: 64px;
.breadcrumb {
display: none;
}
}
.form {
input,
textarea {
border: 1px solid #d1d5da;
background-color: #fafafa;
border-radius: 3px;
box-shadow: inset 0 1px 2px rgba(27, 31, 35, .075);
padding: 7px 8px;
width: 100%;
line-height: 17px;
box-sizing: border-box;
&:focus {
background-color: #fff;
box-shadow: inset 0 1px 2px rgba(27, 31, 35, .075), 0 0 0 0.2em #dbedff;
border: 1px solid #4285f4;
}
}
.ft__red {
line-height: 34px;
}
.btn {
float: right;
height: 34px;
margin: 0 0 0 10px;
padding: 0 15px;
}
}
@media (max-width: 768px) { @media (max-width: 768px) {
.header__nav { .header__nav {
display: none; display: none;

View File

@ -30,32 +30,18 @@
<#include "header.ftl"> <#include "header.ftl">
<div class="main"> <div class="main">
<main class="content"> <main class="content">
<div class="module">
<div class="module__content ft__center">
<i class="icon__home"></i>
<a href="${servePath}" class="breadcrumb">${blogTitle}</a>
&nbsp; > &nbsp;
<i class="icon__refresh"></i> ${dynamicLabel}
</div>
</div>
<#if 0 != recentComments?size> <#if 0 != recentComments?size>
<ul class="comments" id="comments"> <ul class="comments">
<#list recentComments as comment> <#list recentComments as comment>
<#include "common-comment.ftl"/> <#include "common-comment.ftl"/>
<li id="${comment.oId}">
<div>
<div class="avatar tooltipped tooltipped-n" aria-label="${comment.commentName}"
style="background-image: url(${comment.commentThumbnailURL})"></div>
<main>
<div class="fn-clear">
<#if "http://" == comment.commentURL>
${comment.commentName}
<#else>
<a class="user-name" href="${comment.commentURL}"
target="_blank">${comment.commentName}</a>
</#if>
<time class="ft-gray">${comment.commentDate?string("yyyy-MM-dd HH:mm")}</time>
<a class="reply-btn"
href="${servePath}${comment.commentSharpURL}">${viewLabel}»</a>
</div>
<div class="content-reset">
${comment.commentContent}
</div>
</main>
</div>
</li>
</#list> </#list>
</ul> </ul>
</#if> </#if>

File diff suppressed because one or more lines are too long

19
nijigen/js/isotope.pkgd.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -20,36 +20,44 @@
<#include "macro-head.ftl"> <#include "macro-head.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${blogTitle}"> <@head title="${blogTitle}">
<meta name="keywords" content="${metaKeywords},${archiveLabel}"/> <meta name="keywords" content="${metaKeywords},${archiveLabel}"/>
<meta name="description" content="${metaDescription},${archiveLabel}"/> <meta name="description" content="${metaDescription},${archiveLabel}"/>
</@head> </@head>
</head> </head>
<body> <body>
<#include "header.ftl"> <#include "header.ftl">
<div class="wrapper"> <div class="main">
<div class="main-wrap"> <main class="content">
<main class="other"> <div class="module">
<div class="title"> <div class="module__content ft__center">
<h2><i class="icon-link"></i> <i class="icon__home"></i>
&nbsp;${linkLabel}</h2> <a href="${servePath}" class="breadcrumb">${blogTitle}</a>
</div> &nbsp; > &nbsp;
<#if 0 != links?size> <i class="icon__link"></i>
<ul class="list"> ${linkLabel}
<#list links as link>
<li>
<a rel="friend" href="${link.linkAddress}" title="${link.linkDescription}" target="_blank">
${link.linkTitle}
</a>
</li>
</#list>
</ul>
</#if>
</main>
<#include "side.ftl">
</div> </div>
</div> </div>
<#include "footer.ftl"> <div class="module">
</body> <div class="module__list">
<#if 0 != links?size>
<ul class="list">
<#list links as link>
<li>
<a rel="friend" href="${link.linkAddress}" title="${link.linkDescription}"
target="_blank">
${link.linkTitle}
</a>
</li>
</#list>
</ul>
</#if>
</div>
</div>
</main>
<#include "side.ftl">
</div>
<#include "footer.ftl">
</body>
</html> </html>

View File

@ -18,102 +18,114 @@
--> -->
<#macro comments commentList article> <#macro comments commentList article>
<header class='title'><h2>${commentLabel}</h2></header> <div class="comments__item">
<div class="comments__meta comments__meta--only">${commentLabel}</div>
</div>
<ul class="comments" id="comments"> <ul class="comments" id="comments">
<#list commentList as comment> <#list commentList as comment>
<#include 'common-comment.ftl'/> <#include 'common-comment.ftl'/>
</#list> </#list>
</ul> </ul>
<#if article.commentable> <#if article.commentable>
<header class='title'><h2>${postCommentsLabel}</h2></header> <div class="comments__item">
<div class="comments__meta">
${postCommentsLabel}
</div>
<div class="comments__content">
<table id="commentForm" class="form"> <table id="commentForm" class="form">
<tbody> <tbody>
<#if !isLoggedIn> <#if !isLoggedIn>
<tr> <tr>
<td> <td>
<input placeholder="${commentNameLabel}" type="text" class="normalInput" id="commentName"/> <input placeholder="${commentNameLabel}" type="text" id="commentName"/>
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
<input placeholder="${commentEmailLabel}" type="email" class="normalInput" id="commentEmail"/> <input placeholder="${commentEmailLabel}" type="email" id="commentEmail"/>
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
<input placeholder="${commentURLLabel}" type="url" id="commentURL"/> <input placeholder="${commentURLLabel}" type="url" id="commentURL"/>
</td> </td>
</tr> </tr>
</#if> </#if>
<tr> <tr>
<td id="emotions" class="emotions"> <td id="emotions" class="emotions">
<span class="em00" title="${em00Label}"></span> <span class="em00" title="${em00Label}"></span>
<span class="em01" title="${em01Label}"></span> <span class="em01" title="${em01Label}"></span>
<span class="em02" title="${em02Label}"></span> <span class="em02" title="${em02Label}"></span>
<span class="em03" title="${em03Label}"></span> <span class="em03" title="${em03Label}"></span>
<span class="em04" title="${em04Label}"></span> <span class="em04" title="${em04Label}"></span>
<span class="em05" title="${em05Label}"></span> <span class="em05" title="${em05Label}"></span>
<span class="em06" title="${em06Label}"></span> <span class="em06" title="${em06Label}"></span>
<span class="em07" title="${em07Label}"></span> <span class="em07" title="${em07Label}"></span>
<span class="em08" title="${em08Label}"></span> <span class="em08" title="${em08Label}"></span>
<span class="em09" title="${em09Label}"></span> <span class="em09" title="${em09Label}"></span>
<span class="em10" title="${em10Label}"></span> <span class="em10" title="${em10Label}"></span>
<span class="em11" title="${em11Label}"></span> <span class="em11" title="${em11Label}"></span>
<span class="em12" title="${em12Label}"></span> <span class="em12" title="${em12Label}"></span>
<span class="em13" title="${em13Label}"></span> <span class="em13" title="${em13Label}"></span>
<span class="em14" title="${em14Label}"></span> <span class="em14" title="${em14Label}"></span>
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
<textarea rows="5" cols="96" id="comment"></textarea> <textarea rows="5" cols="96" id="comment"></textarea>
</td> </td>
</tr> </tr>
<#if !isLoggedIn> <#if !isLoggedIn>
<tr> <tr>
<td> <td>
<input style="width:50%" placeholder="${captchaLabel}" type="text" class="normalInput" id="commentValidate"/> <input style="width:50%" placeholder="${captchaLabel}" type="text"
<img class="captcha" id="captcha" alt="validate" src="${servePath}/captcha.do" /> id="commentValidate"/>
</td> <img class="comments__captcha" id="captcha" alt="validate" src="${servePath}/captcha.do"/>
</tr> </td>
</#if> </tr>
<tr> </#if>
<td colspan="2" align="right"> <tr>
<span class="error-msg" id="commentErrorTip"></span> <td colspan="2" align="right">
<button id="submitCommentButton" onclick="page.submitComment();">${submmitCommentLabel}</button> <span class="ft__red" id="commentErrorTip"></span>
</td> <button class="btn tag" id="submitCommentButton" onclick="page.submitComment();">${submmitCommentLabel}</button>
</tr> </td>
</tr>
</tbody> </tbody>
</table> </table>
</div>
</div>
</#if> </#if>
</#macro> </#macro>
<#macro comment_script oId> <#macro comment_script oId>
<script type="text/javascript" src="${staticServePath}/js/page${miniPostfix}.js?${staticResourceVersion}" charset="utf-8"></script> <script type="text/javascript" src="${staticServePath}/js/page${miniPostfix}.js?${staticResourceVersion}"
charset="utf-8"></script>
<script type="text/javascript"> <script type="text/javascript">
var page = new Page({ var page = new Page({
"nameTooLongLabel": "${nameTooLongLabel}", 'nameTooLongLabel': "${nameTooLongLabel}",
"mailCannotEmptyLabel": "${mailCannotEmptyLabel}", 'mailCannotEmptyLabel': "${mailCannotEmptyLabel}",
"mailInvalidLabel": "${mailInvalidLabel}", 'mailInvalidLabel': "${mailInvalidLabel}",
"commentContentCannotEmptyLabel": "${commentContentCannotEmptyLabel}", 'commentContentCannotEmptyLabel': "${commentContentCannotEmptyLabel}",
"captchaCannotEmptyLabel": "${captchaCannotEmptyLabel}", 'captchaCannotEmptyLabel': "${captchaCannotEmptyLabel}",
"loadingLabel": "${loadingLabel}", 'loadingLabel': "${loadingLabel}",
"oId": "${oId}", 'oId': "${oId}",
"skinDirName": "${skinDirName}", 'skinDirName': "${skinDirName}",
"blogHost": "${blogHost}", 'blogHost': "${blogHost}",
"randomArticles1Label": "${randomArticles1Label}", 'randomArticles1Label': "${randomArticles1Label}",
"externalRelevantArticles1Label": "${externalRelevantArticles1Label}" 'externalRelevantArticles1Label': "${externalRelevantArticles1Label}",
}); })
var replyTo = function (id) { var replyTo = function (id) {
var commentFormHTML = "<table class='form comment-reply' id='replyForm'>"; var commentFormHTML = '<table class=\'form comments__reply comments__content\' id=\'replyForm\'>'
page.addReplyForm(id, commentFormHTML); page.addReplyForm(id, commentFormHTML)
}; };
(function () { (function () {
page.load(); page.load()
Skin.initArticle("${tocLabel}", "${siteViewLabel}"); Skin.initArticle("${tocLabel}", "${siteViewLabel}")
// emotions // emotions
page.replaceCommentsEm("#comments .content-reset"); page.replaceCommentsEm('#comments .content-reset')
<#nested> <#nested>
})(); })()
</script> </script>
</#macro> </#macro>

View File

@ -21,28 +21,28 @@
<#include "macro-comments.ftl"> <#include "macro-comments.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${page.pageTitle} - ${blogTitle}"> <@head title="${page.pageTitle} - ${blogTitle}">
<meta name="keywords" content="${metaKeywords},${page.pageTitle}" /> <meta name="keywords" content="${metaKeywords},${page.pageTitle}"/>
<meta name="description" content="${metaDescription}" /> <meta name="description" content="${metaDescription}"/>
</@head> </@head>
</head> </head>
<body> <body>
<#include "header.ftl"> <#include "header.ftl">
<div class="wrapper"> <div class="main">
<div class="main-wrap"> <main class="content">
<main> <article class="module">
<article class="post"> <div class="module__content">
<div class="content-reset"> <div class="content-reset">
${page.pageContent} ${page.pageContent}
</div> </div>
<@comments commentList=pageComments article=page></@comments>
</article>
</main>
<#include "side.ftl">
</div> </div>
</div> </article>
<#include "footer.ftl"> <@comments commentList=pageComments article=page></@comments>
<@comment_script oId=page.oId></@comment_script> </main>
</body> <#include "side.ftl">
</div>
<#include "footer.ftl">
<@comment_script oId=page.oId></@comment_script>
</body>
</html> </html>

View File

@ -20,27 +20,32 @@
<#include "macro-head.ftl"> <#include "macro-head.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${tag.tagTitle} - ${blogTitle}"> <@head title="${tag.tagTitle} - ${blogTitle}">
<meta name="keywords" content="${metaKeywords},${tag.tagTitle}"/> <meta name="keywords" content="${metaKeywords},${tag.tagTitle}"/>
<meta name="description" content="<#list articles as article>${article.articleTitle}<#if article_has_next>,</#if></#list>"/> <meta name="description"
</@head> content="<#list articles as article>${article.articleTitle}<#if article_has_next>,</#if></#list>"/>
</head> </@head>
<body> </head>
<#include "header.ftl"> <body>
<div class="wrapper"> <#include "header.ftl">
<div class="main-wrap"> <div class="main">
<main> <main class="content">
<div class="title"> <div class="module">
<h2 class="tip"><i class="icon-tags"></i> <div class="module__content ft__center">
&nbsp;${tag.tagTitle} <i class="icon__home"></i>
<small>${tagLabel}</small> <a href="${servePath}" class="breadcrumb">${blogTitle}</a>
</div> &nbsp; > &nbsp;
<#include "article-list.ftl"> <i class="icon__tags"></i>
</main> <a href="${servePath}/tags.html" class="breadcrumb">${allTagsLabel}</a>
<#include "side.ftl"> &nbsp; > &nbsp;
${tag.tagTitle} ${tagLabel}
</div> </div>
</div> </div>
<#include "footer.ftl"> <#include "article-list.ftl">
</body> </main>
<#include "side.ftl">
</div>
<#include "footer.ftl">
</body>
</html> </html>

View File

@ -20,45 +20,51 @@
<#include "macro-head.ftl"> <#include "macro-head.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${allTagsLabel} - ${blogTitle}"> <@head title="${allTagsLabel} - ${blogTitle}">
<meta name="keywords" content="${metaKeywords},${allTagsLabel}"/> <meta name="keywords" content="${metaKeywords},${allTagsLabel}"/>
<meta name="description" content="<#list tags as tag>${tag.tagTitle}<#if tag_has_next>,</#if></#list>"/> <meta name="description" content="<#list tags as tag>${tag.tagTitle}<#if tag_has_next>,</#if></#list>"/>
</@head> </@head>
</head> </head>
<body> <body>
<#include "header.ftl"> <#include "header.ftl">
<div class="wrapper"> <div class="main">
<div class="main-wrap"> <main class="content">
<main class="other"> <div class="module">
<div class="title"> <div class="module__content ft__center">
<h2><i class="icon-tags"></i> <i class="icon__home"></i>
&nbsp; ${sumLabel} ${tags?size} ${tagLabel} <a href="${servePath}" class="breadcrumb">${blogTitle}</a>
</div> &nbsp; > &nbsp;
<div class="tags"> <i class="icon__tags"></i> ${sumLabel} ${tags?size} ${tagLabel}
<#list tags as tag>
<a rel="tag" data-count="${tag.tagPublishedRefCount}" class="tag"
href="${servePath}/tags/${tag.tagTitle?url('UTF-8')}">
<span>${tag.tagTitle}</span>
(<b>${tag.tagPublishedRefCount}</b>)
</a>
</#list>
</div>
</main>
<#include "side.ftl">
</div> </div>
</div> </div>
<#include "footer.ftl">
<script type="text/javascript" src="${staticServePath}/skins/${skinDirName}/js/isotope.pkgd.min.js" charset="utf-8"></script> <div class="module">
<script> <div class="module__content fn__clear tags">
$('.tags').isotope({ <#list tags as tag>
transitionDuration: '1.5s', <a rel="tag" data-count="${tag.tagPublishedRefCount}" class="tag"
filter: 'a', href="${servePath}/tags/${tag.tagTitle?url('UTF-8')}">
layoutMode: 'fitRows' <span>${tag.tagTitle}</span>
}); (<b>${tag.tagPublishedRefCount}</b>)
$('.tags').isotope({ </a>
sortBy: 'random' </#list>
}); </div>
</script> </div>
</body> </main>
<#include "side.ftl">
</div>
<#include "footer.ftl">
<script type="text/javascript" src="${staticServePath}/skins/${skinDirName}/js/isotope.pkgd.min.js"
charset="utf-8"></script>
<script>
$('.tags').isotope({
transitionDuration: '1.5s',
filter: 'a',
layoutMode: 'fitRows',
})
$('.tags').isotope({
sortBy: 'random',
})
</script>
</body>
</html> </html>