Skip to content

S
solo-1
Commit 59293df7 authored by Vanessa's avatar Vanessa
Browse files
Options

💄 #12389 pages

parent 25395007
Show whitespace changes
Inline Side-by-side
Showing with 357 additions and 290 deletions
src/main/webapp/skins/Medium/archive-articles.ftl
View file @ 59293df7
<#include "macro-head.ftl"> <#include "macro-head.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${archiveDate.archiveDateMonth} ${archiveDate.archiveDateYear} (${archiveDate.archiveDatePublishedArticleCount}) - ${blogTitle}"> <@head title="${archiveDate.archiveDateMonth} ${archiveDate.archiveDateYear} (${archiveDate.archiveDatePublishedArticleCount}) - ${blogTitle}">
<meta name="keywords" content="${metaKeywords},${archiveDate.archiveDateYear}${archiveDate.archiveDateMonth}"/> <meta name="keywords" content="${metaKeywords},${archiveDate.archiveDateYear}${archiveDate.archiveDateMonth}"/>
<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"> <#include "nav.ftl">
<main> <div class="main">
<div class="title"> <#if noticeBoard??>
<h2 class="tip"> <div class="board">
<i class="icon-inbox"></i> ${noticeBoard}
&nbsp; </div>
</#if>
<div class="wrapper content">
<div class="module__title">
<span>
<#if "en" == localeString?substring(0, 2)> <#if "en" == localeString?substring(0, 2)>
${archiveDate.archiveDateMonth} ${archiveDate.archiveDateYear} ${archiveDate.archiveDateMonth} ${archiveDate.archiveDateYear}
<#else> <#else>
${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel} ${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}
</#if> </#if>
- ${archiveDate.archiveDatePublishedArticleCount} ${articleLabel} <span class="ft-green">
</h2> ${archiveDate.archiveDatePublishedArticleCount}
<span class="ft-12">${cntArticleLabel}</span>
</span>
</span>
</div> </div>
<#include "article-list.ftl"> <#include "article-list.ftl">
</main>
<#include "side.ftl">
</div>
</div> </div>
<#include "footer.ftl"> <#include "bottom2.ftl">
</body> </div>
<#include "footer.ftl">
</body>
</html> </html>
src/main/webapp/skins/Medium/archives.ftl
View file @ 59293df7
<#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"> <#include "nav.ftl">
<div class="main-wrap"> <div class="main">
<main class="other"> <#if noticeBoard??>
<span class="title"> <div class="board">
<h2><i class="icon-inbox"></i> ${noticeBoard}
&nbsp;${statistic.statisticPublishedBlogArticleCount} ${articleLabel}</h2> </div>
</#if>
<div class="wrapper content">
<div class="module__title">
<span>
${archiveDates?size}
<span class="ft-green ft-12">${cntMonthLabel}</span>
${statistic.statisticPublishedBlogArticleCount}
<span class="ft-green ft-12">${cntArticleLabel}</span>
</span> </span>
</div>
<#if 0 != archiveDates?size> <#if 0 != archiveDates?size>
<ul class="list">
<#list archiveDates as archiveDate> <#list archiveDates as archiveDate>
<li> <div class="page__item">
<h3>
<a class="ft-gray"
href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
<#if "en" == localeString?substring(0, 2)> <#if "en" == localeString?substring(0, 2)>
<a class="post-title" href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}"> ${archiveDate.monthName} ${archiveDate.archiveDateYear}
${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount})
</a>
<#else> <#else>
<a class="post-title" href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}"> ${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}
${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount})
</a>
</#if> </#if>
</li> <span class="ft-green">
${archiveDate.archiveDatePublishedArticleCount}
<span class="ft-12">${cntArticleLabel}</span>
</span>
</a>
</h3>
</div>
</#list> </#list>
</ul>
</#if> </#if>
</main>
<#include "side.ftl">
</div>
</div> </div>
<#include "footer.ftl"> <#include "bottom.ftl">
</body> </div>
<#include "footer.ftl">
</body>
</html> </html>
src/main/webapp/skins/Medium/article.ftl
View file @ 59293df7
...@@ -121,13 +121,47 @@ ...@@ -121,13 +121,47 @@
</div> </div>
<div class="article__toolbar"> <div class="article__toolbar">
<#if nextArticlePermalink??> <div class="wrapper">
<a href="${servePath}${nextArticlePermalink}" rel="next" <a class="post__view" href="${servePath}${article.articlePermalink}">
class="fn-right tooltipped tooltipped-n" ${article.articleViewCount} ${viewLabel}
aria-label="${nextArticleTitle}">
nextArticleLabel
</a> </a>
</#if> <div class="fn-right">
<span class="pipe-tooltipped pipe-tooltipped--n post__share-icon ft-green"
onclick="$('#comment').focus()"
aria-label="${commentLabel}">
<svg>
<use xlink:href="#icon-comment"></use>
</svg>
${article.articleCommentCount} &nbsp; &nbsp;
</span>
<span id="articleBottomShare">
<span class="post__share-icon" data-type="wechat">
<svg><use xlink:href="#icon-wechat"></use></svg>
</span> &nbsp; &nbsp;
<span class="post__share-icon" data-type="weibo">
<svg><use xlink:href="#icon-weibo"></use></svg>
</span> &nbsp; &nbsp;
<span class="post__share-icon" data-type="twitter">
<svg><use xlink:href="#icon-twitter"></use></svg>
</span> &nbsp; &nbsp;
<span class="post__share-icon" data-type="google">
<svg><use xlink:href="#icon-google"></use></svg>
</span>
<span class="article__code"
data-title="${article.articleTitle}"
data-blogtitle="${blogTitle}"
data-url="${servePath}${article.articlePermalink}"
data-avatar="${article.authorThumbnailURL}"></span>
</span>
<#if nextArticlePermalink??>
<a href="${servePath}${nextArticlePermalink}" rel="next" class="article__next">
<span class="ft-12 ft-gray">${nextArticleLabel}</span> <br>
${nextArticleTitle}
</a>
</#if>
</div>
</div>
</div> </div>
<div class="post__side"> <div class="post__side">
......
src/main/webapp/skins/Medium/bottom.ftl
View file @ 59293df7
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<#list mostUsedCategories as category> <#list mostUsedCategories as category>
<a class="tag pipe-tooltipped pipe-tooltipped--n" <a class="tag pipe-tooltipped pipe-tooltipped--n"
aria-label="${category.categoryTagCnt} ${cntLabel}${tagsLabel}" aria-label="${category.categoryTagCnt} ${cntLabel}${tagsLabel}"
href="${servePath}/tags/${category.categoryURI}">${category.categoryTitle}</a> href="${servePath}/category/${category.categoryURI}">${category.categoryTitle}</a>
</#list> </#list>
</div> </div>
</div> </div>
......
src/main/webapp/skins/Medium/bottom2.ftl
View file @ 59293df7
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<#list mostUsedCategories as category> <#list mostUsedCategories as category>
<a class="tag pipe-tooltipped pipe-tooltipped--n" <a class="tag pipe-tooltipped pipe-tooltipped--n"
aria-label="${category.categoryTagCnt} ${cntLabel}${tagsLabel}" aria-label="${category.categoryTagCnt} ${cntLabel}${tagsLabel}"
href="${servePath}/tags/${category.categoryURI}">${category.categoryTitle}</a> href="${servePath}/category/${category.categoryURI}">${category.categoryTitle}</a>
</#list> </#list>
</#if> </#if>
<#if 0 != mostUsedTags?size> <#if 0 != mostUsedTags?size>
......
src/main/webapp/skins/Medium/category-articles.ftl
View file @ 59293df7
<#include "macro-head.ftl"> <#include "macro-head.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${category.categoryTitle} - ${blogTitle}"> <@head title="${category.categoryTitle} - ${blogTitle}">
<meta name="keywords" content="${metaKeywords},${category.categoryTitle}"/> <meta name="keywords" content="${metaKeywords},${category.categoryTitle}"/>
<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"> <#include "nav.ftl">
<main> <div class="main">
<div class="title"> <#if noticeBoard??>
<h2 class="tip"><i class="icon-category"></i> <div class="board">
&nbsp;${category.categoryTitle} ${noticeBoard}
<small>${category.categoryDescription}</small>
</h2>
</div> </div>
<#include "article-list.ftl"> </#if>
</main> <div class="wrapper content">
<#include "side.ftl"> <div class="module__title">
<span>
${category.categoryTitle}
<span class="ft-green ft-12">
${category.categoryDescription}
</span>
</span>
</div> </div>
<#include "article-list.ftl">
</div> </div>
<#include "footer.ftl"> <#include "bottom2.ftl">
</body> </div>
<#include "footer.ftl">
</body>
</html> </html>
src/main/webapp/skins/Medium/css/base.css
View file @ 59293df7
...@@ -187,10 +187,6 @@ blockquote { ...@@ -187,10 +187,6 @@ blockquote {
word-break: break-all word-break: break-all
} }
.content-reset a {
color: #ff4d3a;
}
.content-reset ul, .content-reset ul,
.content-reset ol { .content-reset ol {
padding-left: 2em; padding-left: 2em;
...@@ -365,6 +361,7 @@ blockquote { ...@@ -365,6 +361,7 @@ blockquote {
.ft-12 { .ft-12 {
font-size: 12px; font-size: 12px;
font-weight: normal;
} }
.ft-gray { .ft-gray {
...@@ -723,7 +720,7 @@ blockquote { ...@@ -723,7 +720,7 @@ blockquote {
} }
.header__nav--fixed { .header__nav--fixed {
z-index: 10; z-index: 11;
position: fixed; position: fixed;
width: 100%; width: 100%;
top: 0; top: 0;
...@@ -1066,6 +1063,7 @@ blockquote { ...@@ -1066,6 +1063,7 @@ blockquote {
float: left; float: left;
height: 24px; height: 24px;
margin-right: 10px; margin-right: 10px;
margin-bottom: 5px;
width: 24px; width: 24px;
transition: all .2s ease-out; transition: all .2s ease-out;
-webkit-transition: all .2s ease-out; -webkit-transition: all .2s ease-out;
...@@ -1139,6 +1137,10 @@ blockquote { ...@@ -1139,6 +1137,10 @@ blockquote {
width: 100%; width: 100%;
} }
#replyForm {
margin-top: 20px;
}
.comment__textarea { .comment__textarea {
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
box-shadow: rgba(0, 0, 0, 0.04) 0px 1px 4px; box-shadow: rgba(0, 0, 0, 0.04) 0px 1px 4px;
...@@ -1167,27 +1169,6 @@ blockquote { ...@@ -1167,27 +1169,6 @@ blockquote {
color: #018f69; color: #018f69;
} }
.article__next {
border-left: 1px solid rgba(0, 0, 0, 0.38);
line-height: 14px;
margin-top: 7px;
color: rgba(0, 0, 0, 0.84);
font-size: 18px;
display: inline-block;
padding-left: 20px;
margin-left: 20px;
float: right
}
.article__next:hover {
text-decoration: none
}
.article__toolbar { .article__toolbar {
box-shadow: 0 0 1px rgba(0, 0, 0, 0.54); box-shadow: 0 0 1px rgba(0, 0, 0, 0.54);
position: fixed; position: fixed;
...@@ -1225,6 +1206,24 @@ blockquote { ...@@ -1225,6 +1206,24 @@ blockquote {
bottom: 30px bottom: 30px
} }
.article__next {
border-left: 1px solid rgba(0, 0, 0, 0.38);
line-height: 14px;
margin-top: 7px;
color: rgba(0, 0, 0, 0.84);
font-size: 18px;
display: inline-block;
padding-left: 20px;
margin-left: 20px;
transition: all .2s;
float: right;
}
.article__next:hover {
text-decoration: none;
color: rgba(0, 0, 0, 0.54);
}
.pagination { .pagination {
margin-top: 30px; margin-top: 30px;
font-size: 16px; font-size: 16px;
...@@ -1275,3 +1274,9 @@ blockquote { ...@@ -1275,3 +1274,9 @@ blockquote {
padding: 0; padding: 0;
color: #ccc color: #ccc
} }
.page__item {
display: block;
border-bottom: 1px solid rgba(0,0,0,0.05);
padding: 40px 0 35px
}
src/main/webapp/skins/Medium/lang/lang_en_US.properties
View file @ 59293df7
...@@ -22,3 +22,7 @@ ...@@ -22,3 +22,7 @@
reply1Label=Reply reply1Label=Reply
cntLabel= cntLabel=
nextArticleLabel=Next Article
onlineVisitorLabel=Online
cntMonthLabel=Month
cntArticleLabel=Article
\ No newline at end of file
src/main/webapp/skins/Medium/lang/lang_zh_CN.properties
View file @ 59293df7
...@@ -22,3 +22,7 @@ ...@@ -22,3 +22,7 @@
cntLabel=\u4E2A cntLabel=\u4E2A
reply1Label=\u56DE\u590D reply1Label=\u56DE\u590D
nextArticleLabel=\u4E0B\u4E00\u7BC7
onlineVisitorLabel=\u5F53\u524D\u8BBF\u5BA2
cntMonthLabel=\u4E2A\u6708
cntArticleLabel=\u7BC7\u6587\u7AE0
\ No newline at end of file
src/main/webapp/skins/Medium/links.ftl
View file @ 59293df7
<#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"> <#include "nav.ftl">
<div class="main-wrap"> <div class="main">
<main class="other"> <#if noticeBoard??>
<div class="title"> <div class="board">
<h2><i class="icon-link"></i> ${noticeBoard}
&nbsp;${linkLabel}</h2> </div>
</#if>
<div class="wrapper content">
<div class="module__title">
<span>
${links?size}
<span class="ft-green ft-12">${linkLabel}</span>
</span>
</div> </div>
<#if 0 != links?size> <#if 0 != links?size>
<ul class="list">
<#list links as link> <#list links as link>
<li> <div class="page__item">
<a rel="friend" href="${link.linkAddress}" title="${link.linkDescription}" target="_blank"> <h3>
<a rel="friend" class="ft-gray" href="${link.linkAddress}" target="_blank">
${link.linkTitle} ${link.linkTitle}
<span class="ft-12 ft-green">${link.linkDescription}</span>
</a> </a>
</li> </h3>
</div>
</#list> </#list>
</ul>
</#if> </#if>
</main>
<#include "side.ftl">
</div>
</div> </div>
<#include "footer.ftl"> <#include "bottom.ftl">
</body> </div>
<#include "footer.ftl">
</body>
</html> </html>
src/main/webapp/skins/Medium/nav.ftl
View file @ 59293df7
...@@ -6,12 +6,6 @@ ...@@ -6,12 +6,6 @@
</svg> </svg>
${indexLabel} ${indexLabel}
</a> </a>
<a href="http://localhost:5897/blogs/Vanessa/categories">
<svg>
<use xlink:href="#icon-folders"></use>
</svg>
${categoryLabel}
</a>
<a href="${servePath}/tags.html" rel="section"> <a href="${servePath}/tags.html" rel="section">
<svg> <svg>
<use xlink:href="#icon-tag"></use> <use xlink:href="#icon-tag"></use>
......
src/main/webapp/skins/Medium/page.ftl
View file @ 59293df7
...@@ -2,28 +2,32 @@ ...@@ -2,28 +2,32 @@
<#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"> <#include "nav.ftl">
<div class="main-wrap"> <div class="main">
<main> <#if noticeBoard??>
<div class="board">
${noticeBoard}
</div>
</#if>
<div class="wrapper content">
<article class="post"> <article class="post">
<div class="content-reset"> <div class="content-reset">
${page.pageContent} ${page.pageContent}
</div> </div>
<@comments commentList=pageComments article=page></@comments> <@comments commentList=pageComments article=page></@comments>
</article> </article>
</main>
<#include "side.ftl">
</div>
</div> </div>
<#include "footer.ftl"> <#include "bottom.ftl">
<@comment_script oId=page.oId></@comment_script> </div>
</body> <#include "footer.ftl">
<@comment_script oId=page.oId></@comment_script>
</body>
</html> </html>
src/main/webapp/skins/Medium/side.ftl deleted 100644 → 0
View file @ 25395007
<#if 0 != mostCommentArticles?size>
<div class="module">
<header><h2>${mostCommentArticlesLabel}</h2></header>
<main class="list">
<ul>
<#list mostCommentArticles as article>
<li>
<a rel="nofollow" aria-label="${article.articleCommentCount} ${commentLabel}"
class="tooltipped tooltipped-e"
href="${servePath}${article.articlePermalink}">
${article.articleTitle}
</a>
</li>
</#list>
</ul>
</main>
</div>
</#if>
<#if 0 != mostViewCountArticles?size>
<div class="module">
<header><h2>${mostViewCountArticlesLabel}</h2></header>
<main class="list">
<ul>
<#list mostViewCountArticles as article>
<li>
<a rel="nofollow" aria-label="${article.articleCommentCount} ${commentLabel}"
class="tooltipped tooltipped-e"
href="${servePath}${article.articlePermalink}">
${article.articleTitle}
</a>
</li>
</#list>
</ul>
</main>
</div>
</#if>
\ No newline at end of file
src/main/webapp/skins/Medium/tag-articles.ftl
View file @ 59293df7
<#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"> <#include "nav.ftl">
<main> <div class="main">
<div class="title"> <#if noticeBoard??>
<h2 class="tip"><i class="icon-tags"></i> <div class="board">
&nbsp;${tag.tagTitle} ${noticeBoard}
<small>${tagLabel}</small>
</div> </div>
<#include "article-list.ftl"> </#if>
</main> <div class="wrapper content">
<#include "side.ftl"> <div class="module__title">
<span>
${tag.tagTitle}
<span class="ft-green">
${tag.tagPublishedRefCount}
<span class="ft-12">${tagLabel}</span>
</span>
</span>
</div> </div>
<#include "article-list.ftl">
</div> </div>
<#include "footer.ftl"> <#include "bottom2.ftl">
</body> </div>
<#include "footer.ftl">
</body>
</html> </html>
src/main/webapp/skins/Medium/tags.ftl
View file @ 59293df7
<#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"> <#include "nav.ftl">
<div class="main-wrap"> <div class="main">
<main class="other"> <#if noticeBoard??>
<div class="title"> <div class="board">
<h2><i class="icon-tags"></i> ${noticeBoard}
&nbsp; ${sumLabel} ${tags?size} ${tagLabel}
</div> </div>
<div class="tags"> </#if>
<div class="wrapper content">
<div class="module__title">
<span>
${tags?size}
<span class="ft-green ft-12">${tagLabel}</span>
</span>
</div>
<div id="tags">
<#list tags as tag> <#list tags as tag>
<a rel="tag" data-count="${tag.tagPublishedRefCount}" class="tag" <a rel="tag" data-count="${tag.tagPublishedRefCount}" class="tag"
href="${servePath}/tags/${tag.tagTitle?url('UTF-8')}"> href="${servePath}/tags/${tag.tagTitle?url('UTF-8')}">
<span>${tag.tagTitle}</span> ${tag.tagTitle}
(<b>${tag.tagPublishedRefCount}</b>) <span class="ft-green ft-12">${tag.tagPublishedRefCount} ${countLabel}</span>
</a> </a>
</#list> </#list>
</div> </div>
</main>
<#include "side.ftl">
</div>
</div> </div>
<#include "footer.ftl"> <#include "bottom.ftl">
<script type="text/javascript" src="${staticServePath}/skins/${skinDirName}/js/isotope.pkgd.min.js" charset="utf-8"></script> </div>
<script> <#include "footer.ftl">
$('.tags').isotope({ <script>
transitionDuration: '1.5s', (function () {
filter: 'a', var $tags = $('#tags');
layoutMode: 'fitRows' var tagsArray = $tags.find('.tag')
}); // 根据引用次数添加样式，产生云效果
$('.tags').isotope({ var max = parseInt(tagsArray.first().data('count'));
sortBy: 'random' var distance = Math.ceil(max / 5);
}); for (var i = 0; i < tagsArray.length; i++) {
</script> var count = parseInt($(tagsArray[i]).data('count'));
</body> // 算出当前 tag 数目所在的区间，加上 class
for (var j = 0; j < 5; j++) {
if (count > j * distance && count <= (j + 1) * distance) {
tagsArray[i].className = 'tag tag__level' + j;
break;
}
}
}
// 按字母或者中文拼音进行排序
$tags.html(tagsArray.get().sort(function (a, b) {
var valA = $(a).text().toLowerCase();
var valB = $(b).text().toLowerCase();
// 对中英文排序的处理
return valA.localeCompare(valB);
}));
})();
</script>
</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