biss/hexo-theme-butterfly
1
0
Fork 0
mirror of https://github.com/jerryc127/hexo-theme-butterfly.git synced 2026-04-08 12:07:06 +08:00
Code Issues Packages Projects Releases Wiki Activity

🏷️ 更新2.3.5 更新內容查看 https://github.com/jerryc127/hexo-theme-butterfly/releases/tag/2.3.5

Browse Source
This commit is contained in:
Jerry
2020-05-01 18:58:09 +08:00
parent e8a47d040a
commit a0655a37c8
23 changed files with 189 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@@ -1,6 +1,6 @@
# hexo-theme-butterfly
<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.3.0-blue"/></a>
<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.3.5-blue"/></a>
<a href="https://jerryc.me"><img alt="Author" src="https://img.shields.io/badge/author-JerryC-blur"/></a>
<a href="https://hexo.io"><img alt="Hexo" src="https://img.shields.io/badge/hexo-4.0+-0e83c"/></a>
<a href="https://nodejs.org/"><img alt="node.js" src="https://img.shields.io/badge/node.js-8.0+-blur"/></a>

2
README_CN.md
View File

@@ -1,6 +1,6 @@
# hexo-theme-butterfly
<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.3.0-blue"/></a>
<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.3.5-blue"/></a>
<a href="https://jerryc.me"><img alt="Author" src="https://img.shields.io/badge/author-JerryC-blur"/></a>
<a href="https://hexo.io"><img alt="Hexo" src="https://img.shields.io/badge/hexo-4.0+-0e83c"/></a>
<a href="https://nodejs.org/"><img alt="node.js" src="https://img.shields.io/badge/node.js-8.0+-blur"/></a>

26
_config.yml
View File

@@ -15,10 +15,6 @@ menu:
- Music || /music/ || fa fa-music
- Movie || /movies/ || fa fa-film
# Favicon
# ---------------
favicon: /img/favicon.ico
# PWA
# See https://github.com/JLHwung/hexo-offline
# ---------------
@@ -104,6 +100,10 @@ mermaid:
# built-in themes: default/forest/dark/neutral
theme: default
# Favicon
# ---------------
favicon: /img/favicon.png
# Post info settings
# ---------------
avatar:
@@ -114,7 +114,7 @@ avatar:
index_img:
# if the banner of page not setting,it will show the top_img
default_top_img: /img/index.jpg
default_top_img: https://i.loli.net/2020/05/01/IuWi8QbHvzjlOPw.jpg
# the banner image of archive page
archive_img:
@@ -144,7 +144,7 @@ cover:
position: both
# 當沒有設置cover時，默認的封面顯示
default_cover:
- /img/post.jpg
- https://i.loli.net/2020/05/01/gkihqEjXxJ5UZ1C.jpg
# if the photo link cannot connect,it will show that
lodding_bg:
@@ -271,7 +271,7 @@ valine:
emojiCDN: # emoji CDN
enableQQ: false # enable the Nickname box to automatically get QQ Nickname and QQ Avatar
requiredFields: nick,mail # required fields nick/mail/link
bg: /img/comment_bg.png # valine background
bg: # valine background
count: false # dispaly comment count in top_img
# utterances
@@ -375,6 +375,10 @@ related_post:
# 圖片描述文字
photofigcaption: false
# anchor
# when you scroll in post, the url will update according to header id.
anchor: false
#### 美化/效果 ####
#--------------------------------
@@ -478,6 +482,7 @@ display_mode: light
# 美化頁面顯示
beautify:
enable: false
field: post # site/post
title-prefix-icon: '\f0c1'
title-prefix-icon-color: '#F47466'
@@ -662,9 +667,8 @@ note:
light_bg_offset: 0
# 圖片懶加載
# https://github.com/aFarkas/lazysizes
lazyload:
enable: true
# https://github.com/ApoorvSaxena/lozad.js
lazyload: false
# 避免重複網址分散seo
canonical: true
@@ -735,7 +739,7 @@ CDN:
canvas_ribbon_piao: /js/third-party/piao.js
canvas_nest: /js/third-party/canvas-nest.js
lazyload: https://cdn.jsdelivr.net/npm/lazysizes@latest/lazysizes.min.js
lazyload: https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js
instantpage: https://cdn.jsdelivr.net/npm/instant.page@latest/instantpage.min.js
typed: https://cdn.jsdelivr.net/npm/typed.js
js_cookies: https://cdn.jsdelivr.net/npm/js-cookie/dist/js.cookie.min.js

4
layout/flink.pug
View File

@@ -8,8 +8,8 @@
each item in i.link_list
.md-links-item
a(href=url_for(item.link) title=item.name target="_blank")
if theme.lazyload.enable
img.lazyload(data-src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.lodding_bg.flink) + `'` alt=item.name )
if theme.lazyload
img(data-src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.lodding_bg.flink) + `'` alt=item.name )
else
img(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.lodding_bg.flink) + `'` alt=item.name )
.md-links-title= item.name

4
layout/includes/additional-js.pug
View File

@@ -42,8 +42,8 @@ if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
if theme.instantpage.enable
script(src=url_for(theme.CDN.instantpage) type="module")
if theme.lazyload.enable
script(src=url_for(theme.CDN.lazyload) async="")
if theme.lazyload
script(src=url_for(theme.CDN.lazyload))
//- 鼠標特效
if theme.click_heart && theme.click_heart.enable

4
layout/includes/head/config.pug
View File

@@ -102,7 +102,9 @@ script.
highlightLang: !{theme.highlight_lang},
highlightShrink: '!{theme.highlight_shrink}',
isFontAwesomeV5: !{theme.fontawesome_v5 && theme.fontawesome_v5.enable},
isPhotoFigcaption: !{theme.photofigcaption}
isPhotoFigcaption: !{theme.photofigcaption},
islazyload: !{theme.lazyload},
isanchor: !{theme.anchor}
}

4
layout/includes/mixins/post-ui.pug
View File

@@ -9,8 +9,8 @@ mixin postUI(posts)
if post_cover && theme.cover.index_enable
.post_cover(class=leftOrRight)
a(href=url_for(link) title=title)
if theme.lazyload.enable
img.post_bg.lazyload(data-src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'` alt=title)
if theme.lazyload
img.post_bg(data-src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'` alt=title)
else
img.post_bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'` alt=title)
.recent-post-info(class=no_cover)

8
layout/includes/pagination.pug
View File

@@ -17,8 +17,8 @@ else
.prev-post(class=hasPageNext)
- var pagination_cover = page.prev.cover === false ? page.prev.randomcover : page.prev.cover
a(href=url_for(page.prev.path))
if theme.lazyload.enable
img.prev_cover.lazyload(data-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.lodding_bg.post_page)}'` )
if theme.lazyload
img.prev_cover(data-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.lodding_bg.post_page)}'` )
else
img.prev_cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.lodding_bg.post_page)}'` )
.pagination-info
@@ -30,8 +30,8 @@ else
- var pagination_cover = page.next.cover == false ? page.next.randomcover : page.next.cover
.next-post(class=hasPagePrev)
a(href=url_for(page.next.path))
if theme.lazyload.enable
img.next_cover.lazyload(data-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.lodding_bg.post_page)}'`)
if theme.lazyload
img.next_cover(data-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.lodding_bg.post_page)}'`)
else
img.next_cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.lodding_bg.post_page)}'`)
.pagination-info

2
layout/includes/post/reward.pug
View File

@@ -6,6 +6,6 @@
ul.reward-all
each item in theme.reward.QR_code
li.reward-item
img.lazyload.post-qr-code__img(src=url_for((item.itemlist||item).img) alt=(item.itemlist||item).text)
img.post-qr-code__img(src=url_for((item.itemlist||item).img) alt=(item.itemlist||item).text)
.post-qr-code__desc=(item.itemlist||item).text

4
layout/includes/widget/card_recent_post.pug
View File

@@ -15,8 +15,8 @@
a(href=url_for(link))
if post_cover && theme.cover.aside_enable
.aside-post-cover
if theme.lazyload.enable
img.aside-post-bg.lazyload(data-src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'` title=title alt=title)
if theme.lazyload
img.aside-post-bg(data-src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'` title=title alt=title)
else
img.aside-post-bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'` title=title alt=title)
.aside-post-title(class=no_cover)

2
layout/post.pug
View File

@@ -2,7 +2,7 @@ extends includes/layout.pug
block content
article#post(class="")
#article-container!=page.content
#article-container.post-content!=page.content
include includes/post/post-copyright.pug
.tag_share
if (theme.post_meta.post.tags)

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "hexo-theme-butterfly",
"version": "2.3.0",
"version": "2.3.5",
"private": true,
"engines": {
"node": ">=8.10.0"

25
scripts/filters/post_lazyload.js
View File

@@ -2,36 +2,19 @@
* Butterfly
* lazyload
* replace src to data-src
* add class 'lazyload'
*/
'use strict'
const url_for = require('hexo-util').url_for.bind(hexo)
const urlFor = require('hexo-util').url_for.bind(hexo)
function lazyProcess (htmlContent) {
var bg = url_for(hexo.theme.config.lodding_bg.post)
return htmlContent.replace(
/<img(.*?)src="(.*?)"(.*?)>/gi,
(str, p1, p2, p3) => {
if (/data-src/gi.test(str)) {
return str
}
if (/class="(.*?)"/gi.test(str)) {
str = str.replace(/class="(.*?)"/gi, (classStr, p1) => {
return classStr.replace(p1, `${p1} lazyload`)
})
str = str.replace(p2, `${bg}`)
return str.replace('>', ` data-src="${p2}">`)
}
str = str.replace(p2, `${bg}`)
return str.replace(p3, ` class="lazyload" data-src="${p2}" ${p3}`)
}
)
var bg = hexo.theme.config.lodding_bg.post ? urlFor(hexo.theme.config.lodding_bg.post) : 'data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs='
return htmlContent.replace(/(<img .*?src=)/ig, `$1 ${bg} data-src=`)
}
var processPost = function (data) {
if (!hexo.theme.config.lazyload.enable) return
if (!hexo.theme.config.lazyload) return
data.content = lazyProcess.call(this, data.content)
return data
}

7
scripts/helpers/related_post.js
View File

@@ -41,8 +41,7 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
var limitNum = config.related_post.limit || 6
var dateType = config.related_post.date_type || 'created'
var headlineLang = this._p('post.recommend')
var lazySrc = config.lazyload.enable ? 'data-src' : 'src'
var lazyClass = config.lazyload.enable ? 'lazyload' : ''
var lazySrc = config.lazyload ? 'data-src' : 'src'
relatedPosts = relatedPosts.sort(compare('weight'))
@@ -68,9 +67,7 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
relatedPosts[i].title +
'">'
result +=
'<img class="relatedPosts_cover ' +
lazyClass +
'"' +
'<img class="relatedPosts_cover" ' +
lazySrc +
'="' +
cover +

254
source/css/_layout/post.styl
View File

@@ -1,147 +1,157 @@
#article-container
if hexo-config('beautify.enable')
headStyle(fontsize)
padding-left: unit(fontsize + .4, 'rem')
beautify()
headStyle(fontsize)
padding-left: unit(fontsize + .4, 'rem')
code
font-size: unit(fontsize, 'rem')
code
font-size: unit(fontsize, 'rem')
&:before
margin-left: unit((-(fontsize + .2)), 'rem')
font-size: unit(fontsize, 'rem')
&:hover
padding-left: unit(fontsize + .6, 'rem')
h1,
h2,
h3,
h4,
h5,
h6
cursor: pointer
transition: all .2s ease-out
&:before
position: absolute
top: calc(50% - .35rem)
color: $title-prefix-icon-color
content: $title-prefix-icon
font-style: normal
font-variant: normal
line-height: 1
transition: all .2s ease-out
text-rendering: auto
-webkit-font-smoothing: antialiased
if hexo-config('fontawesome_v5') && hexo-config('fontawesome_v5.enable')
font-weight: 600
font-family: 'Font Awesome 5 Free'
else
font-weight: normal
font-family: FontAwesome
&:hover
&:before
margin-left: unit((-(fontsize + .2)), 'rem')
font-size: unit(fontsize, 'rem')
color: $light-blue
h1
headStyle(1)
h2
headStyle(.9)
h3
headStyle(.8)
h4
headStyle(.7)
h5
headStyle(.6)
h6
headStyle(.6)
ol,
ul
margin-top: .4rem
padding: 0 0 0 .8rem
list-style: none
counter-reset: li
p
margin: 0 0 .5rem
ol,
ul
padding-left: .5rem
li
position: relative
margin: .2rem 0
padding: .1rem .5rem .1rem 1.5rem
&:hover
padding-left: unit(fontsize + .6, 'rem')
h1,
h2,
h3,
h4,
h5,
h6
cursor: pointer
transition: all .2s ease-out
&:before
transform: rotate(360deg)
&:before
position: absolute
top: calc(50% - .35rem)
color: $title-prefix-icon-color
content: $title-prefix-icon
font-style: normal
font-variant: normal
line-height: 1
transition: all .2s ease-out
text-rendering: auto
-webkit-font-smoothing: antialiased
top: 0
left: 0
background: $light-blue
color: $card-bg
cursor: pointer
transition: all .3s ease-out
if hexo-config('fontawesome_v5') && hexo-config('fontawesome_v5.enable')
font-weight: 600
font-family: 'Font Awesome 5 Free'
else
font-weight: normal
font-family: FontAwesome
ol
> li
&:before
margin-top: .2rem
width: w = 1.2rem
height: h = w
border-radius: .5 * w
content: counter(li)
counter-increment: li
text-align: center
font-size: .6rem
line-height: h
ul
> li
&:hover
&:before
color: $light-blue
border-color: $theme-button-hover-color
h1
headStyle(1)
&:before
$w = .3rem
top: 10px
margin-left: .45rem
width: w = $w
height: h = w
border: .5 * w solid $light-blue
border-radius: w
background: transparent
content: ''
line-height: h
h2
headStyle(.9)
no-beautify()
ol,
ul
margin-top: .4rem
h3
headStyle(.8)
h4
headStyle(.7)
h5
headStyle(.6)
h6
headStyle(.6)
p
margin: 0 0 .5rem
ol,
ul
margin-top: .4rem
padding: 0 0 0 .8rem
list-style: none
counter-reset: li
padding-left: .5rem
p
margin: 0 0 .5rem
li
position: relative
margin: .3rem 0
padding-left: .3rem
ol,
ul
padding-left: .5rem
#article-container
if hexo-config('beautify.enable') && hexo-config('beautify.field') == 'site'
beautify()
else if hexo-config('beautify.enable') && hexo-config('beautify.field') == 'post'
no-beautify()
li
position: relative
margin: .2rem 0
padding: .1rem .5rem .1rem 1.5rem
&:hover
&:before
transform: rotate(360deg)
&:before
position: absolute
top: 0
left: 0
background: $light-blue
color: $card-bg
cursor: pointer
transition: all .3s ease-out
ol
> li
&:before
margin-top: .2rem
width: w = 1.2rem
height: h = w
border-radius: .5 * w
content: counter(li)
counter-increment: li
text-align: center
font-size: .6rem
line-height: h
ul
> li
&:hover
&:before
border-color: $theme-button-hover-color
&:before
$w = .3rem
top: 10px
margin-left: .45rem
width: w = $w
height: h = w
border: .5 * w solid $light-blue
border-radius: w
background: transparent
content: ''
line-height: h
&.post-content
beautify()
else
ol,
ul
margin-top: .4rem
counter-reset: li
p
margin: 0 0 .5rem
ol,
ul
padding-left: .5rem
li
position: relative
margin: .3rem 0
padding-left: .3rem
no-beautify()
a
color: $a-link-color

BIN
source/img/avatar.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 76 KiB

BIN
source/img/comment_bg.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 6.0 KiB

BIN
source/img/favicon.ico
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 15 KiB

BIN
source/img/favicon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 323 B

BIN
source/img/index.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 247 KiB

BIN
source/img/post.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 52 KiB

1
source/img/post_loadding.svg
View File

@@ -1 +0,0 @@
<svg width="200px" height="200px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="lds-pacman" style="background: none;"><g ng-attr-style="display:{{config.showBean}}" style="display:block"><circle cx="74.5405" cy="50" r="4" ng-attr-fill="{{config.c2}}" fill="#a3d9ef"><animate attributeName="cx" calcMode="linear" values="95;35" keyTimes="0;1" dur="0.8" begin="-0.536s" repeatCount="indefinite"></animate><animate attributeName="fill-opacity" calcMode="linear" values="0;1;1" keyTimes="0;0.2;1" dur="0.8" begin="-0.536s" repeatCount="indefinite"></animate></circle><circle cx="94.9405" cy="50" r="4" ng-attr-fill="{{config.c2}}" fill="#a3d9ef"><animate attributeName="cx" calcMode="linear" values="95;35" keyTimes="0;1" dur="0.8" begin="-0.264s" repeatCount="indefinite"></animate><animate attributeName="fill-opacity" calcMode="linear" values="0;1;1" keyTimes="0;0.2;1" dur="0.8" begin="-0.264s" repeatCount="indefinite"></animate></circle><circle cx="54.7405" cy="50" r="4" ng-attr-fill="{{config.c2}}" fill="#a3d9ef"><animate attributeName="cx" calcMode="linear" values="95;35" keyTimes="0;1" dur="0.8" begin="0s" repeatCount="indefinite"></animate><animate attributeName="fill-opacity" calcMode="linear" values="0;1;1" keyTimes="0;0.2;1" dur="0.8" begin="0s" repeatCount="indefinite"></animate></circle></g><g ng-attr-transform="translate({{config.showBeanOffset}} 0)" transform="translate(-15 0)"><path d="M50 50L20 50A30 30 0 0 0 80 50Z" ng-attr-fill="{{config.c1}}" fill="#82bbe4" transform="rotate(29.6108 50 50)"><animateTransform attributeName="transform" type="rotate" calcMode="linear" values="0 50 50;45 50 50;0 50 50" keyTimes="0;0.5;1" dur="0.8s" begin="0s" repeatCount="indefinite"></animateTransform></path><path d="M50 50L20 50A30 30 0 0 1 80 50Z" ng-attr-fill="{{config.c1}}" fill="#82bbe4" transform="rotate(-29.6108 50 50)"><animateTransform attributeName="transform" type="rotate" calcMode="linear" values="0 50 50;-45 50 50;0 50 50" keyTimes="0;0.5;1" dur="0.8s" begin="0s" repeatCount="indefinite"></animateTransform></path></g></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.1 KiB

27
source/js/main.js
View File

@@ -445,6 +445,13 @@ $(function () {
})
}
/**
* lazyload
*/
if (GLOBAL_CONFIG.islazyload) {
window.lozad('img').observe()
}
/**
* 滾動處理
*/
@@ -532,11 +539,13 @@ $(function () {
}, 100)
}
// function updateAnchor (anchor) {
// if (window.history.replaceState && anchor !== window.location.hash) {
// window.history.replaceState(null, null, anchor)
// }
// }
// anchor
var isanchor = GLOBAL_CONFIG.isanchor
var updateAnchor = function (anchor) {
if (window.history.replaceState && anchor !== window.location.hash) {
window.history.replaceState(undefined, undefined, anchor)
}
}
// find head position & add active class
// DOM Hierarchy:
@@ -565,7 +574,7 @@ $(function () {
var currentActive = $('.toc-link.active')
if (currentId && currentActive.attr('href') !== currentId) {
// updateAnchor(currentId)
if (isanchor) updateAnchor(currentId)
$('.toc-link').removeClass('active')
@@ -711,11 +720,7 @@ $(function () {
$darkModeButtom.click(function () {
switchReadMode()
try {
utterancesTheme()
} catch (e) {
return false
}
if (typeof utterancesTheme === 'function') utterancesTheme()
})
/**