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

♻️

Browse Source
This commit is contained in:
Van 2019-02-28 11:42:14 +08:00
parent 07afe0956f
commit 0359226512
No known key found for this signature in database
GPG Key ID: 7059B8783A78F16C
7 changed files with 80 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Pinghsu/article.ftl
View File

@ -68,7 +68,7 @@
</sup> </sup>
</#if> </#if>
</h2> </h2>
<div class="ft__gray item__meta"> <div class="ft__fade item__meta">
Published on Published on
<time> <time>
<#setting locale="en_US"> <#setting locale="en_US">

2
Pinghsu/category-articles.ftl
View File

@ -35,7 +35,7 @@
<div class="page__title"> <div class="page__title">
<span class="ft__red">#</span> <span class="ft__red">#</span>
${category.categoryTitle} ${category.categoryTitle}
<div class="ft__gray">${category.categoryDescription}</div> <div class="ft__fade">${category.categoryDescription}</div>
</div> </div>
<#include "article-list.ftl"> <#include "article-list.ftl">
</div> </div>

4
Pinghsu/common-comment.ftl
View File

@ -23,9 +23,9 @@
<div class="item__avatar" style="background-image: url(${comment.commentThumbnailURL})"></div> <div class="item__avatar" style="background-image: url(${comment.commentThumbnailURL})"></div>
<div class="item__name"> <div class="item__name">
<#if "http://" == comment.commentURL> <#if "http://" == comment.commentURL>
${comment.commentName} <span class="ft__fade">${comment.commentName}</span>
<#else> <#else>
<a href="${comment.commentURL}" target="_blank">${comment.commentName}</a> <a class="ft__link" href="${comment.commentURL}" target="_blank">${comment.commentName}</a>
</#if> </#if>
<#if comment.isReply> <#if comment.isReply>

2
Pinghsu/css/base.css
View File

File diff suppressed because one or more lines are too long

99
Pinghsu/css/base.scss
View File

@ -19,7 +19,7 @@
* skin style * skin style
* *
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a> * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 0.1.0.0, Feb 26, 2019 * @version 0.1.0.1, Feb 28, 2019
*/ */
@import "../../../scss/reset"; @import "../../../scss/reset";
@import "../../../scss/reset-content"; @import "../../../scss/reset-content";
@ -30,26 +30,33 @@
@import "icon"; @import "icon";
@import "vditor/src/assets/scss/classic"; @import "vditor/src/assets/scss/classic";
$red: #eb5055 !default;
$black: #313131 !default;
$fade: rgba(0,0,0,.38) !default;
$gray: #5f5f5f !default;
$gray-lighter: #e0e0e0 !default;
$gray-lightest: #f7f7f7 !default;
.body--gray { .body--gray {
background-color: #f7f7f7; background-color: $gray-lightest;
} }
a { a {
text-decoration: none; text-decoration: none;
color: #313131; color: $black;
outline: 0; outline: 0;
transition: all .3s; transition: all .3s;
} }
a:active, a:focus, a:hover { a:active, a:focus, a:hover {
color: #eb5055; color: $red;
outline: 0; outline: 0;
text-decoration: none; text-decoration: none;
} }
::selection { ::selection {
color: #fff; color: #fff;
background-color: #eb5055; background-color: $red;
} }
.content-reset { .content-reset {
@ -57,14 +64,30 @@ a:active, a:focus, a:hover {
.b3-solo-list { .b3-solo-list {
display: none; display: none;
} }
a {
color: $black;
border-bottom: 1px solid $gray-lighter;
&:hover {
color: $red;
border-bottom: 1px solid $red;
}
}
} }
.ft__gray { .ft__fade {
color: #767676; color: $fade;
} }
.ft__red { .ft__red {
color: #eb5055; color: $red;
}
.ft__link {
color: $gray;
&:hover {
color: #000;
}
} }
.tag { .tag {
@ -79,8 +102,8 @@ a:active, a:focus, a:hover {
border-radius: 12px; border-radius: 12px;
margin-left: 10px; margin-left: 10px;
&:hover { &:hover {
color: #5f5f5f; color: $gray;
background: #f7f7f7; background: $gray-lighter;
} }
&--1 { &--1 {
@ -90,7 +113,7 @@ a:active, a:focus, a:hover {
background: #46c47c; background: #46c47c;
} }
&--3 { &--3 {
background: #eb5055; background: $red;
} }
&--4 { &--4 {
background: #db4437; background: #db4437;
@ -138,7 +161,6 @@ a:active, a:focus, a:hover {
height: 70px; height: 70px;
box-shadow: 0 1px 5px rgba(0, 0, 0, .1); box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
&__logo { &__logo {
color: #4d4d4d;
font-size: 20px; font-size: 20px;
img { img {
margin: 10px 5px 0 0; margin: 10px 5px 0 0;
@ -153,7 +175,7 @@ a:active, a:focus, a:hover {
a { a {
margin: 0 15px; margin: 0 15px;
&.current { &.current {
color: #eb5055; color: $red;
} }
&.search { &.search {
@ -231,18 +253,11 @@ a:active, a:focus, a:hover {
&__copyright { &__copyright {
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
color: #767676; color: $fade;
} }
.wrapper { .wrapper {
padding-bottom: 40px; padding-bottom: 40px;
} }
a {
color: #5f5f5f;
&:hover {
color: #313131;
}
}
} }
.article-list { .article-list {
@ -333,13 +348,13 @@ a:active, a:focus, a:hover {
font-size: 12px; font-size: 12px;
float: left; float: left;
top: -33px; top: -33px;
color: #eb5055; color: $red;
} }
} }
&__tag { &__tag {
float: right; float: right;
color: #5f5f5f; color: $gray;
margin: 12px 10px; margin: 12px 10px;
} }
@ -367,11 +382,11 @@ a:active, a:focus, a:hover {
text-align: center; text-align: center;
margin: 25px 0 40px; margin: 25px 0 40px;
&__item { &__item {
color: #5f5f5f; color: $gray;
padding: 0 15px; padding: 0 15px;
&--current { &--current {
color: #eb5055; color: $red;
} }
} }
} }
@ -385,7 +400,7 @@ a:active, a:focus, a:hover {
bottom: 0; bottom: 0;
left: 0; left: 0;
height: 48px; height: 48px;
border-top: 1px solid #e0e0e0; border-top: 1px solid $gray-lighter;
background-color: #fff; background-color: #fff;
animation-duration: .5s; animation-duration: .5s;
animation-fill-mode: both; animation-fill-mode: both;
@ -444,11 +459,10 @@ a:active, a:focus, a:hover {
a { a {
font-weight: 400; font-weight: 400;
font-size: 21px; font-size: 21px;
color: #222;
} }
sup { sup {
font-weight: normal; font-weight: normal;
color: #eb5055; color: $red;
} }
} }
&__meta { &__meta {
@ -457,7 +471,7 @@ a:active, a:focus, a:hover {
} }
&__tags { &__tags {
border-bottom: 1px solid #e0e0e0; border-bottom: 1px solid $gray-lighter;
margin-bottom: 15px; margin-bottom: 15px;
.tag { .tag {
margin: 0 10px 15px 0; margin: 0 10px 15px 0;
@ -475,7 +489,7 @@ a:active, a:focus, a:hover {
h3 { h3 {
font-size: 14px; font-size: 14px;
padding-bottom: 10px; padding-bottom: 10px;
color: #5f5f5f; color: $fade;
font-weight: normal; font-weight: normal;
} }
@ -488,13 +502,20 @@ a:active, a:focus, a:hover {
font-size: 13px; font-size: 13px;
line-height: 26px; line-height: 26px;
} }
a {
color: $gray;
&:hover {
color: #000;
}
}
} }
&__toc { &__toc {
position: fixed; position: fixed;
top: 100px; top: 100px;
max-width: 200px; max-width: 200px;
border-left: 1px solid #ddd; border-left: 1px solid $gray-lighter;
.b3-solo-list { .b3-solo-list {
margin: 0; margin: 0;
@ -536,7 +557,7 @@ a:active, a:focus, a:hover {
height: 7px; height: 7px;
content: ''; content: '';
border-radius: 50%; border-radius: 50%;
background-color: #eb5055; background-color: $red;
} }
} }
} }
@ -557,7 +578,7 @@ a:active, a:focus, a:hover {
&__title { &__title {
padding: 30px 20px; padding: 30px 20px;
color: #5f5f5f; color: $gray;
} }
.item { .item {
@ -570,7 +591,7 @@ a:active, a:focus, a:hover {
padding: 20px; padding: 20px;
&__meta { &__meta {
color: #5f5f5f; color: $gray;
font-size: 12px; font-size: 12px;
} }
@ -579,14 +600,14 @@ a:active, a:focus, a:hover {
height: 40px; height: 40px;
width: 40px; width: 40px;
border-radius: 20px; border-radius: 20px;
border: 1px solid #eaeaea; border: 1px solid $gray-lighter;
margin: 0 20px 20px 0; margin: 0 20px 20px 0;
background-size: cover; background-size: cover;
background-position: center center; background-position: center center;
} }
&__name { &__name {
color: #5f5f5f; color: $gray;
float: left; float: left;
line-height: 40px; line-height: 40px;
} }
@ -594,7 +615,7 @@ a:active, a:focus, a:hover {
&:hover { &:hover {
.item__reply { .item__reply {
display: block; display: block;
color: #eb5055; color: $red;
} }
} }
} }
@ -622,7 +643,7 @@ a:active, a:focus, a:hover {
&__title { &__title {
margin: 10px 0; margin: 10px 0;
padding: 0 15px; padding: 0 15px;
color: #5f5f5f; color: $gray;
} }
&__content { &__content {
@ -715,7 +736,7 @@ a:active, a:focus, a:hover {
margin-top: 6px; margin-top: 6px;
} }
.header__menu { .header__menu {
background-color: #f7f7f7; background-color: $gray-lightest;
position: absolute; position: absolute;
top: 70px; top: 70px;
width: 100%; width: 100%;

29
Pinghsu/footer.ftl
View File

@ -20,22 +20,22 @@
<footer class="footer"> <footer class="footer">
<nav class="footer__nav mobile__none"> <nav class="footer__nav mobile__none">
<#list pageNavigations as page> <#list pageNavigations as page>
<a href="${page.pagePermalink}" target="${page.pageOpenTarget}" rel="section"> <a class="ft__link" href="${page.pagePermalink}" target="${page.pageOpenTarget}" rel="section">
${page.pageTitle} ${page.pageTitle}
</a> </a>
</#list> </#list>
<a rel="alternate" href="${servePath}/rss.xml" rel="section">RSS</a> <a class="ft__link" rel="alternate" href="${servePath}/rss.xml" rel="section">RSS</a>
<#if isLoggedIn> <#if isLoggedIn>
<a href="${servePath}/admin-index.do#main" title="${adminLabel}">${adminLabel}</a> <a class="ft__link" href="${servePath}/admin-index.do#main" title="${adminLabel}">${adminLabel}</a>
<a href="${logoutURL}">${logoutLabel}</a> <a class="ft__link" href="${logoutURL}">${logoutLabel}</a>
<#else> <#else>
<a href="${servePath}/start">${startToUseLabel}</a> <a class="ft__link" href="${servePath}/start">${startToUseLabel}</a>
</#if> </#if>
</nav> </nav>
<div class="footer__border mobile__none"></div> <div class="footer__border mobile__none"></div>
<div class="wrapper fn__flex"> <div class="wrapper fn__flex">
<div class="fn__flex-1 mobile__none"> <div class="fn__flex-1 mobile__none">
<div class="ft__gray">${adminUser.userName} - ${blogSubtitle}</div><br> <div class="ft__fade">${adminUser.userName} - ${blogSubtitle}</div><br>
<#if noticeBoard??> <#if noticeBoard??>
${noticeBoard} ${noticeBoard}
</#if> </#if>
@ -43,18 +43,18 @@
<#if 0 != mostUsedCategories?size> <#if 0 != mostUsedCategories?size>
<div class="footer__mid fn__flex-1 mobile__none"> <div class="footer__mid fn__flex-1 mobile__none">
<div class="ft__gray">${categoryLabel}</div> <br> <div class="ft__fade">${categoryLabel}</div> <br>
<#list mostUsedCategories as category> <#list mostUsedCategories as category>
<a href="${servePath}/category/${category.categoryURI}" <a href="${servePath}/category/${category.categoryURI}"
aria-label="${category.categoryTagCnt} ${cntLabel}${tagsLabel}" aria-label="${category.categoryTagCnt} ${cntLabel}${tagsLabel}"
class="ft__nowrap tooltipped tooltipped__n"> class="ft__link ft__nowrap tooltipped tooltipped__n">
${category.categoryTitle}</a> &nbsp; &nbsp; ${category.categoryTitle}</a> &nbsp; &nbsp;
</#list> </#list>
</div> </div>
</#if> </#if>
<div class="fn__flex-1 footer__copyright"> <div class="fn__flex-1 footer__copyright">
<a href="${servePath}/archives.html"> <a class="ft__link" href="${servePath}/archives.html">
${statistic.statisticPublishedBlogArticleCount} ${statistic.statisticPublishedBlogArticleCount}
${articleLabel} ${articleLabel}
</a> &nbsp; &nbsp; </a> &nbsp; &nbsp;
@ -62,14 +62,15 @@
${commentLabel} <br> ${commentLabel} <br>
${statistic.statisticBlogViewCount} <span class="ft-gray">${viewLabel}</span> &nbsp; &nbsp; ${statistic.statisticBlogViewCount} <span class="ft-gray">${viewLabel}</span> &nbsp; &nbsp;
${onlineVisitorCnt} <span class="ft-gray">${onlineVisitorLabel}</span> <br> ${onlineVisitorCnt} <span class="ft-gray">${onlineVisitorLabel}</span> <br>
<a href="https://solo.b3log.org" target="_blank">Solo</a> ${version} <a class="ft__link" href="https://solo.b3log.org" target="_blank">Solo</a> ${version}
&copy; ${year} ${footerContent} &copy; ${year} ${footerContent}
<a href="${servePath}">${blogTitle}</a> <a class="ft__link" href="${servePath}">${blogTitle}</a>
<br> <br>
Powered by <a href="https://b3log.org" target="_blank">B3log</a> 开源 Powered by <a class="ft__link" href="https://b3log.org" target="_blank">B3log</a> 开源
<br> <br>
Theme <a rel="friend" href="https://github.com/b3log/solo-skins" target="_blank">Pinghsu</a> Theme <a class="ft__link" rel="friend" href="https://github.com/b3log/solo-skins" target="_blank">Pinghsu</a>
by <a href="http://vanessa.b3log.org" target="_blank">Vanessa</a> <sup>[<a class="ft__link" target="_blank" href="https://github.com/chakhsu/pinghsu">Ref</a>]</sup>
by <a class="ft__link" href="http://vanessa.b3log.org" target="_blank">Vanessa</a>
</div> </div>
</div> </div>
</footer> </footer>

BIN
Pinghsu/preview.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 84 KiB

After

Width:  |  Height:  |  Size: 49 KiB