This commit is contained in:
Van 2019-02-26 10:16:17 +08:00
parent 453daf2288
commit 4038dbe25d
No known key found for this signature in database
GPG Key ID: 7059B8783A78F16C
3 changed files with 512 additions and 504 deletions

View File

@ -46,9 +46,7 @@
</sup> </sup>
</#if> </#if>
</h2> </h2>
<div class="content-reset article__content"> <div class="article__thumbnail" style="background-image: url(${article.articleImg1URL})"/>
${article.articleAbstract}
</div>
</div> </div>
<div class="article__meta ft-gray fn-flex"> <div class="article__meta ft-gray fn-flex">

File diff suppressed because one or more lines are too long

View File

@ -21,7 +21,6 @@
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a> * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 2.0.0.0, Feb 21, 2019 * @version 2.0.0.0, Feb 21, 2019
*/ */
@import "../../../scss/reset-content"; @import "../../../scss/reset-content";
@import "../../../scss/reset"; @import "../../../scss/reset";
@import "../../../scss/nprogress"; @import "../../../scss/nprogress";
@ -487,55 +486,66 @@
} }
/* star article */ /* star article */
.article__wrap { .article {
&__main {
display: flex;
flex-direction: column;
}
&__thumbnail {
margin: 10px 0;
background-position: center center;
background-size: cover;
flex: 1;
}
&__wrap {
margin-right: -20px margin-right: -20px
} }
.article__item { &__item {
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 2px; border-radius: 2px;
margin-bottom: 20px; margin-bottom: 20px;
float: left float: left
} }
.article__item--big { &__item--big {
width: 318px; width: 318px;
margin-right: 20px margin-right: 20px
} }
.article__item--big .article__main { &__item--big .article__main {
height: 275px; height: 236px;
overflow: hidden; overflow: hidden;
margin-bottom: 10px
} }
.article__item--small { &__item--small {
width: 318px; width: 318px;
margin-right: 20px margin-right: 20px;
.article__thumbnail {
background-image: none !important;
}
} }
.article__item--small .article__main { &__item--small .article__main {
height: 94px; height: 91px;
overflow: hidden; overflow: hidden;
margin-bottom: 10px
} }
.article__item--mid { &__item--mid {
width: 488px; width: 488px;
margin-right: 20px margin-right: 20px
} }
.article__item--mid .article__main { &__item--mid .article__main {
height: 195px; height: 195px;
overflow: hidden; overflow: hidden;
margin-bottom: 10px
} }
.article__panel { &__panel {
padding: 16px padding: 16px
} }
.article__title { &__title {
overflow: hidden; overflow: hidden;
line-height: 24px; line-height: 24px;
font-size: 21px; font-size: 21px;
@ -543,21 +553,21 @@
word-break: break-all word-break: break-all
} }
.article__title a { &__title a {
color: rgba(0, 0, 0, 0.84) color: rgba(0, 0, 0, 0.84)
} }
.article__title a:hover { &__title a:hover {
text-decoration: none text-decoration: none
} }
.article__title sup { &__title sup {
top: -6px; top: -6px;
font-size: 12px; font-size: 12px;
color: #03a87c; color: #03a87c;
} }
.article__content { &__content {
margin-top: 4px; margin-top: 4px;
font-size: 16px; font-size: 16px;
color: rgba(0, 0, 0, 0.54); color: rgba(0, 0, 0, 0.54);
@ -566,9 +576,11 @@
word-break: break-all; word-break: break-all;
} }
.article__meta { &__meta {
font-size: 15px; font-size: 15px;
line-height: 23px; line-height: 23px;
flex-shrink: 0;
}
} }
/* end article list */ /* end article list */
@ -884,7 +896,6 @@
padding: 40px 0 35px padding: 40px 0 35px
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.header { .header {
text-align: left text-align: left
@ -947,7 +958,6 @@
} }
} }
/* Make clicks pass-through */ /* Make clicks pass-through */
#nprogress .bar { #nprogress .bar {
background: #d23f31; background: #d23f31;