breaking changes: 移除 html 的 font-size 改為瀏覽器默認大小

feat: 為文章單獨設置 TOC simple_style 顯示 closed #631
feat: page 頁頂部圖增加黑色遮罩 closed #671
feat: 首頁 pagination 更新 UI
fix: 修復使用本地搜索時,搜索插件配置為不搜索文章內容會無法使用搜索 的 bug
fix: 修復開啟 photofigcaption 後,導致inlineImg標籤外掛顯示錯亂的 bug
fix: 修復 字體過大/過小而導致 部分 ui 偏移的 bug
improvement: 主題 css 使用的 rem 改為 em 或 px
improvement: 修改没有顶部图下,文章页的标题大小 closed #669
improvement: 代碼優化
This commit is contained in:
Jerry
2021-09-20 17:55:20 +08:00
Unverified
parent 484f036adb
commit 3708fdf569
42 changed files with 387 additions and 425 deletions

View File

@@ -6,29 +6,23 @@ if hexo-config('error_404.enable')
right: 0
left: 0
margin: 0 auto
padding: 0 1rem
padding: 0 20px
max-width: 1000px
transform: translate(0, -50%)
.error-content
@extend .cardHover
display: flex
flex-direction: row
justify-content: center
align-items: center
margin: 0 1rem
height: 18rem
border-radius: 8px
background: var(--card-bg)
box-shadow: var(--card-box-shadow)
transition: all .3s
&:hover
box-shadow: var(--card-hover-box-shadow)
margin: 0 20px
height: 360px
+maxWidth768()
flex-direction: column
margin: 0
height: 25rem
height: 500px
.error-img
flex: 1
@@ -47,7 +41,7 @@ if hexo-config('error_404.enable')
.error-info
flex: 1
padding: .5rem
padding: 10px
text-align: center
font-size: 14px
@@ -59,28 +53,28 @@ if hexo-config('error_404.enable')
width: 100%
.error_title
margin-top: -4rem
margin-top: -80px
font-size: 9em
+maxWidth768()
margin-top: -3rem
margin-top: -60px
.error_subtitle
@extend .limit-more-line
margin-top: -3.5rem
margin-top: -70px
word-break: break-word
font-size: 1.6em
-webkit-line-clamp: 2
a
display: inline-block
margin-top: .5rem
padding: .3rem 1.5rem
margin-top: 10px
padding: 6px 30px
background: var(--btn-bg)
color: var(--btn-color)
i
padding-right: .3rem
padding-right: 6px
& + #rightside
display: none

View File

@@ -1,13 +1,13 @@
.article-sort
margin-left: .5rem
padding-left: 1rem
margin-left: 10px
padding-left: 20px
border-left: 2px solid lighten($light-blue, 20)
&-title
position: relative
margin-left: .5rem
padding-bottom: 1rem
padding-left: 1rem
margin-left: 10px
padding-bottom: 20px
padding-left: 20px
font-size: 1.72em
&:hover
@@ -16,10 +16,10 @@
&:before
position: absolute
top: calc(((100% - 1.8rem) / 2))
left: -.45rem
top: calc(((100% - 36px) / 2))
left: -9px
z-index: 1
width: w = .5rem
width: w = 10px
height: h = w
border: .5 * w solid $light-blue
border-radius: w
@@ -33,7 +33,7 @@
bottom: 0
left: 0
z-index: 0
width: .1rem
width: 2px
height: 1.5em
background: lighten($light-blue, 20)
content: ''
@@ -42,7 +42,7 @@
position: relative
display: flex
align-items: center
margin: 0 0 1rem .5rem
margin: 0 0 20px 10px
transition: all .2s ease-in-out
&:hover
@@ -50,9 +50,9 @@
border-color: $pseudo-hover
&:before
$w = .3rem
$w = 6px
position: absolute
left: calc(-1rem - 17px)
left: calc(-20px - 17px)
width: w = $w
height: h = w
border: .5 * w solid $light-blue
@@ -82,7 +82,7 @@
font-size: 95%
time
padding-left: .3rem
padding-left: 6px
cursor: default
&-title
@@ -112,4 +112,4 @@
&-info
flex: 1
padding: 0 .8rem
padding: 0 16px

View File

@@ -1,6 +1,6 @@
#page
.category-lists
padding: 1rem 0 1.5rem
padding: 20px 0 30px
+maxWidth768()
padding: 0
@@ -19,7 +19,7 @@
color: $text-hover
.category-list-count
margin-left: .4rem
margin-left: 8px
color: $theme-meta-color
&:before
@@ -29,17 +29,17 @@
content: ')'
ul
margin-top: .4rem
padding: 0 0 0 1rem
margin-top: 8px
padding: 0 0 0 20px
list-style: none
counter-reset: li
ul
padding-left: .2rem
padding-left: 4px
li
position: relative
margin: .3rem 0
margin: 6px 0
padding: .12em .4em .12em 1.4em
&:before

View File

@@ -7,7 +7,7 @@
display: flex
flex: 1 auto
margin: 0 auto
padding: 2rem 15px
padding: 40px 15px
max-width: 1200px
width: 100%
@@ -15,23 +15,18 @@
flex-direction: column
+maxWidth768()
padding: 1rem 5px
padding: 20px 5px
+minWidth2000()
max-width: 1500px
& > div:first-child:not(.recent-posts)
@extend .cardHover
align-self: flex-start
padding: 50px 40px
border-radius: 8px
background: var(--card-bg)
box-shadow: var(--card-box-shadow)
&:hover
box-shadow: var(--card-hover-box-shadow)
+maxWidth768()
padding: 1.8rem .7rem !important
padding: 36px 14px
& > div:first-child
width: 75%
@@ -53,3 +48,11 @@
& > div
width: 100% !important
// for apple device
.apple
#page-header.full_page
background-attachment: scroll !important
.recent-post-item
transform: translateZ(0)

View File

@@ -1,8 +1,5 @@
#article-container
.flink
.flink-desc
margin: .2rem 0 .5rem
.flink-list
overflow: auto
padding: 10px 10px 0

View File

@@ -1,48 +1,23 @@
#recent-posts
& > .recent-post-item:not(:first-child)
margin-top: 1rem
margin-top: 20px
& > .recent-post-item
@extend .cardHover
display: flex
flex-direction: row
align-items: center
overflow: hidden
height: 20em
border-radius: 12px 8px 8px 12px
background: var(--card-bg)
box-shadow: var(--card-box-shadow)
transition: all .3s
+maxWidth768()
border-radius: 12px 12px 8px 8px
flex-direction: column
height: auto
&:hover
box-shadow: var(--card-hover-box-shadow)
img.post_bg
transform: scale(1.1)
if hexo-config('cover.position') == 'both'
.left_radius
border-radius: 8px 0 0 8px
.right_radius
order: 2
border-radius: 0 8px 8px 0
else if hexo-config('cover.position') == 'left'
.left_radius
border-radius: 8px 0 0 8px
.right_radius
border-radius: 8px 0 0 8px
else if hexo-config('cover.position') == 'right'
.left_radius
order: 2
border-radius: 0 8px 8px 0
.right_radius
order: 2
border-radius: 0 8px 8px 0
&.ads-wrap
display: block !important
height: auto !important
@@ -51,7 +26,10 @@
overflow: hidden
width: 45%
height: 100%
-webkit-mask-image: -webkit-radial-gradient(white, black)
+maxWidth768()
width: 100%
height: 230px
img.post_bg
width: 100%
@@ -59,31 +37,42 @@
transition: all .6s
object-fit: cover
&:hover
transform: scale(1.1)
&.right
order: 1
+maxWidth768()
order: 0
& >.recent-post-info
display: inline-block
overflow: hidden
padding: 0 40px
width: 55%
+maxWidth768()
padding: 20px 20px 30px
width: 100%
&.no-cover
width: 100%
+maxWidth768()
padding: 30px 20px
& > .article-title
@extend .limit-more-line
margin-bottom: .3rem
color: var(--text-highlight-color)
font-size: 1.72em
line-height: 1.4
transition: all .2s ease-in-out
-webkit-line-clamp: 2
+maxWidth768()
font-size: 1.43em
&:hover
color: $text-hover
& > .article-meta-wrap
margin: 6px 0
color: $theme-meta-color
font-size: 90%
@@ -94,22 +83,22 @@
color: $sticky-color
i
margin: 0 .2rem 0 0
margin: 0 4px 0 0
.article-meta-label
if hexo-config('post_meta.page.label')
padding-right: .2rem
padding-right: 4px
else
display: none
.article-meta__separator
margin: 0 .3rem
margin: 0 6px
.article-meta__link
margin: 0 .2rem
margin: 0 4px
.fa-angle-right
margin: 0 .2rem
margin: 0 4px
if hexo-config('post_meta.page.date_format') == 'relative'
time
@@ -124,31 +113,4 @@
& > .content
@extend .limit-more-line
margin-top: .3rem
-webkit-line-clamp: 3
+maxWidth768()
#recent-posts
.recent-post-item
flex-direction: column
height: auto !important
.post_cover
order: 1 !important
width: 100%
height: 230px
border-radius: 8px 8px 0 0
.recent-post-info
order: 2 !important
padding: 1rem 1rem 1.5rem
width: 100%
&.no-cover
padding: 1.5rem 1rem
.article-title
font-size: 1.43em
.content
height: auto
-webkit-line-clamp: 3

View File

@@ -2,7 +2,7 @@
&-list
a
display: inline-block
padding: 0 .4rem
padding: 0 8px
transition: all .3s
&:hover