breaking changes: widget 寫法更改/可添加非sticky區域widget

feat: 升級facebook comment js 到 v10
fix: 修復當內容過少時, footer 沒有底部靠攏的bug
improvement: 404頁面不再顯示 rightside
This commit is contained in:
Jerry 2021-05-21 16:15:25 +08:00
parent 9e6958f25b
commit de4037106b
12 changed files with 116 additions and 94 deletions

View File

@ -1,7 +1,7 @@
- var top_img = theme.error_404.background || theme.default_top_img
- var bg_img = `background-image: url('${url_for(top_img)}')`
#body-wrap.error
#body-wrap.error404
div(style='display: none')
include ./header/index.pug

View File

@ -7,7 +7,7 @@ script.
if (typeof FB === 'object') FB.XFBML.parse()
else {
let ele = document.createElement('script')
ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v9.0')
ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v10.0')
ele.setAttribute('async', 'true')
ele.setAttribute('defer', 'true')
ele.setAttribute('crossorigin', 'anonymous')

View File

@ -13,7 +13,7 @@ script.
emojiCDN: '#{theme.waline.emojiCDN}',
emojiMaps: !{emojiMaps},
visitor: #{theme.waline.visitor},
dark: '[data-theme="dark"]'
dark: 'html[data-theme="dark"]'
}, !{JSON.stringify(theme.waline.option)}))
}

View File

@ -1,5 +1,5 @@
if site.data.widget
each item in site.data.widget
if site.data.widget && site.data.widget.bottom
each item in site.data.widget.bottom
.card-widget(class=item.class_name id=item.id_name style=item.order ? `order: ${item.order}` : '')
.item-headline
i(class=item.icon)

View File

@ -0,0 +1,8 @@
if site.data.widget && site.data.widget.top
each item in site.data.widget.top
.card-widget(class=item.class_name id=item.id_name)
.item-headline
i(class=item.icon)
span=item.name
.item-content
!=item.html

View File

@ -7,6 +7,7 @@
else
!=partial('includes/widget/card_author', {}, {cache: true})
!=partial('includes/widget/card_announcement', {}, {cache: true})
!=partial('includes/widget/card_top_self', {}, {cache: true})
.sticky_layout
if showToc
include ./card_post_toc.pug
@ -16,6 +17,8 @@
//- page
!=partial('includes/widget/card_author', {}, {cache: true})
!=partial('includes/widget/card_announcement', {}, {cache: true})
!=partial('includes/widget/card_top_self', {}, {cache: true})
.sticky_layout
!=partial('includes/widget/card_recent_post', {}, {cache: true})
!=partial('includes/widget/card_ad', {}, {cache: true})
@ -24,4 +27,4 @@
!=partial('includes/widget/card_tags', {}, {cache: true})
!=partial('includes/widget/card_archives', {}, {cache: true})
!=partial('includes/widget/card_webinfo', {}, {cache: true})
!=partial('includes/widget/card_self', {}, {cache: true})
!=partial('includes/widget/card_bottom_self', {}, {cache: true})

View File

@ -1,6 +1,6 @@
{
"name": "hexo-theme-butterfly",
"version": "3.7.7",
"version": "3.8.0-b1",
"description": "A Simple and Card UI Design theme for Hexo",
"main": "package.json",
"scripts": {

View File

@ -1,82 +0,0 @@
if hexo-config('error_404.enable')
#error-wrap
position: absolute
top: 50%
right: 0
left: 0
margin: 0 auto
padding: 0 1rem
max-width: 1000px
transform: translate(0, -50%)
.error-content
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)
+maxWidth768()
flex-direction: column
margin: 0
height: 25rem
.error-img
flex: 1
height: 100%
border-top-left-radius: 8px
border-bottom-left-radius: 8px
background-color: $theme-color
background-position: center
background-size: cover
+maxWidth768()
flex: 1
width: 100%
border-top-right-radius: 8px
border-bottom-left-radius: 0
.error-info
flex: 1
padding: .5rem
text-align: center
font-size: 14px
if $site-name-font
font-family: $site-name-font
+maxWidth768()
flex: 1.1
width: 100%
.error_title
margin-top: -4rem
font-size: 9em
+maxWidth768()
margin-top: -3rem
.error_subtitle
@extend .limit-more-line
margin-top: -3.5rem
word-break: break-word
font-size: 1.6em
-webkit-line-clamp: 2
a
display: inline-block
margin-top: .5rem
padding: .3rem 1.5rem
background: var(--btn-bg)
color: var(--btn-color)
i
padding-right: .3rem

View File

@ -9,7 +9,7 @@
// index
&.full_page
height: $index_top_img_height
min-height: $index_top_img_height
background-attachment: fixed
#site-info
@ -70,7 +70,7 @@
// page
&.not-home-page
height: 20rem
min-height: 20rem
+maxWidth768()
height: 14rem
@ -86,7 +86,7 @@
// post
&.post-bg
height: 20rem
min-height: 20rem
+maxWidth768()
height: 18rem
@ -118,7 +118,7 @@
&.not-top-img
margin-bottom: .5rem
height: 60px
min-height: 60px
background: 0
#nav

86
source/css/_page/404.styl Normal file
View File

@ -0,0 +1,86 @@
if hexo-config('error_404.enable')
.error404
#error-wrap
position: absolute
top: 50%
right: 0
left: 0
margin: 0 auto
padding: 0 1rem
max-width: 1000px
transform: translate(0, -50%)
.error-content
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)
+maxWidth768()
flex-direction: column
margin: 0
height: 25rem
.error-img
flex: 1
height: 100%
border-top-left-radius: 8px
border-bottom-left-radius: 8px
background-color: $theme-color
background-position: center
background-size: cover
+maxWidth768()
flex: 1
width: 100%
border-top-right-radius: 8px
border-bottom-left-radius: 0
.error-info
flex: 1
padding: .5rem
text-align: center
font-size: 14px
if $site-name-font
font-family: $site-name-font
+maxWidth768()
flex: 1.1
width: 100%
.error_title
margin-top: -4rem
font-size: 9em
+maxWidth768()
margin-top: -3rem
.error_subtitle
@extend .limit-more-line
margin-top: -3.5rem
word-break: break-word
font-size: 1.6em
-webkit-line-clamp: 2
a
display: inline-block
margin-top: .5rem
padding: .3rem 1.5rem
background: var(--btn-bg)
color: var(--btn-color)
i
padding-right: .3rem
& + #rightside
display: none

View File

@ -1,8 +1,15 @@
#body-wrap
display: flex
flex-direction: column
height: 100vh
.layout
display: flex
flex: 1 auto
margin: 0 auto
padding: 2rem 15px
max-width: 1200px
width: 100%
+maxWidth900()
flex-direction: column

View File

@ -33,7 +33,7 @@ $font-color = #1F2D3D
$rem = 20px
$text-line-height = 2
$web-bg = hexo-config('background') && unquote(hexo-config('background'))
$index_top_img_height = hexo-config('index_top_img_height') ? convert(hexo-config('index_top_img_height')) : 100vh
$index_top_img_height = hexo-config('index_top_img_height') ? convert(hexo-config('index_top_img_height')) : 100%
$index_site_info_top = hexo-config('index_site_info_top') ? convert(hexo-config('index_site_info_top')) : 43%
// Global color & SVG
$light-blue = $theme-color