yexuejc/solo-skins
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

https://github.com/b3log/solo/issues/12720 timeline

Browse Source
This commit is contained in:
Van 2019-03-22 18:53:35 +08:00
parent 3ca8f083f2
commit 60a8e6df33
No known key found for this signature in database
GPG Key ID: 7059B8783A78F16C
7 changed files with 636 additions and 575 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
metro-hot/macro-side.ftl
View File

@ -47,6 +47,12 @@
</div> </div>
</#if> </#if>
<#if article?? && article.articleToC?? && article.articleToC?size &gt; 0>
<div class="vditor-reset" style="margin-top: 20px">
<#include "../../common-template/toc.ftl"/>
</div>
</#if>
<a rel="alternate" href="${servePath}/rss.xml" class="atom side-tile"> <a rel="alternate" href="${servePath}/rss.xml" class="atom side-tile">
<span data-ico="&#xe135;"></span> <span data-ico="&#xe135;"></span>
<div class="title"> <div class="title">

30
timeline/article.ftl
View File

@ -22,7 +22,7 @@
<#include "../../common-template/macro-comment_script.ftl"> <#include "../../common-template/macro-comment_script.ftl">
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${article.articleTitle} - ${blogTitle}" description="${article.articleAbstract?html}"> <@head title="${article.articleTitle} - ${blogTitle}" description="${article.articleAbstract?html}">
<link rel="stylesheet" <link rel="stylesheet"
href="${staticServePath}/skins/${skinDirName}/css/base.css?${staticResourceVersion}"/> href="${staticServePath}/skins/${skinDirName}/css/base.css?${staticResourceVersion}"/>
@ -33,12 +33,14 @@
<link rel="next" title="${nextArticleTitle}" href="${servePath}${nextArticlePermalink}"> <link rel="next" title="${nextArticleTitle}" href="${servePath}${nextArticlePermalink}">
</#if> </#if>
</@head> </@head>
</head> </head>
<body> <body>
${topBarReplacement} ${topBarReplacement}
<#include "header.ftl"> <#include "header.ftl">
<div class="wrapper"> <div class="wrapper">
<div class="container"> <div class="container">
<div class="fn-clear">
<div<#if article?? && article.articleToC?? && article.articleToC?size &gt; 0> class="dynamic-l"</#if>>
<div class="module"> <div class="module">
<article class="article"> <article class="article">
<time class="article-time"> <time class="article-time">
@ -74,7 +76,11 @@
</p> </p>
</#if> </#if>
<span class="ico-tags ico" title="${tagLabel}"> <span class="ico-tags ico" title="${tagLabel}">
<#list article.articleTags?split(",") as articleTag><a rel="tag" href="${servePath}/tags/${articleTag?url('UTF-8')}">${articleTag}</a><#if articleTag_has_next>,</#if></#list> <#list article.articleTags?split(",") as articleTag>
<a rel="tag"
href="${servePath}/tags/${articleTag?url('UTF-8')}">${articleTag}</a>
<#if articleTag_has_next>,</#if>
</#list>
</span> </span>
<span class="ico-author ico" title="${authorLabel}"> <span class="ico-author ico" title="${authorLabel}">
<a rel="author" href="${servePath}/authors/${article.authorId}">${article.authorName}</a> <a rel="author" href="${servePath}/authors/${article.authorId}">${article.authorName}</a>
@ -125,7 +131,17 @@
<@comments commentList=articleComments article=article></@comments> <@comments commentList=articleComments article=article></@comments>
</div> </div>
</div> </div>
<#if article?? && article.articleToC?? && article.articleToC?size &gt; 0>
<div class="dynamic-r">
<div class="module">
<h3 class="title">${tocLabel}</h3>
<#include "../../common-template/toc.ftl"/>
</div> </div>
</div>
</#if>
</div>
</div>
</div>
<#include "footer.ftl"> <#include "footer.ftl">
<@comment_script oId=article.oId commentable=article.commentable> <@comment_script oId=article.oId commentable=article.commentable>
page.tips.externalRelevantArticlesDisplayCount = "${externalRelevantArticlesDisplayCount}"; page.tips.externalRelevantArticlesDisplayCount = "${externalRelevantArticlesDisplayCount}";
@ -139,5 +155,5 @@
page.loadRelevantArticles('${article.oId}', '<h4>${relevantArticles1Label}</h4>'); page.loadRelevantArticles('${article.oId}', '<h4>${relevantArticles1Label}</h4>');
</#if> </#if>
</@comment_script> </@comment_script>
</body> </body>
</html> </html>

2
timeline/css/base.css
View File

File diff suppressed because one or more lines are too long

60
timeline/css/base.scss
View File

@ -19,10 +19,31 @@
* timeline skin style. * timeline skin style.
* *
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a> * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 2.0.0.1, Mar 16, 2019 * @version 2.1.0.0, Mar 22, 2019
*/ */
@import "../../../scss/usite";
@import "../../../scss/toc";
@import "vditor/src/assets/scss/classic"; @import "vditor/src/assets/scss/classic";
.article__toc {
padding-left: 0;
}
.user__site {
display: inline-block;
height: 14px;
margin: 0 5px 0 0;
&:hover {
text-decoration: none;
color: #363A3D;
}
svg {
height: 14px;
width: 14px;
fill: currentColor;
}
}
/* start reset */ /* start reset */
html, body { html, body {
-webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
@ -46,7 +67,7 @@ textarea {
margin: 0; margin: 0;
font-size: 100%; font-size: 100%;
vertical-align: middle; vertical-align: middle;
font-family: Verdana, arial,'\5fae\8f6f\96c5\9ed1'; font-family: Verdana, arial, '\5fae\8f6f\96c5\9ed1';
outline: none; outline: none;
} }
@ -76,6 +97,7 @@ img {
background-color: #D5D5D5; background-color: #D5D5D5;
color: #FCFCFC; color: #FCFCFC;
} }
/* end reset */ /* end reset */
/* start function */ /* start function */
@ -111,6 +133,7 @@ img {
.fn-clear:after { .fn-clear:after {
clear: both; clear: both;
} }
/* end function */ /* end function */
.tags { .tags {
margin: 0; margin: 0;
@ -131,7 +154,6 @@ img {
} }
.tags a:hover { .tags a:hover {
text-shadow: 0 0 2px;
text-decoration: none; text-decoration: none;
box-shadow: 0 0 4px #D5D5D5; box-shadow: 0 0 4px #D5D5D5;
} }
@ -190,10 +212,12 @@ img {
overflow: hidden; overflow: hidden;
} }
.module > ul.list > li { .module > ul.list > li,
.article__toc li {
border-top: 1px solid #EEEEEE; border-top: 1px solid #EEEEEE;
padding: 6px 0; padding: 6px 0;
} }
/* end common */ /* end common */
/* start icon */ /* start icon */
@ -268,7 +292,7 @@ img {
background-color: #363A3D; background-color: #363A3D;
background-position: 4px -100px; background-position: 4px -100px;
border-radius: 20em 20em 20em 20em; border-radius: 20em 20em 20em 20em;
bottom: 60px; bottom: 65px;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, 0.15); box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, 0.15);
height: 25px; height: 25px;
position: fixed; position: fixed;
@ -284,7 +308,7 @@ img {
color: #FFFFFF; color: #FFFFFF;
display: block; display: block;
float: left; float: left;
font: 20px/100% "Times New Roman",Times,serif; font: 20px/100% "Times New Roman", Times, serif;
height: 28px; height: 28px;
margin: -8px 10px 0 0; margin: -8px 10px 0 0;
padding: 4px 0 0; padding: 4px 0 0;
@ -302,6 +326,7 @@ a:hover > .ico-next,
a:hover > .ico-pre { a:hover > .ico-pre {
background-color: #000; background-color: #000;
} }
/* end icon */ /* end icon */
/* start framework */ /* start framework */
@ -341,6 +366,7 @@ a:hover > .ico-pre {
.footer a:hover { .footer a:hover {
text-decoration: underline; text-decoration: underline;
} }
/* end framework */ /* end framework */
/* start header */ /* start header */
@ -393,6 +419,7 @@ a:hover > .ico-pre {
width: 14px; width: 14px;
margin: -1px 5px 0 0; margin: -1px 5px 0 0;
} }
/* end header */ /* end header */
/* start article list */ /* start article list */
@ -547,6 +574,7 @@ article .article-title a {
font-weight: normal; font-weight: normal;
padding: 5px 20px; padding: 5px 20px;
} }
/* end article list */ /* end article list */
/* start dynamic */ /* start dynamic */
@ -568,6 +596,7 @@ article .article-title a {
.links a { .links a {
line-height: 24px; line-height: 24px;
} }
/* end dynamic */ /* end dynamic */
/* start comments */ /* start comments */
@ -590,7 +619,6 @@ article .article-title a {
} }
.comments > li > div > div.vditor-reset { .comments > li > div > div.vditor-reset {
padding-left: 75px;
margin: 12px 0; margin: 12px 0;
} }
@ -627,6 +655,8 @@ article .article-title a {
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
margin: 5px 5px 5px 0; margin: 5px 5px 5px 0;
padding: 6px; padding: 6px;
width: 100%;
box-sizing: border-box;
} }
.comment-form input[type='text']:focus, .comment-form input[type='text']:focus,
@ -652,6 +682,7 @@ article .article-title a {
color: #fff; color: #fff;
background-color: #444; background-color: #444;
} }
/* end comments */ /* end comments */
/* start others */ /* start others */
@ -659,7 +690,6 @@ article .article-title a {
background-color: #6B6B6B; background-color: #6B6B6B;
border: 1px solid #898989; border: 1px solid #898989;
border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset, 0 1px 0 rgba(255, 255, 255, 0.7), 0 -1px 0 rgba(255, 255, 255, 0.6);
color: #CCCCCC; color: #CCCCCC;
padding: 5px 10px; padding: 5px 10px;
position: absolute; position: absolute;
@ -668,6 +698,7 @@ article .article-title a {
z-index: 1; z-index: 1;
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
font-weight: normal;
} }
.index-nav-abs { .index-nav-abs {
@ -707,6 +738,7 @@ article .article-title a {
background-color: #353535; background-color: #353535;
color: #fff; color: #fff;
} }
/* end others */ /* end others */
/* start responsive */ /* start responsive */
@ -779,10 +811,10 @@ article .article-title a {
.header > .container li:hover { .header > .container li:hover {
background-color: #FFFFFF; background-color: #FFFFFF;
background-image: linear-gradient(#FFFFFF,#E5E5E5); background-image: linear-gradient(#FFFFFF, #E5E5E5);
background-image: -ms-linear-gradient(#FFFFFF,#E5E5E5); background-image: -ms-linear-gradient(#FFFFFF, #E5E5E5);
background-image: -o-linear-gradient(#FFFFFF,#E5E5E5); background-image: -o-linear-gradient(#FFFFFF, #E5E5E5);
background-image: -webkit-linear-gradient(#FFFFFF,#E5E5E5); background-image: -webkit-linear-gradient(#FFFFFF, #E5E5E5);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FFFFFF', endColorstr='#E5E5E5'); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FFFFFF', endColorstr='#E5E5E5');
} }
@ -895,7 +927,6 @@ article .article-title a {
} }
} }
@media (max-width: 360px) { @media (max-width: 360px) {
.ico { .ico {
display: block; display: block;
@ -926,4 +957,5 @@ article .article-title a {
bottom: 114px; bottom: 114px;
} }
} }
/* end responsive */ /* end responsive */

4
timeline/footer.ftl
View File

@ -19,6 +19,10 @@
--> -->
<div class="footer"> <div class="footer">
<div class="container fn-clear"> <div class="container fn-clear">
<#include "../../common-template/macro-user_site.ftl"/>
<div class="ft__center">
<@userSite dir="ne"/>
</div>
<div class="left"> <div class="left">
<span>&copy; ${year}</span> - <a href="${servePath}">${blogTitle}</a>${footerContent} <span>&copy; ${year}</span> - <a href="${servePath}">${blogTitle}</a>${footerContent}
Powered by <a href="https://b3log.org" target="_blank">B3log 开源</a> • <a href="https://solo.b3log.org" target="_blank">Solo</a> ${version}&nbsp;&nbsp; Powered by <a href="https://b3log.org" target="_blank">B3log 开源</a> • <a href="https://solo.b3log.org" target="_blank">Solo</a> ${version}&nbsp;&nbsp;

9
timeline/js/timeline.js
View File

@ -206,12 +206,15 @@ var timeline = {
path = "/articles/"; path = "/articles/";
if ($("#tag").length === 1) { if ($("#tag").length === 1) {
var pathnames = location.pathname.split("/"); var pathnames = location.pathname.split("/");
path = "/articles/tags/" + pathnames[pathnames.length - 1] + "/"; path = "/articles/tags/" + pathnames[pathnames.length - 1];
} else if ($("#author").length === 1) { } else if ($("#author").length === 1) {
var pathnames = location.pathname.split("/"); var pathnames = location.pathname.split("/");
path = "/articles/authors/" + pathnames[pathnames.length - 1] + "/"; path = "/articles/authors/" + pathnames[pathnames.length - 1];
} else if ($("#category").length === 1) {
var pathnames = location.pathname.split("/");
path = "/articles/category/" + pathnames[pathnames.length - 1];
} else if (archive) { } else if (archive) {
path = "/articles/archives/" + archive + "/"; path = "/articles/archives/" + archive;
} }
$.ajax({ $.ajax({
url: Label.servePath + path + '?p=' + currentPage, url: Label.servePath + path + '?p=' + currentPage,

2
timeline/macro-comments.ftl
View File

@ -26,7 +26,7 @@
<#if article.commentable> <#if article.commentable>
<h3>${commentLabel}</h3> <h3>${commentLabel}</h3>
<div class="comment-form"> <div class="comment-form">
<textarea style="width:96%" rows="3" placeholder="${postCommentsLabel}" id="comment"></textarea> <textarea rows="3" placeholder="${postCommentsLabel}" id="comment"></textarea>
</div> </div>
<#if externalRelevantArticlesDisplayCount?? && 0 != externalRelevantArticlesDisplayCount> <#if externalRelevantArticlesDisplayCount?? && 0 != externalRelevantArticlesDisplayCount>
<div id="externalRelevantArticles"></div> <div id="externalRelevantArticles"></div>