This commit is contained in:
Van 2019-03-01 16:36:13 +08:00
parent ce871510a4
commit f2ff53a992
No known key found for this signature in database
GPG Key ID: 7059B8783A78F16C
2 changed files with 413 additions and 407 deletions

View File

@ -20,12 +20,12 @@
* skin community style
*
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 2.0.0.0, Feb 21, 2019
* @version 2.1.0.0, Mar 1, 2019
*/
@import "../../../scss/reset-content";
@import "../../../scss/reset";
@import "vditor/src/assets/scss/classic";
.left {
float: left;
}
@ -47,6 +47,7 @@
.none {
display: none;
}
body {
background-color: #EFEFEF;
color: #555555;
@ -54,7 +55,7 @@ body {
}
a, a:link {
color:#000000;
color: #000000;
text-decoration: none;
}
@ -66,6 +67,7 @@ a:active, a:visited {
a:hover {
text-decoration: underline;
}
img {
max-width: 100%;
vertical-align: middle;
@ -75,12 +77,13 @@ img {
overflow: hidden;
font-size: 12px;
}
.content {
width: 940px;
margin: 0 auto;
}
.content>h2 {
.content > h2 {
margin: -20px 0 20px 0;
}
@ -99,14 +102,14 @@ img {
}
input[type='button'] {
border-radius:5px;
border-radius: 5px;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 0 2px rgba(255, 255, 255, 0.3) inset, 0 1px 2px rgba(0, 0, 0, 0.29);
background-color: #000000;
background-image: linear-gradient(top,#333333,#000000);
background-image: -moz-linear-gradient(top,#333333,#000000);
background-image: -ms-linear-gradient(top,#333333,#000000);
background-image: -o-linear-gradient(top,#333333,#000000);
background-image: -webkit-gradient(linear,left top,left bottom,from(#333333),to(#000000));
background-image: linear-gradient(top, #333333, #000000);
background-image: -moz-linear-gradient(top, #333333, #000000);
background-image: -ms-linear-gradient(top, #333333, #000000);
background-image: -o-linear-gradient(top, #333333, #000000);
background-image: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#000000));
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#000000');
border: 1px solid #000000;
color: white;
@ -117,11 +120,11 @@ input[type='button'] {
input[type='button']:hover {
background-color: #333333;
background-image: linear-gradient(top,#333333,#212121);
background-image: -moz-linear-gradient(top,#333333,#212121);
background-image: -ms-linear-gradient(top,#333333,#212121);
background-image: -o-linear-gradient(top,#333333,#212121);
background-image: -webkit-gradient(linear,left top,left bottom,from(#333333),to(#212121));
background-image: linear-gradient(top, #333333, #212121);
background-image: -moz-linear-gradient(top, #333333, #212121);
background-image: -ms-linear-gradient(top, #333333, #212121);
background-image: -o-linear-gradient(top, #333333, #212121);
background-image: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#212121));
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#212121');
}
@ -244,7 +247,7 @@ a.header-title {
background-color: #FFFFFF;
border-bottom: 1px solid #E3E3E3;
border-right: 1px solid #E3E3E3;
margin-right:20px;
margin-right: 20px;
padding: 20px 20px 0;
width: 499px;
float: left;
@ -264,7 +267,7 @@ a.header-title {
}
.article-main h2.title {
font: bold 30px Arial,Helvetica,sans-serif;
font: bold 30px Arial, Helvetica, sans-serif;
margin: 0 0 20px;
}
@ -273,7 +276,7 @@ a.header-title {
}
.read-more a {
background-color:#F2F2F2;
background-color: #F2F2F2;
color: #333333;
font-size: 12px;
padding: 8px 18px 8px 12px;
@ -289,7 +292,7 @@ a.header-title {
.article-footer h3 {
background: url("../images/indentline-light.png") repeat-x scroll left bottom transparent;
font-size: 17px;
padding: 25px 0 10px;
padding: 10px 0;
}
.article-footer ul {
@ -323,6 +326,7 @@ a.header-title {
padding: 0 3px;
text-decoration: none;
}
.pagination a.selected {
font-weight: bold;
}
@ -346,17 +350,20 @@ a.header-title {
border-bottom: 1px solid #E3E3E3;
border-right: 1px solid #E3E3E3;
margin: 40px 0 40px 181px;
padding:20px;
padding: 20px;
width: 716px;
}
.article-detail-footer>a{
.article-detail-footer > a {
font-weight: bold;
}
.article-relative {
margin-top: 20px;
width: 360px;
li {
list-style: none;
}
}
.article-relative h4 {
@ -374,11 +381,12 @@ a.header-title {
padding-top: 30px;
position: relative;
}
#comments>div{
#comments > div {
margin-top: 10px;
}
#comments>div>img {
#comments > div > img {
height: 80px;
width: 80px;
margin: 1px 10px 10px 0;
@ -391,7 +399,7 @@ a.header-title {
padding: 20px;
width: 798px;
margin-bottom: 10px;
word-wrap:break-word;
word-wrap: break-word;
overflow: hidden;
}
@ -404,7 +412,7 @@ a.header-title {
}
#comments .comment-panel .reply a {
border-radius:5px;
border-radius: 5px;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 0 2px rgba(255, 255, 255, 0.3) inset, 0 1px 2px rgba(0, 0, 0, 0.29);
background-color: #EEEEEE;
border: 1px solid #888888;
@ -426,7 +434,7 @@ a.header-title {
opacity: 0.9;
}
#comments .comment-body-ref .comment-panel{
#comments .comment-body-ref .comment-panel {
border-width: 0px;
margin-bottom: 0;
width: 620px;
@ -454,8 +462,9 @@ a.header-title {
color: #666666;
padding: 10px 7px;
background-color: #FFFFFF;
font-family: Arial,Helvetica,sans-serif;
width: 723px;
font-family: Arial, Helvetica, sans-serif;
width: 100%;
box-sizing: border-box;
border: 1px solid #DDDDDD;
font-size: 12px;
height: 16px;
@ -475,6 +484,7 @@ a.header-title {
#commentValidate, #commentValidateReply {
width: 240px;
}
/* footer secondary */
.footer-secondary {
background: url("../images/indentline-light.png") repeat-x scroll left top #DEDEDE;
@ -497,14 +507,8 @@ a.header-title {
float: left;
width: 700px;
margin-left: 65px;
word-break:break-all;
word-wrap:break-word;
}
.most-view-count-articles a {
font: 18px ;
margin-right: 20px;
font-weight: bold;
word-break: break-all;
word-wrap: break-word;
}
.most-view-count-articles sup {
@ -526,7 +530,7 @@ a.header-title {
line-height: 22px;
}
.recent-comments img, #comments>div>img {
.recent-comments img, #comments > div > img {
background-color: #FFFFFF;
border-bottom: 1px solid #C2C2C2;
border-right: 1px solid #C2C2C2;
@ -535,7 +539,7 @@ a.header-title {
height: 75px;
}
.recent-comments img:hover, #comments>div>img:hover {
.recent-comments img:hover, #comments > div > img:hover {
border-color: #5A5A5A;
}
@ -546,11 +550,11 @@ a.header-title {
}
.footer-block {
margin-right: 20px;
width: 220px;
margin: 0 10px 20px 10px;
width: 22%;
}
.footer-block h4{
.footer-block h4 {
font: bold 18px ;
color: #000000;
height: 25px;
@ -569,11 +573,11 @@ a.header-title {
background: url("../images/indentline-light.png") repeat-x scroll left bottom transparent;
}
.footer-block li.mostUsedTags a{
.footer-block li.mostUsedTags a {
padding-left: 20px;
}
.footer-block li img{
.footer-block li img {
cursor: pointer;
height: 16px;
left: 0px;
@ -654,6 +658,7 @@ a.header-title {
background-repeat: no-repeat;
float: left;
}
.read-more-icon {
background-position: 0 -22px;
height: 12px;
@ -703,11 +708,11 @@ a.header-title {
width: 64px;
background-image: url("../images/author-header.png");
float: right;
white-space:normal;
white-space: normal;
text-align: center;
word-break:break-all;
word-break: break-all;
padding-top: 6px;
word-wrap:break-word;
word-wrap: break-word;
font-weight: bold;
}

View File

@ -33,7 +33,7 @@
<#if 0 != mostViewCountArticles?size>
<h4>${mostViewCountArticlesLabel}</h4>
<div class="arrow-right"></div>
<div class="most-view-count-articles">
<div class="most-view-count-articles article-footer">
<ul>
<#list mostViewCountArticles as article>
<li>
@ -44,6 +44,23 @@
</#list>
</ul>
</div>
<#if 0 != mostCommentArticles?size>
<div class="clear"></div>
<div class="hr"></div>
<h4>${mostCommentArticlesLabel}</h4>
<div class="arrow-right"></div>
<div class="most-view-count-articles article-footer">
<ul>
<#list mostCommentArticles as article>
<li>
<a rel="nofollow" title="${article.articleTitle}" href="${servePath}${article.articlePermalink}">
<sup>[${article.articleCommentCount}]</sup>${article.articleTitle}
</a>
</li>
</#list>
</ul>
</div>
</#if>
<div class="clear"></div>
<#if 0 != recentComments?size>
<div class="hr"></div>
@ -72,22 +89,6 @@
</div>
<div class="footer-widgets">
<div class="content">
<#if 0 != mostCommentArticles?size>
<div class="left footer-block">
<h4>${mostCommentArticlesLabel}</h4>
<ul>
<#list mostCommentArticles as article>
<li>
<sup>[${article.articleCommentCount}]</sup>
<a rel="nofollow" title="${article.articleTitle}" href="${servePath}${article.articlePermalink}">
${article.articleTitle}
</a>
</li>
</#list>
</ul>
</div>
</#if>
<#if 0 != mostUsedCategories?size>
<div class="left footer-block">
<h4><span class="left">${categoryLabel}</span></h4>