From ecf4d341e6524d97bfda2bb2429b0489a102551f Mon Sep 17 00:00:00 2001
From: GZTime <Time.GZ@outlook.com>
Date: Wed, 16 Nov 2022 03:36:24 +0800
Subject: [PATCH 1/9] fix: `TypeError: require(...) is not a function`

---
 scripts/events/init.js    |  2 +-
 scripts/events/welcome.js | 16 ++++++++--------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/scripts/events/init.js b/scripts/events/init.js
index 69c2807..99f85e7 100644
--- a/scripts/events/init.js
+++ b/scripts/events/init.js
@@ -1,4 +1,4 @@
-const logger = require('hexo-log')()
+const logger = hexo.log;
 
 hexo.extend.filter.register('before_generate', () => {
   // Get first two digits of the Hexo version number
diff --git a/scripts/events/welcome.js b/scripts/events/welcome.js
index 77eb662..6952f3c 100644
--- a/scripts/events/welcome.js
+++ b/scripts/events/welcome.js
@@ -1,16 +1,16 @@
-const logger = require('hexo-log')()
+const logger = hexo.log;
 
 hexo.on('ready', () => {
   const { version } = require('../../package.json')
   logger.info(`
   ===================================================================
-                                                                     
-      #####  #    # ##### ##### ###### #####  ###### #      #   #    
-      #    # #    #   #     #   #      #    # #      #       # #     
-      #####  #    #   #     #   #####  #    # #####  #        #     
-      #    # #    #   #     #   #      #####  #      #        #      
-      #    # #    #   #     #   #      #   #  #      #        #    
-      #####   ####    #     #   ###### #    # #      ######   #  
+
+      #####  #    # ##### ##### ###### #####  ###### #      #   #
+      #    # #    #   #     #   #      #    # #      #       # #
+      #####  #    #   #     #   #####  #    # #####  #        #
+      #    # #    #   #     #   #      #####  #      #        #
+      #    # #    #   #     #   #      #   #  #      #        #
+      #####   ####    #     #   ###### #    # #      ######   #
 
                             ${version}
   ===================================================================`)

From 4bd5edd955b11654ec8220774c9bc25c37cfbf16 Mon Sep 17 00:00:00 2001
From: GZTime <Time.GZ@outlook.com>
Date: Wed, 16 Nov 2022 03:45:54 +0800
Subject: [PATCH 2/9] chore: remove semicolons

---
 scripts/events/init.js    | 2 +-
 scripts/events/welcome.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/events/init.js b/scripts/events/init.js
index 99f85e7..20e9fab 100644
--- a/scripts/events/init.js
+++ b/scripts/events/init.js
@@ -1,4 +1,4 @@
-const logger = hexo.log;
+const logger = hexo.log
 
 hexo.extend.filter.register('before_generate', () => {
   // Get first two digits of the Hexo version number
diff --git a/scripts/events/welcome.js b/scripts/events/welcome.js
index 6952f3c..161516a 100644
--- a/scripts/events/welcome.js
+++ b/scripts/events/welcome.js
@@ -1,4 +1,4 @@
-const logger = hexo.log;
+const logger = hexo.log
 
 hexo.on('ready', () => {
   const { version } = require('../../package.json')

From f07823903f64af0d5509daa203c0460fa757d570 Mon Sep 17 00:00:00 2001
From: Jerry Wong <hwy0127@gmail.com>
Date: Fri, 18 Nov 2022 13:32:03 +0800
Subject: [PATCH 3/9] Update init.js

---
 scripts/events/init.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/scripts/events/init.js b/scripts/events/init.js
index 20e9fab..9c1bfe8 100644
--- a/scripts/events/init.js
+++ b/scripts/events/init.js
@@ -1,8 +1,7 @@
-const logger = hexo.log
-
 hexo.extend.filter.register('before_generate', () => {
   // Get first two digits of the Hexo version number
   const hexoVer = hexo.version.replace(/(^.*\..*)\..*/, '$1')
+  const logger = hexo.log
 
   if (hexoVer < 5.3) {
     logger.error('Please update Hexo to V5.3.0 or higher!')

From eb88a5bb4a4159c7be6ea7264e93ec276f7d4a4b Mon Sep 17 00:00:00 2001
From: Jerry Wong <hwy0127@gmail.com>
Date: Fri, 18 Nov 2022 13:32:35 +0800
Subject: [PATCH 4/9] Update welcome.js

---
 scripts/events/welcome.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/scripts/events/welcome.js b/scripts/events/welcome.js
index 161516a..2655d05 100644
--- a/scripts/events/welcome.js
+++ b/scripts/events/welcome.js
@@ -1,8 +1,6 @@
-const logger = hexo.log
-
 hexo.on('ready', () => {
   const { version } = require('../../package.json')
-  logger.info(`
+  hexo.log.info(`
   ===================================================================
 
       #####  #    # ##### ##### ###### #####  ###### #      #   #

From f218a0a14aaa4d02affe05ddd009506e9edc3025 Mon Sep 17 00:00:00 2001
From: Jerry <hwy0127@gmail.com>
Date: Fri, 18 Nov 2022 18:30:25 +0800
Subject: [PATCH 5/9] =?UTF-8?q?breaking=20changes:=20=E7=A7=BB=E9=99=A4=20?=
 =?UTF-8?q?subtitle=20=E4=B8=80=E5=8F=A5=E7=B6=B2=E8=AA=BF=E7=94=A8?=
 =?UTF-8?q?=EF=BC=88api=20=E5=B7=B2=E5=A4=B1=E6=95=88)=20feat:=20=E5=8F=B3?=
 =?UTF-8?q?=E4=B8=8B=E8=A7=92=E6=8C=89=E9=88=95=E5=A2=9E=E5=8A=A0=E9=A0=90?=
 =?UTF-8?q?=E8=A6=BD=E9=80=B2=E5=BA=A6=E9=A1=AF=E7=A4=BA=20feat:=20toc?=
 =?UTF-8?q?=E5=8F=AF=E8=A8=AD=E7=BD=AE=E6=98=AF=E5=90=A6=E9=A1=AF=E7=A4=BA?=
 =?UTF-8?q?=E9=A0=90=E8=A6=BD=E9=80=B2=E5=BA=A6=20fix:=20=E4=BF=AE?=
 =?UTF-8?q?=E5=BE=A9=20TypeError:=20require(...)=20is=20not=20a=20function?=
 =?UTF-8?q?=20=E7=9A=84=E5=A0=B1=E9=8C=AF=20#1102=20improvement:=20?=
 =?UTF-8?q?=E6=97=A5=E6=9C=9F=E8=A8=AD=E7=BD=AE=E7=9B=B8=E5=B0=8D=E6=97=A5?=
 =?UTF-8?q?=E6=9C=9F=E6=99=82=EF=BC=8C=E6=96=87=E7=AB=A0=E7=9A=84=E6=97=A5?=
 =?UTF-8?q?=E6=9C=9F=E6=A0=BC=E5=BC=8F=E5=92=8C=E6=9C=80=E6=96=B0=E8=A9=95?=
 =?UTF-8?q?=E8=AB=96=E7=9A=84=E6=97=A5=E6=9C=9F=E6=A0=BC=E5=BC=8F=E7=B5=B1?=
 =?UTF-8?q?=E4=B8=80=E7=82=BA=20=E5=B9=B4=E6=9C=88=E6=97=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _config.yml                              | 11 +++---
 layout/includes/head/config.pug          |  6 +++-
 layout/includes/rightside.pug            |  1 +
 layout/includes/third-party/subtitle.pug | 32 -----------------
 package.json                             |  2 +-
 scripts/events/init.js                   |  7 ++--
 scripts/events/welcome.js                | 18 ++++------
 source/css/_layout/rightside.styl        | 19 ++++++++++
 source/js/main.js                        | 45 ++++++++++++++----------
 source/js/utils.js                       | 13 ++++++-
 10 files changed, 83 insertions(+), 71 deletions(-)

diff --git a/_config.yml b/_config.yml
index d0ba6de..bf08b04 100644
--- a/_config.yml
+++ b/_config.yml
@@ -185,6 +185,7 @@ toc:
   number: true
   expand: false
   style_simple: false # for post
+  scroll_percent: true
 
 post_copyright:
   enable: true
@@ -632,8 +633,7 @@ subtitle:
   # source 調用第三方服務
   # source: false 關閉調用
   # source: 1  調用一言網的一句話（簡體） https://hitokoto.cn/
-  # source: 2  調用一句網（簡體） http://yijuzhan.com/
-  # source: 3  調用今日詩詞（簡體） https://www.jinrishici.com/
+  # source: 2  調用今日詩詞（簡體） https://www.jinrishici.com/
   # subtitle 會先顯示 source , 再顯示 sub 的內容
   source: false
   # 如果關閉打字效果，subtitle 只會顯示 sub 的第一行文字
@@ -753,6 +753,9 @@ darkmode:
   # autoChangeMode: false
   autoChangeMode: false
 
+# show scroll percent in scroll-to-top button
+rightside_scroll_percent: false
+
 # Don't modify the following settings unless you know how they work (非必要請不要修改 )
 # Choose: readmode,translate,darkmode,hideAside,toc,chat,comment
 # Don't repeat 不要重複
@@ -894,7 +897,7 @@ CDN:
   # when set it to local, you need to install hexo-butterfly-extjs
   third_party_provider: jsdelivr
 
-  # Add version number to CDN, true or false  
+  # Add version number to CDN, true or false
   version: false
 
   # Custom format
@@ -952,4 +955,4 @@ CDN:
     # prismjs_lineNumber_js:
     # prismjs_autoloader:
     # artalk_js:
-    # artalk_css:
\ No newline at end of file
+    # artalk_css:
diff --git a/layout/includes/head/config.pug b/layout/includes/head/config.pug
index 5a8b8f5..ed81219 100644
--- a/layout/includes/head/config.pug
+++ b/layout/includes/head/config.pug
@@ -120,5 +120,9 @@ script.
     },
     isPhotoFigcaption: !{theme.photofigcaption},
     islazyload: !{theme.lazyload.enable},
-    isAnchor: !{theme.anchor.auto_update || false}
+    isAnchor: !{theme.anchor.auto_update || false},
+    percent: {
+      toc: !{theme.toc.scroll_percent},
+      rightside: !{theme.rightside_scroll_percent},
+    }
   }
diff --git a/layout/includes/rightside.pug b/layout/includes/rightside.pug
index 9696d0b..03c6aaa 100644
--- a/layout/includes/rightside.pug
+++ b/layout/includes/rightside.pug
@@ -57,4 +57,5 @@ mixin rightsideItem(array)
       +rightsideItem(showArray)
 
     button#go-up(type="button" title=_p("rightside.back_to_top"))
+      span.scroll-percent
       i.fas.fa-arrow-up
\ No newline at end of file
diff --git a/layout/includes/third-party/subtitle.pug b/layout/includes/third-party/subtitle.pug
index 9236757..a565a66 100644
--- a/layout/includes/third-party/subtitle.pug
+++ b/layout/includes/third-party/subtitle.pug
@@ -36,38 +36,6 @@ case source
       }
 
   when 2
-    script.
-      function subtitleType () {
-        getScript('https://yijuzhan.com/api/word.php?m=js').then(() => {
-          const con = str[0]
-          if (!{effect}) {
-            const from = '出自 ' + str[1]
-            const sub = !{JSON.stringify(subContent)}
-            sub.unshift(con, from)
-            window.typed = new Typed('#subtitle', {
-              strings: sub,
-              startDelay: !{startDelay},
-              typeSpeed: !{typeSpeed},
-              loop: !{loop},
-              backSpeed: !{backSpeed},
-            })
-          } else {
-            document.getElementById('subtitle').innerHTML = con
-          }
-        })
-      }
-
-      if (!{effect}) {
-        if (typeof Typed === 'function') {
-          subtitleType()
-        } else {
-          getScript('!{url_for(theme.asset.typed)}').then(subtitleType)
-        }
-      } else {
-        subtitleType()
-      }
-
-  when 3
     script.
       function subtitleType () {
         getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
diff --git a/package.json b/package.json
index 38882af..3dd25be 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "4.5.1",
+  "version": "4.6.0-b1",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {
diff --git a/scripts/events/init.js b/scripts/events/init.js
index 69c2807..1bd0570 100644
--- a/scripts/events/init.js
+++ b/scripts/events/init.js
@@ -1,8 +1,7 @@
-const logger = require('hexo-log')()
-
 hexo.extend.filter.register('before_generate', () => {
   // Get first two digits of the Hexo version number
   const hexoVer = hexo.version.replace(/(^.*\..*)\..*/, '$1')
+  const logger = hexo.log
 
   if (hexoVer < 5.3) {
     logger.error('Please update Hexo to V5.3.0 or higher!')
@@ -13,7 +12,9 @@ hexo.extend.filter.register('before_generate', () => {
   if (hexo.locals.get) {
     const data = hexo.locals.get('data')
     if (data && data.butterfly) {
-      logger.error(" 'butterfly.yml' is deprecated. Please use '_config.butterfly.yml' ")
+      logger.error(
+        " 'butterfly.yml' is deprecated. Please use '_config.butterfly.yml' "
+      )
       logger.error(" 'butterfly.yml' 已經棄用，請使用 '_config.butterfly.yml' ")
       process.exit(-1)
     }
diff --git a/scripts/events/welcome.js b/scripts/events/welcome.js
index 77eb662..f4c018a 100644
--- a/scripts/events/welcome.js
+++ b/scripts/events/welcome.js
@@ -1,17 +1,13 @@
-const logger = require('hexo-log')()
-
 hexo.on('ready', () => {
   const { version } = require('../../package.json')
-  logger.info(`
+  hexo.log.info(`
   ===================================================================
-                                                                     
-      #####  #    # ##### ##### ###### #####  ###### #      #   #    
-      #    # #    #   #     #   #      #    # #      #       # #     
-      #####  #    #   #     #   #####  #    # #####  #        #     
-      #    # #    #   #     #   #      #####  #      #        #      
-      #    # #    #   #     #   #      #   #  #      #        #    
-      #####   ####    #     #   ###### #    # #      ######   #  
-
+      #####  #    # ##### ##### ###### #####  ###### #      #   #
+      #    # #    #   #     #   #      #    # #      #       # #
+      #####  #    #   #     #   #####  #    # #####  #        #
+      #    # #    #   #     #   #      #####  #      #        #
+      #    # #    #   #     #   #      #   #  #      #        #
+      #####   ####    #     #   ###### #    # #      ######   #
                             ${version}
   ===================================================================`)
 })
diff --git a/source/css/_layout/rightside.styl b/source/css/_layout/rightside.styl
index 6daea56..0c25205 100644
--- a/source/css/_layout/rightside.styl
+++ b/source/css/_layout/rightside.styl
@@ -47,3 +47,22 @@
   +maxWidth900()
     #hide-aside-btn
       display: none
+
+  if hexo-config('rightside_scroll_percent')
+    #go-up
+      .scroll-percent
+        display: none
+
+      &.show-percent
+        .scroll-percent
+          display: block
+
+          & + i
+            display: none
+
+      &:hover
+        .scroll-percent
+          display: none
+
+          & + i
+            display: block
diff --git a/source/js/main.js b/source/js/main.js
index 2e29ac8..4c62fca 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -251,6 +251,21 @@ document.addEventListener('DOMContentLoaded', function () {
     getScript(`${GLOBAL_CONFIG.source.justifiedGallery.js}`).then(() => { btf.initJustifiedGallery(ele) })
   }
 
+  /**
+   * rightside scroll percent
+   */
+  const rightsideScrollPercent = currentTop => {
+    const perNum = btf.getScrollPercent(currentTop,document.body)
+    const $goUp = document.getElementById('go-up')
+    if ( perNum < 95 ) {
+      $goUp.classList.add('show-percent')
+      $goUp.querySelector('.scroll-percent').textContent = perNum
+    }
+    else {
+      $goUp.classList.remove('show-percent')
+    }
+  }
+
   /**
    * 滾動處理
    */
@@ -276,6 +291,7 @@ document.addEventListener('DOMContentLoaded', function () {
     const $header = document.getElementById('page-header')
     const isChatBtnHide = typeof chatBtnHide === 'function'
     const isChatBtnShow = typeof chatBtnShow === 'function'
+    const isShowPercent = GLOBAL_CONFIG.percent.rightside
 
     const scrollTask = btf.throttle(() => {
         const currentTop = window.scrollY || document.documentElement.scrollTop
@@ -305,9 +321,12 @@ document.addEventListener('DOMContentLoaded', function () {
           $rightside.style.cssText = "opacity: ''; transform: ''"
         }
 
+        isShowPercent && rightsideScrollPercent(currentTop)
+
         if (document.body.scrollHeight <= innerHeight) {
           $rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
         }
+
       }, 200)
     
     window.scrollCollect = scrollTask
@@ -325,26 +344,15 @@ document.addEventListener('DOMContentLoaded', function () {
 
     if (!($article && (isToc || isAnchor))) return
 
-    let $tocLink, $cardToc, scrollPercent, autoScrollToc, isExpand
+    let $tocLink, $cardToc, autoScrollToc, $tocPercentage, isExpand
 
     if (isToc) {
       const $cardTocLayout = document.getElementById('card-toc')
       $cardToc = $cardTocLayout.getElementsByClassName('toc-content')[0]
       $tocLink = $cardToc.querySelectorAll('.toc-link')
-      const $tocPercentage = $cardTocLayout.querySelector('.toc-percentage')
+      $tocPercentage = $cardTocLayout.querySelector('.toc-percentage')
       isExpand = $cardToc.classList.contains('is-expand')
 
-      scrollPercent = currentTop => {
-        const docHeight = $article.clientHeight
-        const winHeight = document.documentElement.clientHeight
-        const headerHeight = $article.offsetTop
-        const contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : (document.documentElement.scrollHeight - winHeight)
-        const scrollPercent = (currentTop - headerHeight) / (contentMath)
-        const scrollPercentRounded = Math.round(scrollPercent * 100)
-        const percentage = (scrollPercentRounded > 100) ? 100 : (scrollPercentRounded <= 0) ? 0 : scrollPercentRounded
-        $tocPercentage.textContent = percentage
-      }
-
       window.mobileToc = {
         open: () => {
           $cardTocLayout.style.cssText = 'animation: toc-open .3s; opacity: 1; right: 55px'
@@ -433,13 +441,14 @@ document.addEventListener('DOMContentLoaded', function () {
     }
 
     // main of scroll
-    window.tocScrollFn = function () {
-      return btf.throttle(function () {
+    window.tocScrollFn = btf.throttle(()=>{
         const currentTop = window.scrollY || document.documentElement.scrollTop
-        isToc && scrollPercent(currentTop)
+        if (isToc && GLOBAL_CONFIG.percent.toc) {
+          $tocPercentage.textContent = btf.getScrollPercent(currentTop,$article)
+        }
         findHeadPosition(currentTop)
-      }, 100)()
-    }
+      }, 100)
+    
     window.addEventListener('scroll', tocScrollFn)
   }
 
diff --git a/source/js/utils.js b/source/js/utils.js
index a1be368..3460b6a 100644
--- a/source/js/utils.js
+++ b/source/js/utils.js
@@ -88,7 +88,7 @@ const btf = {
       const minuteCount = dateDiff / minute
 
       if (monthCount > 12) {
-        result = datePost.toLocaleDateString().replace(/\//g, '-')
+        result = datePost.toISOString().slice(0,10)
       } else if (monthCount >= 1) {
         result = parseInt(monthCount) + ' ' + GLOBAL_CONFIG.date_suffix.month
       } else if (dayCount >= 1) {
@@ -274,5 +274,16 @@ const btf = {
         title: title
       }, title, anchor)
     }
+  },
+
+  getScrollPercent: (currentTop,ele) => {
+    const docHeight = ele.clientHeight
+    const winHeight = document.documentElement.clientHeight
+    const headerHeight = ele.offsetTop
+    const contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : (document.documentElement.scrollHeight - winHeight)
+    const scrollPercent = (currentTop - headerHeight) / (contentMath)
+    const scrollPercentRounded = Math.round(scrollPercent * 100)
+    const percentage = (scrollPercentRounded > 100) ? 100 : (scrollPercentRounded <= 0) ? 0 : scrollPercentRounded
+    return percentage
   }
 }

From e2565a9f39d5bd891e9e3a91fefbb1e99954c0d4 Mon Sep 17 00:00:00 2001
From: Jerry <hwy0127@gmail.com>
Date: Tue, 13 Dec 2022 01:23:50 +0800
Subject: [PATCH 6/9] =?UTF-8?q?breaking=20changes:=20cover=20=E7=9A=84?=
 =?UTF-8?q?=E9=A1=AF=E7=A4=BA=E5=84=AA=E5=8C=96=20#1101=20feature:=20defau?=
 =?UTF-8?q?lt=5Fcover=20=E5=8F=AF=E9=85=8D=E7=BD=AE=E9=A1=8F=E8=89=B2=20fi?=
 =?UTF-8?q?x:=20=E4=BF=AE=E5=BE=A9=E4=BD=BF=E7=94=A8=E6=9C=AC=E5=9C=B0?=
 =?UTF-8?q?=E6=90=9C=E7=B4=A2=E6=99=82=EF=BC=8C=E8=BC=B8=E5=85=A5=E7=89=B9?=
 =?UTF-8?q?=E6=AE=8A=E7=AC=A6=E8=99=9F=E6=B2=92=E6=9C=89=E9=A1=AF=E7=A4=BA?=
 =?UTF-8?q?=E7=B5=90=E6=9E=9C=E7=9A=84=20bug=20closed=20#1110=20fix:=20?=
 =?UTF-8?q?=E4=BF=AE=E5=BE=A9=20=E9=A0=82=E9=83=A8=E5=9C=96=E5=92=8C=20foo?=
 =?UTF-8?q?ter=20=E9=85=8D=E7=BD=AE=E5=B8=B6=E6=9C=89/=E7=9A=84=E9=A1=8F?=
 =?UTF-8?q?=E8=89=B2=E5=8F=83=E6=95=B8=E6=99=82=EF=BC=8C=E7=84=A1=E6=B3=95?=
 =?UTF-8?q?=E9=A1=AF=E7=A4=BA=E9=A1=8F=E8=89=B2=E7=9A=84=20bug=20improveme?=
 =?UTF-8?q?nt:=20=E9=BC=A0=E6=A8=99=E7=A7=BB=E5=8B=95=E5=88=B0=E5=88=86?=
 =?UTF-8?q?=E9=A0=81=E6=99=82=EF=BC=8C=E6=96=87=E7=AB=A0=E5=88=86=E9=A0=81?=
 =?UTF-8?q?=E6=8C=89=E9=88=95=E5=A2=9E=E5=8A=A0=E8=AA=AC=E6=98=8E=E6=96=87?=
 =?UTF-8?q?=E5=AD=97=20improvement:=20=E6=96=87=E7=AB=A0=E9=A0=81=E7=9A=84?=
 =?UTF-8?q?=E9=A0=82=E9=83=A8=E5=9C=96=E9=A1=AF=E7=A4=BA=E6=AC=A1=E5=BA=8F?=
 =?UTF-8?q?=E7=82=BA=20top=5Fimg=20>=20cover=20>=20default=5Ftop=5Fimg=20i?=
 =?UTF-8?q?mprovement:=20canonical=20=E7=9A=84=E9=8F=88=E6=8E=A5=E6=A0=B9?=
 =?UTF-8?q?=E6=93=9A=E9=85=8D=E7=BD=AE=E7=94=9F=E6=88=90=20#1111?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layout/includes/head.pug                      |  2 +-
 layout/includes/head/Open_Graph.pug           |  3 +-
 layout/includes/header/index.pug              |  4 +-
 layout/includes/layout.pug                    |  2 +-
 layout/includes/mixins/article-sort.pug       |  5 +-
 layout/includes/mixins/post-ui.pug            |  5 +-
 layout/includes/pagination.pug                | 16 +++--
 .../includes/third-party/share/share-js.pug   |  3 +-
 layout/includes/widget/card_recent_post.pug   |  5 +-
 package.json                                  |  2 +-
 scripts/filters/random_cover.js               | 58 +++++++++----------
 scripts/helpers/page.js                       | 12 +++-
 scripts/helpers/related_post.js               | 13 +++--
 source/css/_global/function.styl              |  4 +-
 source/css/_global/index.styl                 |  1 +
 source/css/_layout/aside.styl                 |  2 +-
 source/css/_layout/footer.styl                |  2 +-
 source/css/_page/archives.styl                |  2 +-
 source/css/_page/homepage.styl                |  4 +-
 source/js/search/local-search.js              | 12 +++-
 20 files changed, 95 insertions(+), 62 deletions(-)

diff --git a/layout/includes/head.pug b/layout/includes/head.pug
index d8ff883..8d0674b 100644
--- a/layout/includes/head.pug
+++ b/layout/includes/head.pug
@@ -26,7 +26,7 @@ meta(name="theme-color" content=themeColor)
 include ./head/Open_Graph.pug
 
 !=favicon_tag(theme.favicon || config.favicon)
-link(rel="canonical" href=urlNoIndex())
+link(rel="canonical" href=urlNoIndex(null,config.pretty_urls.trailing_index,config.pretty_urls.trailing_html))
 
 //- 預解析
 !=partial('includes/head/preconnect', {}, {cache: true})
diff --git a/layout/includes/head/Open_Graph.pug b/layout/includes/head/Open_Graph.pug
index 1d04b47..8fe04e0 100644
--- a/layout/includes/head/Open_Graph.pug
+++ b/layout/includes/head/Open_Graph.pug
@@ -1,8 +1,9 @@
 if theme.Open_Graph_meta.enable
   -
+    const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
     let ogOption = Object.assign({
       type: is_post() ? 'article' : 'website',
-      image: (page.cover || theme.avatar.img) ? full_url_for(page.cover || theme.avatar.img) : '',
+      image: coverVal ? full_url_for(coverVal) : '',
       fb_admins: theme.facebook_comments.user_id || '',
       fb_app_id: theme.facebook_comments.app_id || '',
     }, theme.Open_Graph_meta.option)
diff --git a/layout/includes/header/index.pug b/layout/includes/header/index.pug
index d1aa7c0..df6f3da 100644
--- a/layout/includes/header/index.pug
+++ b/layout/includes/header/index.pug
@@ -1,6 +1,6 @@
 if !theme.disable_top_img && page.top_img !== false
   if is_post()
-    - var top_img = page.top_img || page.cover || page.randomcover
+    - var top_img = page.top_img || page.cover || theme.default_top_img
   else if is_page()
     - var top_img = page.top_img || theme.default_top_img
   else if is_tag()
@@ -17,7 +17,7 @@ if !theme.disable_top_img && page.top_img !== false
     - var top_img = page.top_img || theme.default_top_img
 
   if top_img !== false
-    - var imgSource = top_img && top_img.indexOf('/') !== -1 ? `background-image: url('${url_for(top_img)}')` : `background: ${top_img}`
+    - var imgSource = top_img && isImgOrUrl(top_img) ? `background-image: url('${url_for(top_img)}')` : `background: ${top_img}`
     - var bg_img = top_img ? imgSource : ''
     - var site_title = page.title || page.tag || page.category || config.title
     - var isHomeClass = is_home() ? 'full_page' : 'not-home-page'
diff --git a/layout/includes/layout.pug b/layout/includes/layout.pug
index eb1dfe1..dcd2c54 100644
--- a/layout/includes/layout.pug
+++ b/layout/includes/layout.pug
@@ -33,7 +33,7 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside
           if (footerBg === true)
             - var footer_bg = bg_img
           else
-            - var footer_bg = theme.footer_bg.indexOf('/') !== -1 ? `background-image: url('${url_for(footerBg)}')` : `background: ${footerBg}`
+            - var footer_bg = isImgOrUrl(theme.footer_bg) ? `background-image: url('${url_for(footerBg)}')` : `background: ${footerBg}`
         else
           - var footer_bg = ''
 
diff --git a/layout/includes/mixins/article-sort.pug b/layout/includes/mixins/article-sort.pug
index 01e9ef2..3eaf038 100644
--- a/layout/includes/mixins/article-sort.pug
+++ b/layout/includes/mixins/article-sort.pug
@@ -11,7 +11,10 @@ mixin articleSort(posts)
       .article-sort-item(class=no_cover)
         if article.cover && theme.cover.archives_enable
           a.article-sort-item-img(href=url_for(article.path) title=title)
-            img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
+            if article.cover_type === 'img'
+              img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
+            else
+              div(style=`background: ${article.cover}`)
         .article-sort-item-info
           .article-sort-item-time
             i.far.fa-calendar-alt
diff --git a/layout/includes/mixins/post-ui.pug b/layout/includes/mixins/post-ui.pug
index 3dd364d..4ed053b 100644
--- a/layout/includes/mixins/post-ui.pug
+++ b/layout/includes/mixins/post-ui.pug
@@ -14,7 +14,10 @@ mixin postUI(posts)
       if post_cover && theme.cover.index_enable
         .post_cover(class=leftOrRight)
           a(href=url_for(link) title=title)
-            img.post_bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.error_img.post_page) + `'` alt=title)
+            if article.cover_type === 'img'
+              img.post-bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+            else
+              div.post-bg(style=`background: ${post_cover}`)
       .recent-post-info(class=no_cover)
         a.article-title(href=url_for(link) title=title)= title
         .article-meta-wrap
diff --git a/layout/includes/pagination.pug b/layout/includes/pagination.pug
index c50b81a..2af0e00 100644
--- a/layout/includes/pagination.pug
+++ b/layout/includes/pagination.pug
@@ -13,19 +13,23 @@ if is_post()
     if(prev)
       - var hasPageNext = next ? 'pull-left' : 'pull-full'
       .prev-post(class=hasPageNext)
-        - var pagination_cover = prev.cover === false ? prev.randomcover : prev.cover
-        a(href=url_for(prev.path))
-          img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
+        a(href=url_for(prev.path) title=prev.title)
+          if prev.cover_type === 'img'
+            img.cover(src=url_for(prev.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
+          else
+            .cover(style=`background: ${prev.cover || 'var(--default-bg-color)'}`)
           .pagination-info
             .label=_p('pagination.prev')
             .prev_info=prev.title
           
     if(next)
       - var hasPagePrev = prev ? 'pull-right' : 'pull-full'
-      - var pagination_cover = next.cover == false ? next.randomcover : next.cover
       .next-post(class=hasPagePrev)
-        a(href=url_for(next.path))
-          img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
+        a(href=url_for(next.path) title=next.title)
+          if next.cover_type === 'img'
+            img.cover(src=url_for(next.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
+          else
+            .cover(style=`background: ${next.cover || 'var(--default-bg-color)'}`)
           .pagination-info
             .label=_p('pagination.next')
             .next_info=next.title
diff --git a/layout/includes/third-party/share/share-js.pug b/layout/includes/third-party/share/share-js.pug
index 0a566fa..612332c 100644
--- a/layout/includes/third-party/share/share-js.pug
+++ b/layout/includes/third-party/share/share-js.pug
@@ -1,3 +1,4 @@
-.social-share(data-image=url_for(page.cover|| theme.avatar.img) data-sites= theme.sharejs.sites)
+- const coverVal = page.cover_type === 'img' ? page.cover : theme.avatar.img
+.social-share(data-image=url_for(coverVal) data-sites= theme.sharejs.sites)
 link(rel='stylesheet' href=url_for(theme.asset.sharejs_css) media="print" onload="this.media='all'")
 script(src=url_for(theme.asset.sharejs) defer)
\ No newline at end of file
diff --git a/layout/includes/widget/card_recent_post.pug b/layout/includes/widget/card_recent_post.pug
index 60a0e07..dddf0fc 100644
--- a/layout/includes/widget/card_recent_post.pug
+++ b/layout/includes/widget/card_recent_post.pug
@@ -14,7 +14,10 @@ if theme.aside.card_recent_post.enable
         .aside-list-item(class=no_cover)
           if post_cover && theme.cover.aside_enable
             a.thumbnail(href=url_for(link) title=title)
-              img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+              if article.cover_type === 'img'
+                img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+              else
+                div(style=`background: ${post_cover}`)
           .content
             a.title(href=url_for(link) title=title)= title
             if theme.aside.card_recent_post.sort === 'updated'
diff --git a/package.json b/package.json
index 3dd25be..c2d5961 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "4.6.0-b1",
+  "version": "4.6.0-b2",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {
diff --git a/scripts/filters/random_cover.js b/scripts/filters/random_cover.js
index 47ed4fe..dacf563 100644
--- a/scripts/filters/random_cover.js
+++ b/scripts/filters/random_cover.js
@@ -6,40 +6,40 @@
 'use strict'
 
 hexo.extend.filter.register('before_post_render', function (data) {
-  const { config } = this
-  if (config.post_asset_folder) {
-    const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/
+  const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/
+  let randomCover
+  let coverVal = data.cover
+
+  // Add path to top_img and cover if post_asset_folder is enabled
+  if (hexo.config.post_asset_folder) {
     const topImg = data.top_img
-    const cover = data.cover
     if (topImg && topImg.indexOf('/') === -1 && imgTestReg.test(topImg)) data.top_img = data.path + topImg
-    if (cover && cover.indexOf('/') === -1) data.cover = data.path + cover
+    if (coverVal && coverVal.indexOf('/') === -1 && imgTestReg.test(coverVal)) data.cover = data.path + coverVal
   }
 
-  if (data.cover === false) {
-    data.randomcover = randomCover()
-    return data
+  const randomCoverFn = () => {
+    const theme = hexo.theme.config
+    if (!(theme.cover && theme.cover.default_cover)) return false
+    if (!Array.isArray(theme.cover.default_cover)) return theme.cover.default_cover
+    const num = Math.floor(Math.random() * theme.cover.default_cover.length)
+    return theme.cover.default_cover[num]
+  }
+  
+  if (coverVal === false) return data
+
+  // If cover is not set, use random cover
+  if (!coverVal) {
+    randomCover = randomCoverFn()
+    data.cover = randomCover
+    coverVal = randomCover // update coverVal
   }
 
-  data.cover = data.cover || randomCover()
-  return data
-})
-
-function randomCover () {
-  const theme = hexo.theme.config
-  let cover
-  let num
-
-  if (theme.cover && theme.cover.default_cover) {
-    if (!Array.isArray(theme.cover.default_cover)) {
-      cover = theme.cover.default_cover
-      return cover
-    } else {
-      num = Math.floor(Math.random() * theme.cover.default_cover.length)
-      cover = theme.cover.default_cover[num]
-      return cover
+  if (coverVal) {
+    if (coverVal.indexOf('//') !== -1 || imgTestReg.test(coverVal)) {
+      data.cover_type = 'img'
+      return data
     }
-  } else {
-    cover = theme.default_top_img || 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
-    return cover
   }
-}
+
+  return data
+})
\ No newline at end of file
diff --git a/scripts/helpers/page.js b/scripts/helpers/page.js
index aa2b74b..8e3f892 100644
--- a/scripts/helpers/page.js
+++ b/scripts/helpers/page.js
@@ -54,8 +54,8 @@ hexo.extend.helper.register('cloudTags', function (options = {}) {
   return result
 })
 
-hexo.extend.helper.register('urlNoIndex', function (url = null) {
-  return prettyUrls(url || this.url, { trailing_index: false, trailing_html: false })
+hexo.extend.helper.register('urlNoIndex', function (url = null, trailingIndex = false, trailingHtml = false) {
+  return prettyUrls(url || this.url, { trailing_index: trailingIndex, trailing_html: trailingHtml })
 })
 
 hexo.extend.helper.register('md5', function (path) {
@@ -95,3 +95,11 @@ hexo.extend.helper.register('findArchivesTitle', function (page, menu, date) {
 
   return loop(menu) || defaultTitle
 })
+
+hexo.extend.helper.register('isImgOrUrl', function (path) {
+  const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/
+  if (path.indexOf('//') !== -1 || imgTestReg.test(path)) {
+    return true
+  }
+  return false
+})
\ No newline at end of file
diff --git a/scripts/helpers/related_post.js b/scripts/helpers/related_post.js
index 6809ac7..9a46f68 100644
--- a/scripts/helpers/related_post.js
+++ b/scripts/helpers/related_post.js
@@ -15,7 +15,7 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
           title: post.title,
           path: post.path,
           cover: post.cover,
-          randomcover: post.randomcover,
+          cover_type: post.cover_type,
           weight: 1,
           updated: post.updated,
           created: post.date
@@ -50,13 +50,14 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
     result += '<div class="relatedPosts-list">'
 
     for (let i = 0; i < Math.min(relatedPosts.length, limitNum); i++) {
-      const cover =
-        relatedPosts[i].cover === false
-          ? relatedPosts[i].randomcover
-          : relatedPosts[i].cover
+      const cover = relatedPosts[i].cover || 'var(--default-bg-color)'
       const title = this.escape_html(relatedPosts[i].title)
       result += `<div><a href="${this.url_for(relatedPosts[i].path)}" title="${title}">`
-      result += `<img class="cover" src="${this.url_for(cover)}" alt="cover">`
+      if (relatedPosts[i].cover_type === 'img') {
+        result += `<img class="cover" src="${this.url_for(cover)}" alt="cover">`
+      } else {
+        result += `<div class="cover" style="background: ${cover}"></div>`
+      }
       if (dateType === 'created') {
         result += `<div class="content is-center"><div class="date"><i class="far fa-calendar-alt fa-fw"></i> ${this.date(relatedPosts[i].created, hexoConfig.date_format)}</div>`
       } else {
diff --git a/source/css/_global/function.styl b/source/css/_global/function.styl
index cf79eab..21539ce 100644
--- a/source/css/_global/function.styl
+++ b/source/css/_global/function.styl
@@ -36,11 +36,11 @@
 
 .postImgHover
   &:hover
-    img
+    .cover
       opacity: .8
       transform: scale(1.1)
 
-  img
+  .cover
     position: absolute
     width: 100%
     height: 100%
diff --git a/source/css/_global/index.styl b/source/css/_global/index.styl
index 8296759..1645675 100644
--- a/source/css/_global/index.styl
+++ b/source/css/_global/index.styl
@@ -33,6 +33,7 @@
   --pseudo-hover: $pseudo-hover
   --headline-presudo: #a0a0a0
   --scrollbar-color: $scrollbar-color
+  --default-bg-color: $theme-color
 
 body
   position: relative
diff --git a/source/css/_layout/aside.styl b/source/css/_layout/aside.styl
index 5d7e6ca..5d53a34 100644
--- a/source/css/_layout/aside.styl
+++ b/source/css/_layout/aside.styl
@@ -115,7 +115,7 @@
         width: w = 4.2em
         height: w
 
-        & > img
+        :first-child
           @extend .imgHover
 
       .content
diff --git a/source/css/_layout/footer.styl b/source/css/_layout/footer.styl
index 3fb1d39..55cbc8c 100644
--- a/source/css/_layout/footer.styl
+++ b/source/css/_layout/footer.styl
@@ -1,6 +1,6 @@
 #footer
   position: relative
-  background: $light-blue
+  background-color: $light-blue
   background-attachment: scroll
   background-position: bottom
   background-size: cover
diff --git a/source/css/_page/archives.styl b/source/css/_page/archives.styl
index 4575fbb..309e00c 100644
--- a/source/css/_page/archives.styl
+++ b/source/css/_page/archives.styl
@@ -101,7 +101,7 @@
       width: 80px
       height: 80px
 
-      img
+      :first-child
         @extend .imgHover
 
     &-info
diff --git a/source/css/_page/homepage.styl b/source/css/_page/homepage.styl
index 9c8153c..6beba31 100644
--- a/source/css/_page/homepage.styl
+++ b/source/css/_page/homepage.styl
@@ -15,7 +15,7 @@
       height: auto
 
     &:hover
-      img.post_bg
+      img.post-bg
         transform: scale(1.1)
 
     &.ads-wrap
@@ -31,7 +31,7 @@
         width: 100%
         height: 230px
 
-      img.post_bg
+      .post-bg
         @extend .imgHover
 
       &.right
diff --git a/source/js/search/local-search.js b/source/js/search/local-search.js
index 6c1ca7d..6404822 100644
--- a/source/js/search/local-search.js
+++ b/source/js/search/local-search.js
@@ -84,8 +84,11 @@ window.addEventListener('load', () => {
     $input.addEventListener('input', function () {
       const keywords = this.value.trim().toLowerCase().split(/[\s]+/)
       if (keywords[0] !== '') $loadingStatus.innerHTML = '<i class="fas fa-spinner fa-pulse"></i>'
+      else {
+        $resultContent.innerHTML = ''
+        return
+      }
 
-      $resultContent.innerHTML = ''
       let str = '<div class="search-result-list">'
       if (keywords.length <= 0) return
       let count = 0
@@ -150,7 +153,12 @@ window.addEventListener('load', () => {
 
               // highlight all keywords
               keywords.forEach(keyword => {
-                const regS = new RegExp(keyword, 'gi')
+                let regexStr = keyword
+                const specialRegex = new RegExp("[^\\w\\s]+") // match special characters
+                if (keyword.length === 1 && specialRegex.test(keyword)) {
+                  regexStr = `\\${keyword}`
+                }
+                const regS = new RegExp(regexStr, 'gi')
                 matchContent = matchContent.replace(regS, '<span class="search-keyword">' + keyword + '</span>')
                 dataTitle = dataTitle.replace(regS, '<span class="search-keyword">' + keyword + '</span>')
               })

From 0f915f47eff97a08a3f9c78fd4ca02c62acea66c Mon Sep 17 00:00:00 2001
From: Jerry <hwy0127@gmail.com>
Date: Thu, 22 Dec 2022 00:16:54 +0800
Subject: [PATCH 7/9] =?UTF-8?q?breaking=20changes:=20=E7=A7=BB=E9=99=A4=20?=
 =?UTF-8?q?cnzz=20=E5=88=86=E6=9E=90=20feat:=20=E5=B0=8E=E8=88=AA=E6=AC=84?=
 =?UTF-8?q?=E5=8F=AF=E9=9A=B1=E8=97=8F=E5=8D=9A=E5=AE=A2=E5=90=8D=E5=AD=97?=
 =?UTF-8?q?=20feat:=20=E5=B0=8E=E8=88=AA=E6=AC=84=E5=8F=AF=E8=A8=AD?=
 =?UTF-8?q?=E7=BD=AE=20logo=20closed=20#1104?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _config.yml                         | 10 +++++-----
 layout/includes/head/analytics.pug  |  3 ---
 layout/includes/head/preconnect.pug |  3 ---
 layout/includes/header/nav.pug      |  8 ++++++--
 package.json                        |  2 +-
 source/css/_global/index.styl       |  2 +-
 source/css/_layout/head.styl        | 22 ++++++++++++++++++----
 source/js/main.js                   | 21 ++++++++++++---------
 8 files changed, 43 insertions(+), 28 deletions(-)

diff --git a/_config.yml b/_config.yml
index bf08b04..7ef34e1 100644
--- a/_config.yml
+++ b/_config.yml
@@ -13,6 +13,10 @@ menu:
   # Link: /link/ || fas fa-link
   # About: /about/ || fas fa-heart
 
+nav_info:
+  logo: # image
+  display_title: true # true or false
+
 # Code Blocks (代碼相關)
 # --------------------------------------
 
@@ -397,7 +401,7 @@ tidio:
   public_key:
 
 # daovoice
-# http://daovoice.io/
+# http://dashboard.daovoice.io/app
 daovoice:
   enable: false
   app_id:
@@ -441,10 +445,6 @@ baidu_analytics:
 # https://analytics.google.com/analytics/web/
 google_analytics:
 
-# CNZZ Analytics
-# https://www.umeng.com/
-cnzz_analytics:
-
 # Cloudflare Analytics
 # https://www.cloudflare.com/zh-tw/web-analytics/
 cloudflare_analytics:
diff --git a/layout/includes/head/analytics.pug b/layout/includes/head/analytics.pug
index 6452528..ad4a395 100644
--- a/layout/includes/head/analytics.pug
+++ b/layout/includes/head/analytics.pug
@@ -16,9 +16,6 @@ if theme.google_analytics
     gtag('js', new Date());
     gtag('config', '!{theme.google_analytics}');
 
-if theme.cnzz_analytics
-  script(async data-pjax src=`https://s4.cnzz.com/z_stat.php?id=${theme.cnzz_analytics}&web_id=${theme.cnzz_analytics}`)
-
 if theme.cloudflare_analytics
   script(defer data-pjax src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon=`{"token": "${theme.cloudflare_analytics}"}`)
 
diff --git a/layout/includes/head/preconnect.pug b/layout/includes/head/preconnect.pug
index d010b05..2c9d201 100644
--- a/layout/includes/head/preconnect.pug
+++ b/layout/includes/head/preconnect.pug
@@ -6,9 +6,6 @@ if theme.google_analytics
 if theme.baidu_analytics
   link(rel="preconnect" href="//hm.baidu.com")
 
-if theme.cnzz_analytics
-  link(rel="preconnect" href="//s4.cnzz.com")
-
 if theme.cloudflare_analytics
   link(rel="preconnect" href="//static.cloudflareinsights.com")
 
diff --git a/layout/includes/header/nav.pug b/layout/includes/header/nav.pug
index 7b516e9..0db6982 100644
--- a/layout/includes/header/nav.pug
+++ b/layout/includes/header/nav.pug
@@ -1,6 +1,10 @@
 nav#nav
-  span#blog_name
-    a#site-name(href=url_for('/')) #[=config.title]
+  span#blog-info
+    a(href=url_for('/') title=config.title)
+      if theme.nav_info.logo
+        img.site-icon(src=url_for(theme.nav_info.logo))
+      if theme.nav_info.display_title
+        span.site-name=config.title
     
   #menus
     if (theme.algolia_search.enable || theme.local_search.enable)
diff --git a/package.json b/package.json
index c2d5961..6a1150e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "4.6.0-b2",
+  "version": "4.6.0-b3",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {
diff --git a/source/css/_global/index.styl b/source/css/_global/index.styl
index 1645675..d7c71c3 100644
--- a/source/css/_global/index.styl
+++ b/source/css/_global/index.styl
@@ -166,7 +166,7 @@ a
 if $site-name-font
   #site-title,
   #site-subtitle,
-  #site-name,
+  .site-name,
   #aside-content .author-info__name,
   #aside-content .author-info__description
     font-family: $site-name-font
diff --git a/source/css/_layout/head.styl b/source/css/_layout/head.styl
index c7d4ca3..dcac7f9 100644
--- a/source/css/_layout/head.styl
+++ b/source/css/_layout/head.styl
@@ -137,8 +137,16 @@
       box-shadow: 0 5px 6px -5px alpha($grey, .6)
       transition: transform .2s ease-in-out, opacity .2s ease-in-out
 
+      #blog-info
+        color: var(--font-color)
+
+        &:hover
+          color: $light-blue
+
+        .site-name
+          text-shadow: none
+
       a,
-      #site-name,
       #toggle-menu
         color: var(--font-color)
         text-shadow: none
@@ -253,8 +261,15 @@
   &.show
     opacity: 1
 
-  #blog_name
+  #blog-info
     flex: 1
+    color: var(--light-grey)
+    @extend .limit-one-line
+
+    .site-icon
+      margin-right: 6px
+      height: 36px
+      vertical-align: middle
 
   #toggle-menu
     display: none
@@ -270,10 +285,9 @@
     &:hover
       color: var(--white)
 
-  #site-name
+  .site-name
     text-shadow: 2px 2px 4px rgba($dark-black, .15)
     font-weight: bold
-    cursor: pointer
 
   .menus_items
     display: inline
diff --git a/source/js/main.js b/source/js/main.js
index 4c62fca..e57206c 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -1,21 +1,24 @@
 document.addEventListener('DOMContentLoaded', function () {
-  let blogNameWidth, menusWidth, searchWidth, $nav
+  let headerContentWidth, $nav
   let mobileSidebarOpen = false
 
-  const adjustMenu = (init) => {
+  const adjustMenu = init => {
+    const getAllWidth = ele => {
+      let width = 0
+      ele.length && Array.from(ele).forEach(i => { width += i.offsetWidth })
+      return width
+    }
+
     if (init) {
-      blogNameWidth = document.getElementById('site-name').offsetWidth
-      const $menusEle = document.querySelectorAll('#menus .menus_item')
-      menusWidth = 0
-      $menusEle.length && $menusEle.forEach(i => { menusWidth += i.offsetWidth })
-      const $searchEle = document.querySelector('#search-button')
-      searchWidth = $searchEle ? $searchEle.offsetWidth : 0
+      const blogInfoWidth = getAllWidth(document.querySelector('#blog-info > a').children)
+      const menusWidth = getAllWidth(document.getElementById('menus').children)
+      headerContentWidth = blogInfoWidth + menusWidth
       $nav = document.getElementById('nav')
     }
 
     let hideMenuIndex = ''
     if (window.innerWidth <= 768) hideMenuIndex = true
-    else hideMenuIndex = blogNameWidth + menusWidth + searchWidth > $nav.offsetWidth - 120
+    else hideMenuIndex = headerContentWidth > $nav.offsetWidth - 120
 
     if (hideMenuIndex) {
       $nav.classList.add('hide-menu')

From 9a3b41912abacdc4c82758d3852912cbe3af8ace Mon Sep 17 00:00:00 2001
From: Jerry <hwy0127@gmail.com>
Date: Sat, 14 Jan 2023 00:36:34 +0800
Subject: [PATCH 8/9] =?UTF-8?q?feat:=20=E4=B8=8D=E8=92=9C=E5=AD=90?=
 =?UTF-8?q?=E5=8F=AF=E9=85=8D=E7=BD=AE=20CDN=20closed=20#1132=20feat:=20ga?=
 =?UTF-8?q?llery=20=E6=A8=99=E7=B0=BD=E5=A4=96=E6=8E=9B=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E5=9C=96=E7=89=87=E6=87=B6=E5=8A=A0=E8=BC=89=EF=BC=8C=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=20lazyload=20rowHeight=20=E5=92=8C=20limit=20?=
 =?UTF-8?q?=E5=B1=AC=E6=80=A7=E9=85=8D=E7=BD=AE=20feat:=20=E5=8F=AF?=
 =?UTF-8?q?=E8=A8=AD=E7=BD=AE=E5=9B=BA=E5=AE=9A=E5=B0=8E=E8=88=AA=E6=AC=84?=
 =?UTF-8?q?=20closed=20#1150=20fix:=20=E4=BF=AE=E5=BE=A9=E9=96=8B=E5=95=9F?=
 =?UTF-8?q?=E6=87=B6=E5=8A=A0=E8=BC=89=E5=BE=8C=EF=BC=8C=E5=86=8D=E4=BD=BF?=
 =?UTF-8?q?=E7=94=A8=20flink=5Furl=20=E7=9A=84=E6=96=B9=E5=BC=8F=E5=BC=95?=
 =?UTF-8?q?=E5=85=A5=E5=8F=8B=E9=8F=88=E6=95=B8=E6=93=9A=EF=BC=8C=E5=8F=8B?=
 =?UTF-8?q?=E9=8F=88=E9=A0=AD=E5=83=8F=E6=9C=89=E5=8F=AF=E8=83=BD=E4=B8=8D?=
 =?UTF-8?q?=E9=A1=AF=E7=A4=BA=E7=9A=84=20bug=20closed=20#1146=20fix:=20?=
 =?UTF-8?q?=E4=BF=AE=E5=BE=A9=E9=96=B2=E8=AE=80=E6=A8=A1=E5=BC=8F=E4=B8=8B?=
 =?UTF-8?q?=EF=BC=8C=E4=BB=A3=E7=A2=BC=E5=A1=8A=E7=9A=84=E8=83=8C=E6=99=AF?=
 =?UTF-8?q?=E9=A1=8F=E8=89=B2=E4=BB=8D=E9=A1=AF=E7=A4=BA=E5=BD=A9=E8=89=B2?=
 =?UTF-8?q?=E8=83=8C=E6=99=AF=E7=9A=84=20bug=20(=E8=87=AA=E5=AE=9A?=
 =?UTF-8?q?=E7=BE=A9=E4=BB=A3=E7=A2=BC=E5=A1=8A)=20closed=20#1139=20improv?=
 =?UTF-8?q?ement:=20=E6=90=9C=E7=B4=A2=E7=B5=90=E6=9E=9C=E6=8F=9B=E8=A1=8C?=
 =?UTF-8?q?=E6=99=82=E4=B8=8D=E6=9C=83=E6=8B=86=E5=88=86=E5=96=AE=E8=A9=9E?=
 =?UTF-8?q?=E9=A1=AF=E7=A4=BA=20improvement:=20=E5=84=AA=E5=8C=96=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E7=B5=90=E6=9E=9C=E9=A1=AF=E7=A4=BA=E6=BB=BE=E5=8B=95?=
 =?UTF-8?q?=E6=A2=9D=E4=BD=8D=E7=BD=AE=20improvement:=20css/js=20=E5=84=AA?=
 =?UTF-8?q?=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _config.yml                          |   5 +-
 languages/default.yml                |   1 +
 languages/en.yml                     |   1 +
 languages/zh-CN.yml                  |   1 +
 languages/zh-TW.yml                  |   1 +
 layout/includes/additional-js.pug    |   2 +-
 layout/includes/head.pug             |   2 +-
 layout/includes/head/preconnect.pug  |   2 +-
 layout/includes/header/nav.pug       |  13 +--
 layout/includes/page/flink.pug       |   1 +
 package.json                         |   2 +-
 plugins.yml                          |  24 +++---
 scripts/events/cdn.js                |  13 +--
 scripts/events/comment.js            |   2 +-
 scripts/filters/random_cover.js      |   4 +-
 scripts/helpers/findArchiveLength.js |  18 ++--
 scripts/helpers/inject_head_js.js    |   4 +-
 scripts/helpers/page.js              |   6 +-
 scripts/tag/gallery.js               |  37 +++++++--
 source/css/_layout/head.styl         |   9 +-
 source/css/_mode/readmode.styl       |   2 +-
 source/css/_search/algolia.styl      |   4 +-
 source/css/_search/local-search.styl |   8 +-
 source/css/_tags/gallery.styl        |  45 +++++++++-
 source/js/main.js                    | 120 ++++++++++++++++-----------
 source/js/search/algolia.js          |  26 +++---
 source/js/search/local-search.js     |   4 +-
 source/js/utils.js                   |  22 ++---
 28 files changed, 244 insertions(+), 135 deletions(-)

diff --git a/_config.yml b/_config.yml
index 7ef34e1..bc7d22a 100644
--- a/_config.yml
+++ b/_config.yml
@@ -13,9 +13,10 @@ menu:
   # Link: /link/ || fas fa-link
   # About: /about/ || fas fa-heart
 
-nav_info:
+nav:
   logo: # image
-  display_title: true # true or false
+  display_title: true
+  fixed: false # fixed navigation bar
 
 # Code Blocks (代碼相關)
 # --------------------------------------
diff --git a/languages/default.yml b/languages/default.yml
index 833fb6c..a491719 100644
--- a/languages/default.yml
+++ b/languages/default.yml
@@ -117,5 +117,6 @@ Snackbar:
   night_to_day: Light Mode Activated Manually
 
 loading: Loading...
+load_more: Load More
 
 error404: Page not found
diff --git a/languages/en.yml b/languages/en.yml
index 9d303e0..49120c2 100644
--- a/languages/en.yml
+++ b/languages/en.yml
@@ -117,5 +117,6 @@ Snackbar:
   night_to_day: Light Mode Activated Manually
 
 loading: Loading...
+load_more: Load More
 
 error404: Page not found
diff --git a/languages/zh-CN.yml b/languages/zh-CN.yml
index 55900d2..9c2919a 100644
--- a/languages/zh-CN.yml
+++ b/languages/zh-CN.yml
@@ -118,5 +118,6 @@ Snackbar:
   night_to_day: 你已切换为浅色模式
 
 loading: 加载中...
+load_more: 加载更多
 
 error404: 页面没有找到
diff --git a/languages/zh-TW.yml b/languages/zh-TW.yml
index 61d667f..86623c0 100644
--- a/languages/zh-TW.yml
+++ b/languages/zh-TW.yml
@@ -118,5 +118,6 @@ Snackbar:
   night_to_day: 你已切換為淺色模式
 
 loading: 載入中...
+load_more: 載入更多
 
 error404: 頁面沒有找到
diff --git a/layout/includes/additional-js.pug b/layout/includes/additional-js.pug
index 3ef0223..4ec9ac1 100644
--- a/layout/includes/additional-js.pug
+++ b/layout/includes/additional-js.pug
@@ -66,4 +66,4 @@ div
     != partial("includes/third-party/pjax", {}, { cache: true })
 
   if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
-    script(async data-pjax src='//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js')
+    script(async data-pjax src= theme.asset.busuanzi || '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js')
diff --git a/layout/includes/head.pug b/layout/includes/head.pug
index 8d0674b..0089ad2 100644
--- a/layout/includes/head.pug
+++ b/layout/includes/head.pug
@@ -15,7 +15,7 @@
 
 meta(charset='UTF-8')
 meta(http-equiv="X-UA-Compatible" content="IE=edge")
-meta(name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no")
+meta(name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0")
 title= tabTitle
 meta(name="author" content=pageAuthor)
 meta(name="copyright" content=pageCopyright)
diff --git a/layout/includes/head/preconnect.pug b/layout/includes/head/preconnect.pug
index 2c9d201..04d3b48 100644
--- a/layout/includes/head/preconnect.pug
+++ b/layout/includes/head/preconnect.pug
@@ -15,5 +15,5 @@ if theme.microsoft_clarity
 if theme.blog_title_font && theme.blog_title_font.font_link && theme.blog_title_font.font_link.indexOf('//fonts.googleapis.com') != -1
   link(rel="preconnect" href="//fonts.googleapis.com" crossorigin='')
 
-if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
+if !theme.asset.busuanzi && (theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv)
   link(rel="preconnect" href="//busuanzi.ibruce.info")
\ No newline at end of file
diff --git a/layout/includes/header/nav.pug b/layout/includes/header/nav.pug
index 0db6982..a81a2a3 100644
--- a/layout/includes/header/nav.pug
+++ b/layout/includes/header/nav.pug
@@ -1,21 +1,22 @@
-nav#nav
+- const isFixedClass = theme.nav.fixed ? 'fixed' : ''
+nav#nav(class=isFixedClass)
   span#blog-info
     a(href=url_for('/') title=config.title)
-      if theme.nav_info.logo
-        img.site-icon(src=url_for(theme.nav_info.logo))
-      if theme.nav_info.display_title
+      if theme.nav.logo
+        img.site-icon(src=url_for(theme.nav.logo))
+      if theme.nav.display_title
         span.site-name=config.title
     
   #menus
     if (theme.algolia_search.enable || theme.local_search.enable)
       #search-button
-        a.site-page.social-icon.search
+        a.site-page.social-icon.search(href="javascript:void(0);")
           i.fas.fa-search.fa-fw
           span=' '+_p('search.title')
     !=partial('includes/header/menu_item', {}, {cache: true})
 
     #toggle-menu
-      a.site-page
+      a.site-page(href="javascript:void(0);")
         i.fas.fa-bars.fa-fw
 
 
diff --git a/layout/includes/page/flink.pug b/layout/includes/page/flink.pug
index 8ec4ed6..549b67a 100644
--- a/layout/includes/page/flink.pug
+++ b/layout/includes/page/flink.pug
@@ -36,6 +36,7 @@
               }
 
               document.querySelector(".flink").insertAdjacentHTML("afterbegin", result)
+              window.lazyLoadInstance && window.lazyLoadInstance.update()
             })
         })()
 
diff --git a/package.json b/package.json
index 6a1150e..38f6ca7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "4.6.0-b3",
+  "version": "4.6.0-b4",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {
diff --git a/plugins.yml b/plugins.yml
index 9590b68..115c124 100644
--- a/plugins.yml
+++ b/plugins.yml
@@ -1,11 +1,11 @@
 algolia_search_v4:
   name: algoliasearch
   file: dist/algoliasearch-lite.umd.js
-  version: 4.14.2
+  version: 4.14.3
 instantsearch_v4:
   name: instantsearch.js
   file: dist/instantsearch.production.min.js
-  version: 4.49.0
+  version: 4.49.4
 pjax:
   name: pjax
   file: pjax.min.js
@@ -37,17 +37,17 @@ disqusjs_css:
 twikoo:
   name: twikoo
   file: dist/twikoo.all.min.js
-  version: 1.6.7
+  version: 1.6.8
 waline_js:
   name: '@waline/client'
   file: dist/waline.js
   other_name: waline
-  version: 2.13.0
+  version: 2.14.6
 waline_css:
   name: '@waline/client'
   file: dist/waline.css
   other_name: waline
-  version: 2.13.0
+  version: 2.14.6
 sharejs:
   name: butterfly-extsrc
   file: sharejs/dist/js/social-share.min.js
@@ -64,16 +64,16 @@ katex:
   name: katex
   file: dist/katex.min.css
   other_name: KaTeX
-  version: 0.16.3
+  version: 0.16.4
 katex_copytex:
   name: katex
   file: dist/contrib/copy-tex.min.js
   other_name: KaTeX
-  version: 0.16.3
+  version: 0.16.4
 mermaid:
   name: mermaid
   file: dist/mermaid.min.js
-  version: 9.1.7
+  version: 9.3.0
 canvas_ribbon:
   name: butterfly-extsrc
   file: dist/canvas-ribbon.min.js
@@ -131,7 +131,7 @@ fancybox_v4:
 medium_zoom:
   name: medium-zoom
   file: dist/medium-zoom.min.js
-  version: 1.0.6
+  version: 1.0.8
 snackbar_css:
   name: node-snackbar
   file: dist/snackbar.min.css
@@ -144,7 +144,7 @@ fontawesomeV6:
   name: '@fortawesome/fontawesome-free'
   file: css/all.min.css
   other_name: font-awesome
-  version: 6.2.0
+  version: 6.2.1
 flickr_justified_gallery_js:
   name: flickr-justified-gallery
   file: dist/fjGallery.min.js
@@ -183,11 +183,11 @@ prismjs_autoloader:
 artalk_js:
   name: artalk
   file: dist/Artalk.js
-  version: 2.4.3
+  version: 2.4.4
 artalk_css:
   name: artalk
   file: dist/Artalk.css
-  version: 2.4.3
+  version: 2.4.4
 pace_js:
   name: pace-js
   other_name: pace
diff --git a/scripts/events/cdn.js b/scripts/events/cdn.js
index 7d77e63..9c1b2c1 100644
--- a/scripts/events/cdn.js
+++ b/scripts/events/cdn.js
@@ -12,7 +12,7 @@ hexo.extend.filter.register('before_generate', () => {
   const themeConfig = hexo.theme.config
   const { CDN } = themeConfig
 
-  const thirdPartySrc = hexo.render.renderSync({ path: path.join(hexo.theme_dir,'/plugins.yml'), engine: 'yaml'})
+  const thirdPartySrc = hexo.render.renderSync({ path: path.join(hexo.theme_dir, '/plugins.yml'), engine: 'yaml' })
   const internalSrc = {
     main: {
       name: 'hexo-theme-butterfly',
@@ -46,7 +46,7 @@ hexo.extend.filter.register('before_generate', () => {
   }
 
   const createCDNLink = (data, type, cond = '') => {
-    Object.keys(data).map(key => {
+    Object.keys(data).forEach(key => {
       let { name, version, file, other_name } = data[key]
 
       const min_file = minFile(file)
@@ -65,6 +65,7 @@ hexo.extend.filter.register('before_generate', () => {
         min_cdnjs_file,
         cdnjs_name
       }
+
       const cdnSource = {
         local: cond === 'internal' ? cdnjs_file : `/pluginsSrc/${name}/${file}`,
         jsdelivr: `https://cdn.jsdelivr.net/npm/${name}${verType}/${min_file}`,
@@ -72,11 +73,11 @@ hexo.extend.filter.register('before_generate', () => {
         cdnjs: `https://cdnjs.cloudflare.com/ajax/libs/${cdnjs_name}/${version}/${min_cdnjs_file}`,
         custom: (CDN.custom_format || '').replace(/\$\{(.+?)\}/g, (match, $1) => value[$1])
       }
-      
+
       data[key] = cdnSource[type]
     })
 
-    if (cond === 'internal') data['main_css'] = 'css/index.css'
+    if (cond === 'internal') data.main_css = 'css/index.css'
     return data
   }
 
@@ -89,6 +90,6 @@ hexo.extend.filter.register('before_generate', () => {
     return obj
   }
 
-  themeConfig.asset = Object.assign(createCDNLink(internalSrc,CDN.internal_provider,'internal'),
-  createCDNLink(thirdPartySrc,CDN.third_party_provider), deleteNullValue(CDN.option))
+  themeConfig.asset = Object.assign(createCDNLink(internalSrc, CDN.internal_provider, 'internal'),
+    createCDNLink(thirdPartySrc, CDN.third_party_provider), deleteNullValue(CDN.option))
 })
diff --git a/scripts/events/comment.js b/scripts/events/comment.js
index b1ef856..ebbe439 100644
--- a/scripts/events/comment.js
+++ b/scripts/events/comment.js
@@ -11,4 +11,4 @@ hexo.extend.filter.register('before_generate', () => {
   }
   const newArray = use.map(item => item.toLowerCase().replace(/\b[a-z]/g, s => s.toUpperCase()))
   themeConfig.comments.use = newArray
-})
\ No newline at end of file
+})
diff --git a/scripts/filters/random_cover.js b/scripts/filters/random_cover.js
index dacf563..ffb61e4 100644
--- a/scripts/filters/random_cover.js
+++ b/scripts/filters/random_cover.js
@@ -24,7 +24,7 @@ hexo.extend.filter.register('before_post_render', function (data) {
     const num = Math.floor(Math.random() * theme.cover.default_cover.length)
     return theme.cover.default_cover[num]
   }
-  
+
   if (coverVal === false) return data
 
   // If cover is not set, use random cover
@@ -42,4 +42,4 @@ hexo.extend.filter.register('before_post_render', function (data) {
   }
 
   return data
-})
\ No newline at end of file
+})
diff --git a/scripts/helpers/findArchiveLength.js b/scripts/helpers/findArchiveLength.js
index e55dc0f..56e9bcb 100644
--- a/scripts/helpers/findArchiveLength.js
+++ b/scripts/helpers/findArchiveLength.js
@@ -1,13 +1,13 @@
 hexo.extend.helper.register('findArchiveLength', function (func) {
-  const allPostsLength = this.site.posts.length;
-  if (hexo.config.archive_generator && hexo.config.archive_generator.enable === false ) return allPostsLength
+  const allPostsLength = this.site.posts.length
+  if (hexo.config.archive_generator && hexo.config.archive_generator.enable === false) return allPostsLength
   const { yearly, monthly, daily } = hexo.config.archive_generator
   const { year, month, day } = this.page
   if (yearly === false || !year) return allPostsLength
 
   const posts = this.site.posts.sort('date')
 
-  const compareFunc = (type,y1,m1,d1,y2,m2,d2) => {
+  const compareFunc = (type, y1, m1, d1, y2, m2, d2) => {
     if (type === 'year') {
       return y1 === y2
     } else if (type === 'month') {
@@ -18,15 +18,15 @@ hexo.extend.helper.register('findArchiveLength', function (func) {
   }
 
   const generateDateObj = (type) => {
-    let dateObj = []
+    const dateObj = []
     let length = 0
 
     posts.forEach(post => {
-      let date = post.date.clone()
+      const date = post.date.clone()
       const year = date.year()
       const month = date.month() + 1
       const day = date.date()
-      let lastData = dateObj[length - 1]
+      const lastData = dateObj[length - 1]
 
       if (!lastData || !compareFunc(type, lastData.year, lastData.month, lastData.day, year, month, day)) {
         const name = type === 'year' ? year : type === 'month' ? `${year}-${month}` : `${year}-${month}-${day}`
@@ -40,12 +40,12 @@ hexo.extend.helper.register('findArchiveLength', function (func) {
       } else {
         lastData.count++
       }
-    });
+    })
 
     return dateObj
   }
 
-  const data = func('createArchiveObj', ()=> {
+  const data = func('createArchiveObj', () => {
     const yearObj = yearly ? generateDateObj('year') : []
     const monthObj = monthly ? generateDateObj('month') : []
     const dayObj = daily ? generateDateObj('day') : []
@@ -55,4 +55,4 @@ hexo.extend.helper.register('findArchiveLength', function (func) {
 
   const name = month ? day ? `${year}-${month}-${day}` : `${year}-${month}` : year
   return data.find(item => item.name === name).count
-})
\ No newline at end of file
+})
diff --git a/scripts/helpers/inject_head_js.js b/scripts/helpers/inject_head_js.js
index 9c845d4..387c45d 100644
--- a/scripts/helpers/inject_head_js.js
+++ b/scripts/helpers/inject_head_js.js
@@ -9,8 +9,8 @@ hexo.extend.helper.register('inject_head_js', function () {
   const { darkmode, aside } = this.theme
 
   const { theme_color } = hexo.theme.config
-  const themeColorLight = theme_color && theme_color.enable && theme_color.meta_theme_color_light || '#ffffff'
-  const themeColorDark = theme_color && theme_color.enable && theme_color.meta_theme_color_dark || '#0d0d0d'
+  const themeColorLight = (theme_color && theme_color.enable && theme_color.meta_theme_color_light) || '#ffffff'
+  const themeColorDark = (theme_color && theme_color.enable && theme_color.meta_theme_color_dark) || '#0d0d0d'
 
   const localStore = `
     win.saveToLocal = {
diff --git a/scripts/helpers/page.js b/scripts/helpers/page.js
index 8e3f892..35e05a8 100644
--- a/scripts/helpers/page.js
+++ b/scripts/helpers/page.js
@@ -74,8 +74,8 @@ hexo.extend.helper.register('injectHtml', function (data) {
 hexo.extend.helper.register('findArchivesTitle', function (page, menu, date) {
   if (page.year) {
     const dateStr = page.month ? `${page.year}-${page.month}` : `${page.year}`
-    const date_format = page.month ? hexo.theme.config.aside.card_archives.format : 'YYYY'
-    return date(dateStr, date_format)
+    const dateFormat = page.month ? hexo.theme.config.aside.card_archives.format : 'YYYY'
+    return date(dateStr, dateFormat)
   }
 
   const defaultTitle = this._p('page.archives')
@@ -102,4 +102,4 @@ hexo.extend.helper.register('isImgOrUrl', function (path) {
     return true
   }
   return false
-})
\ No newline at end of file
+})
diff --git a/scripts/tag/gallery.js b/scripts/tag/gallery.js
index acccd0b..e7c2d69 100644
--- a/scripts/tag/gallery.js
+++ b/scripts/tag/gallery.js
@@ -1,6 +1,8 @@
 /**
  * Butterfly
- * galleryGroup and allery
+ * galleryGroup and gallery
+ * {% galleryGroup [name] [descr] [url] [img] %}
+ * {% gallery [lazyload],[rowHeight],[limit] %}
  */
 
 'use strict'
@@ -8,13 +10,38 @@
 const urlFor = require('hexo-util').url_for.bind(hexo)
 
 function gallery (args, content) {
-  return `<div class="fj-gallery">${hexo.render.renderSync({ text: content, engine: 'markdown' }).split('\n').join('')}
-          </div>`
+  const { data, languages } = hexo.theme.i18n
+  args = args.join(' ').split(',')
+  const rowHeight = args[1] || 220
+  const limit = args[2] || 10
+  const lazyload = args[0] === 'true'
+  const regex = /!\[(.*?)\]\((.*?)\s*(?:["'](.*?)["']?)?\s*\)/g
+  const lazyloadClass = lazyload ? 'lazyload' : ''
+  let m
+  const arr = []
+  while ((m = regex.exec(content)) !== null) {
+    if (m.index === regex.lastIndex) {
+      regex.lastIndex++
+    }
+
+    arr.push({
+      url: m[2],
+      alt: m[1],
+      title: m[3]
+    })
+  }
+
+  return `<div class="gallery">
+    <div class="fj-gallery ${lazyloadClass}" data-rowHeight="${rowHeight}" data-limit="${limit}">
+    <span class="gallery-data">${JSON.stringify(arr)}</span>
+    </div>
+    <button class="gallery-load-more"><span>${data[languages[0]].load_more}</span><i class="fa-solid fa-arrow-down"></i></button>
+    </div>`
 }
 
 function galleryGroup (args) {
   const name = args[0]
-  const desrc = args[1]
+  const descr = args[1]
   const url = urlFor(args[2])
   const img = urlFor(args[3])
 
@@ -23,7 +50,7 @@ function galleryGroup (args) {
   <img class="gallery-group-img no-lightbox" src='${img}' alt="Group Image Gallery">
   <figcaption>
   <div class="gallery-group-name">${name}</div>
-  <p>${desrc}</p>
+  <p>${descr}</p>
   <a href='${url}'></a>
   </figcaption>
   </figure>
diff --git a/source/css/_layout/head.styl b/source/css/_layout/head.styl
index dcac7f9..aba4c44 100644
--- a/source/css/_layout/head.styl
+++ b/source/css/_layout/head.styl
@@ -137,6 +137,10 @@
       box-shadow: 0 5px 6px -5px alpha($grey, .6)
       transition: transform .2s ease-in-out, opacity .2s ease-in-out
 
+      &.fixed
+        top: 0
+        transition: all .5s
+
       #blog-info
         color: var(--font-color)
 
@@ -155,7 +159,7 @@
           color: $light-blue
 
   &.nav-visible
-    #nav
+    #nav:not(.fixed)
       transition: all .5s
       transform: translate3d(0, 100%, 0)
 
@@ -261,6 +265,9 @@
   &.show
     opacity: 1
 
+  &.fixed
+    position: fixed
+
   #blog-info
     flex: 1
     color: var(--light-grey)
diff --git a/source/css/_mode/readmode.styl b/source/css/_mode/readmode.styl
index 88da5d3..baca44d 100644
--- a/source/css/_mode/readmode.styl
+++ b/source/css/_mode/readmode.styl
@@ -106,7 +106,7 @@ if hexo-config('readmode')
           color: var(--font-color) !important
 
         .hljs
-          background: var(-highlight-bg) !important
+          background: var(--highlight-bg) !important
 
       h1,
       h2,
diff --git a/source/css/_search/algolia.styl b/source/css/_search/algolia.styl
index e9f06ce..69530ef 100644
--- a/source/css/_search/algolia.styl
+++ b/source/css/_search/algolia.styl
@@ -28,7 +28,7 @@
 
     .algolia-hit-item-content
       margin: 0 0 8px
-      word-break: break-all
+      word-break: break-word
 
     .ais-Pagination
       margin: 20px 0 0
@@ -69,6 +69,8 @@
     #algolia-hits
       > div
         overflow-y: scroll
+        margin: 0 -20px
+        padding: 0 22px
 
         +minWidth768()
           max-height: calc(80vh - 240px)
diff --git a/source/css/_search/local-search.styl b/source/css/_search/local-search.styl
index 36dd38d..3e707a9 100644
--- a/source/css/_search/local-search.styl
+++ b/source/css/_search/local-search.styl
@@ -51,15 +51,17 @@
           color: $search-color
 
       .search-result
-        margin: 0 8px 8px 0
-        word-break: break-all
+        margin: 0 0 8px
+        word-break: break-word
 
       .search-keyword
         color: $search-keyword-highlight
         font-weight: bold
 
     .search-result-list
-      overflow-y: auto
+      overflow-y: overlay
+      margin: 0 -20px
+      padding: 0 22px
       max-height: calc(80vh - 130px)
 
       +maxWidth768()
diff --git a/source/css/_tags/gallery.styl b/source/css/_tags/gallery.styl
index 2be3d5d..6fe035f 100644
--- a/source/css/_tags/gallery.styl
+++ b/source/css/_tags/gallery.styl
@@ -94,9 +94,46 @@
     overflow: auto
     padding: 0 0 16px
 
-  .fj-gallery
+  .gallery
     margin: 0 0 16px
-    opacity: 0
+    text-align: center
 
-    .img-alt
-      display: none
\ No newline at end of file
+    .fj-gallery
+      opacity: 0
+
+      .img-alt
+        display: none
+
+      &.lazyload
+        + button
+          display: inline-block
+
+      .gallery-data
+        display: none
+
+    button
+      display: none
+      margin-top: 25px
+      padding: 10px
+      width: 9em
+      border-radius: 5px
+      background: var(--btn-bg)
+      color: var(--btn-color)
+      font-weight: bold
+      font-size: 1.1em
+      transition: all .3s
+
+      & > *
+        transition: all .4s
+
+      i
+        width: 0
+        opacity: 0
+
+      &:hover
+        background: var(--btn-hover-color)
+
+        i
+          margin-left: 2px
+          width: 20px
+          opacity: 1
diff --git a/source/js/main.js b/source/js/main.js
index e57206c..595e194 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -232,14 +232,42 @@ document.addEventListener('DOMContentLoaded', function () {
    * justified-gallery 圖庫排版
    */
   const runJustifiedGallery = function (ele) {
-    ele.forEach(item => {
-      const $imgList = item.querySelectorAll('img')
-
-      $imgList.forEach(i => {
-        const dataLazySrc = i.getAttribute('data-lazy-src')
-        if (dataLazySrc) i.src = dataLazySrc
-        btf.wrap(i, 'div', { class: 'fj-gallery-item' })
+    const htmlStr = arr => {
+      let str = ''
+      const replaceDq = str => str.replace(/"/g, '&quot;') // replace double quotes to &quot;
+      arr.forEach(i => {
+        const alt = i.alt ? `alt="${replaceDq(i.alt)}"` : ''
+        const title = i.title ? `title="${replaceDq(i.title)}"` : ''
+        str += `<div class="fj-gallery-item"><img src="${i.url}" ${alt + title}"></div>`
       })
+      return str
+    }
+
+    const lazyloadFn = (i, arr) => {
+      const loadItem = i.getAttribute('data-limit')
+      const arrLength = arr.length
+      if (arrLength > loadItem) i.insertAdjacentHTML('beforeend', htmlStr(arr.splice(0, loadItem)))
+      else {
+        i.insertAdjacentHTML('beforeend', htmlStr(arr))
+        i.classList.remove('lazyload')
+      }
+      return arrLength > loadItem ? loadItem : arrLength
+    }
+
+    ele.forEach(item => {
+      const arr = JSON.parse(item.querySelector('.gallery-data').textContent)
+      if (!item.classList.contains('lazyload')) item.innerHTML = htmlStr(arr)
+      else {
+        lazyloadFn(item, arr)
+        const limit = item.getAttribute('data-limit')
+        const clickBtnFn = () => {
+          const lastItemLength = lazyloadFn(item, arr)
+          fjGallery(item, 'appendImages', item.querySelectorAll(`.fj-gallery-item:nth-last-child(-n+${lastItemLength})`))
+          btf.loadLightbox(item.querySelectorAll('img'))
+          lastItemLength < limit && item.nextElementSibling.removeEventListener('click', clickBtnFn)
+        }
+        item.nextElementSibling.addEventListener('click', clickBtnFn)
+      }
     })
 
     if (window.fjGallery) {
@@ -258,13 +286,12 @@ document.addEventListener('DOMContentLoaded', function () {
    * rightside scroll percent
    */
   const rightsideScrollPercent = currentTop => {
-    const perNum = btf.getScrollPercent(currentTop,document.body)
+    const perNum = btf.getScrollPercent(currentTop, document.body)
     const $goUp = document.getElementById('go-up')
-    if ( perNum < 95 ) {
+    if (perNum < 95) {
       $goUp.classList.add('show-percent')
       $goUp.querySelector('.scroll-percent').textContent = perNum
-    }
-    else {
+    } else {
       $goUp.classList.remove('show-percent')
     }
   }
@@ -297,41 +324,40 @@ document.addEventListener('DOMContentLoaded', function () {
     const isShowPercent = GLOBAL_CONFIG.percent.rightside
 
     const scrollTask = btf.throttle(() => {
-        const currentTop = window.scrollY || document.documentElement.scrollTop
-        const isDown = scrollDirection(currentTop)
-        if (currentTop > 56) {
-          if (isDown) {
-            if ($header.classList.contains('nav-visible')) $header.classList.remove('nav-visible')
-            if (isChatBtnShow && isChatShow === true) {
-              chatBtnHide()
-              isChatShow = false
-            }
-          } else {
-            if (!$header.classList.contains('nav-visible')) $header.classList.add('nav-visible')
-            if (isChatBtnHide && isChatShow === false) {
-              chatBtnShow()
-              isChatShow = true
-            }
-          }
-          $header.classList.add('nav-fixed')
-          if (window.getComputedStyle($rightside).getPropertyValue('opacity') === '0') {
-            $rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
+      const currentTop = window.scrollY || document.documentElement.scrollTop
+      const isDown = scrollDirection(currentTop)
+      if (currentTop > 56) {
+        if (isDown) {
+          if ($header.classList.contains('nav-visible')) $header.classList.remove('nav-visible')
+          if (isChatBtnShow && isChatShow === true) {
+            chatBtnHide()
+            isChatShow = false
           }
         } else {
-          if (currentTop === 0) {
-            $header.classList.remove('nav-fixed', 'nav-visible')
+          if (!$header.classList.contains('nav-visible')) $header.classList.add('nav-visible')
+          if (isChatBtnHide && isChatShow === false) {
+            chatBtnShow()
+            isChatShow = true
           }
-          $rightside.style.cssText = "opacity: ''; transform: ''"
         }
-
-        isShowPercent && rightsideScrollPercent(currentTop)
-
-        if (document.body.scrollHeight <= innerHeight) {
+        $header.classList.add('nav-fixed')
+        if (window.getComputedStyle($rightside).getPropertyValue('opacity') === '0') {
           $rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
         }
+      } else {
+        if (currentTop === 0) {
+          $header.classList.remove('nav-fixed', 'nav-visible')
+        }
+        $rightside.style.cssText = "opacity: ''; transform: ''"
+      }
+
+      isShowPercent && rightsideScrollPercent(currentTop)
+
+      if (document.body.scrollHeight <= innerHeight) {
+        $rightside.style.cssText = 'opacity: 0.8; transform: translateX(-58px)'
+      }
+    }, 200)
 
-      }, 200)
-    
     window.scrollCollect = scrollTask
 
     window.addEventListener('scroll', scrollCollect)
@@ -444,14 +470,14 @@ document.addEventListener('DOMContentLoaded', function () {
     }
 
     // main of scroll
-    window.tocScrollFn = btf.throttle(()=>{
-        const currentTop = window.scrollY || document.documentElement.scrollTop
-        if (isToc && GLOBAL_CONFIG.percent.toc) {
-          $tocPercentage.textContent = btf.getScrollPercent(currentTop,$article)
-        }
-        findHeadPosition(currentTop)
-      }, 100)
-    
+    window.tocScrollFn = btf.throttle(() => {
+      const currentTop = window.scrollY || document.documentElement.scrollTop
+      if (isToc && GLOBAL_CONFIG.percent.toc) {
+        $tocPercentage.textContent = btf.getScrollPercent(currentTop, $article)
+      }
+      findHeadPosition(currentTop)
+    }, 100)
+
     window.addEventListener('scroll', tocScrollFn)
   }
 
diff --git a/source/js/search/algolia.js b/source/js/search/algolia.js
index f0b9f3a..338c617 100644
--- a/source/js/search/algolia.js
+++ b/source/js/search/algolia.js
@@ -56,7 +56,7 @@ window.addEventListener('load', () => {
       post = '...'
     }
 
-    let matchContent = pre + content.substring(start, end) + post
+    const matchContent = pre + content.substring(start, end) + post
     return matchContent
   }
 
@@ -68,10 +68,11 @@ window.addEventListener('load', () => {
 
   const search = instantsearch({
     indexName: algolia.indexName,
+    /* global algoliasearch */
     searchClient: algoliasearch(algolia.appId, algolia.apiKey),
-    searchFunction(helper) {
+    searchFunction (helper) {
       helper.state.query && helper.search()
-    },
+    }
   })
 
   const configure = instantsearch.widgets.configure({
@@ -89,16 +90,16 @@ window.addEventListener('load', () => {
   const hits = instantsearch.widgets.hits({
     container: '#algolia-hits',
     templates: {
-      item(data) {
+      item (data) {
         const link = data.permalink ? data.permalink : (GLOBAL_CONFIG.root + data.path)
         const result = data._highlightResult
         const content = result.contentStripTruncate
-                        ? cutContent(result.contentStripTruncate.value)
-                        : result.contentStrip
-                        ? cutContent(result.contentStrip.value)
-                        : result.content
-                        ? cutContent(result.content.value)
-                        : ''
+          ? cutContent(result.contentStripTruncate.value)
+          : result.contentStrip
+            ? cutContent(result.contentStrip.value)
+            : result.content
+              ? cutContent(result.content.value)
+              : ''
         return `
           <a href="${link}" class="algolia-hit-item-link">
           ${result.title.value || 'no-title'}
@@ -130,7 +131,7 @@ window.addEventListener('load', () => {
   })
 
   const powerBy = instantsearch.widgets.poweredBy({
-    container: '#algolia-info > .algolia-poweredBy',
+    container: '#algolia-info > .algolia-poweredBy'
   })
 
   const pagination = instantsearch.widgets.pagination({
@@ -144,8 +145,7 @@ window.addEventListener('load', () => {
     }
   })
 
-
-  search.addWidgets([configure,searchBox,hits,stats,powerBy,pagination]) // add the widgets to the instantsearch instance
+  search.addWidgets([configure, searchBox, hits, stats, powerBy, pagination]) // add the widgets to the instantsearch instance
 
   search.start()
 
diff --git a/source/js/search/local-search.js b/source/js/search/local-search.js
index 6404822..11aa72a 100644
--- a/source/js/search/local-search.js
+++ b/source/js/search/local-search.js
@@ -56,7 +56,7 @@ window.addEventListener('load', () => {
       const res = await response.text()
       const t = await new window.DOMParser().parseFromString(res, 'text/xml')
       const a = await t
-      data = [...a.querySelectorAll('entry')].map(item =>{
+      data = [...a.querySelectorAll('entry')].map(item => {
         return {
           title: item.querySelector('title').textContent,
           content: item.querySelector('content') && item.querySelector('content').textContent,
@@ -154,7 +154,7 @@ window.addEventListener('load', () => {
               // highlight all keywords
               keywords.forEach(keyword => {
                 let regexStr = keyword
-                const specialRegex = new RegExp("[^\\w\\s]+") // match special characters
+                const specialRegex = /[^\w\s]+/ // match special characters
                 if (keyword.length === 1 && specialRegex.test(keyword)) {
                   regexStr = `\\${keyword}`
                 }
diff --git a/source/js/utils.js b/source/js/utils.js
index 3460b6a..42d438b 100644
--- a/source/js/utils.js
+++ b/source/js/utils.js
@@ -62,10 +62,10 @@ const btf = {
     const { position, bgLight, bgDark } = GLOBAL_CONFIG.Snackbar
     const bg = document.documentElement.getAttribute('data-theme') === 'light' ? bgLight : bgDark
     Snackbar.show({
-      text: text,
+      text,
       backgroundColor: bg,
-      showAction: showAction,
-      duration: duration,
+      showAction,
+      duration,
       pos: position,
       customClass: 'snackbar-css'
     })
@@ -88,7 +88,7 @@ const btf = {
       const minuteCount = dateDiff / minute
 
       if (monthCount > 12) {
-        result = datePost.toISOString().slice(0,10)
+        result = datePost.toISOString().slice(0, 10)
       } else if (monthCount >= 1) {
         result = parseInt(monthCount) + ' ' + GLOBAL_CONFIG.date_suffix.month
       } else if (dayCount >= 1) {
@@ -186,12 +186,12 @@ const btf = {
    * @param {*} options object key: value
    */
   wrap: (selector, eleType, options) => {
-    const creatEle = document.createElement(eleType)
+    const createEle = document.createElement(eleType)
     for (const [key, value] of Object.entries(options)) {
-      creatEle.setAttribute(key, value)
+      createEle.setAttribute(key, value)
     }
-    selector.parentNode.insertBefore(creatEle, selector)
-    creatEle.appendChild(selector)
+    selector.parentNode.insertBefore(createEle, selector)
+    createEle.appendChild(selector)
   },
 
   unwrap: el => {
@@ -255,7 +255,7 @@ const btf = {
       if (!btf.isHidden(i)) {
         fjGallery(i, {
           itemSelector: '.fj-gallery-item',
-          rowHeight: 220,
+          rowHeight: i.getAttribute('data-rowHeight'),
           gutter: 4,
           onJustify: function () {
             this.$container.style.opacity = '1'
@@ -271,12 +271,12 @@ const btf = {
       const title = GLOBAL_CONFIG_SITE.title
       window.history.replaceState({
         url: location.href,
-        title: title
+        title
       }, title, anchor)
     }
   },
 
-  getScrollPercent: (currentTop,ele) => {
+  getScrollPercent: (currentTop, ele) => {
     const docHeight = ele.clientHeight
     const winHeight = document.documentElement.clientHeight
     const headerHeight = ele.offsetTop

From 929a5608d33a35625a66c73bc442cab1fbcb1d7f Mon Sep 17 00:00:00 2001
From: Jerry <hwy0127@gmail.com>
Date: Sun, 15 Jan 2023 01:39:16 +0800
Subject: [PATCH 9/9] =?UTF-8?q?fix:=20=E4=BF=AE=E5=BE=A9=20pjax=20?=
 =?UTF-8?q?=E4=B8=8B=EF=BC=8C=20waline=20js=20=E6=9C=83=E9=87=8D=E8=A4=87?=
 =?UTF-8?q?=E5=8A=A0=E8=BC=89=E7=9A=84=20bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _config.yml                                   |  3 +-
 .../third-party/card-post-count/waline.pug    |  2 +-
 .../includes/third-party/comments/artalk.pug  |  9 +-----
 .../third-party/comments/disqusjs.pug         |  9 +-----
 .../includes/third-party/comments/gitalk.pug  |  9 +-----
 .../includes/third-party/comments/waline.pug  | 14 +++-----
 .../third-party/newest-comments/waline.pug    |  2 +-
 layout/includes/third-party/subtitle.pug      | 32 +++++++++++++++++++
 package.json                                  |  2 +-
 plugins.yml                                   |  4 +--
 scripts/helpers/inject_head_js.js             | 13 +++++++-
 source/js/main.js                             |  5 +--
 12 files changed, 59 insertions(+), 45 deletions(-)

diff --git a/_config.yml b/_config.yml
index bc7d22a..b3f79af 100644
--- a/_config.yml
+++ b/_config.yml
@@ -634,7 +634,8 @@ subtitle:
   # source 調用第三方服務
   # source: false 關閉調用
   # source: 1  調用一言網的一句話（簡體） https://hitokoto.cn/
-  # source: 2  調用今日詩詞（簡體） https://www.jinrishici.com/
+  # source: 2  調用一句網（簡體） https://yijuzhan.com/
+  # source: 3  調用今日詩詞（簡體） https://www.jinrishici.com/
   # subtitle 會先顯示 source , 再顯示 sub 的內容
   source: false
   # 如果關閉打字效果，subtitle 只會顯示 sub 的第一行文字
diff --git a/layout/includes/third-party/card-post-count/waline.pug b/layout/includes/third-party/card-post-count/waline.pug
index c43a18d..e69237f 100644
--- a/layout/includes/third-party/card-post-count/waline.pug
+++ b/layout/includes/third-party/card-post-count/waline.pug
@@ -10,7 +10,7 @@ script.
         const waline = Waline.init(initData)
       }
 
-      if (typeof Waline === 'function') initWaline() 
+      if (typeof Waline === 'object') initWaline() 
       else getScript('!{url_for(theme.asset.waline_js)}').then(initWaline)
     }
 
diff --git a/layout/includes/third-party/comments/artalk.pug b/layout/includes/third-party/comments/artalk.pug
index 97a5cd5..2a3bf22 100644
--- a/layout/includes/third-party/comments/artalk.pug
+++ b/layout/includes/third-party/comments/artalk.pug
@@ -1,13 +1,6 @@
 - const { server, site, option } = theme.artalk
 
 script.
-  function addArtalkSource () {
-    const ele = document.createElement('link')
-    ele.rel = 'stylesheet'
-    ele.href= '!{theme.asset.artalk_css}'
-    document.getElementsByTagName('head')[0].appendChild(ele)
-  }
-
   function loadArtalk () {
     function initArtalk () {
       window.artalkItem = new Artalk(Object.assign({
@@ -22,7 +15,7 @@ script.
 
     if (typeof window.artalkItem === 'object') setTimeout(()=>{initArtalk()},200)
     else {
-      addArtalkSource()
+      getCSS('!{theme.asset.artalk_css}')
       typeof Artalk !== 'function' ? getScript('!{theme.asset.artalk_js}').then(initArtalk)
                                   : setTimeout(()=>{initArtalk()},200)
     }
diff --git a/layout/includes/third-party/comments/disqusjs.pug b/layout/includes/third-party/comments/disqusjs.pug
index 1e66555..2b4a5f4 100644
--- a/layout/includes/third-party/comments/disqusjs.pug
+++ b/layout/includes/third-party/comments/disqusjs.pug
@@ -2,13 +2,6 @@
 
 script.
   function loadDisqusjs () {
-    function addDisqusjsCSS () {
-      const ele = document.createElement('link')
-      ele.rel = 'stylesheet'
-      ele.href= '!{url_for(theme.asset.disqusjs_css)}'
-      document.getElementsByTagName('head')[0].appendChild(ele)
-    }
-
     function initDisqusjs () {
       window.disqusjs = null
       disqusjs = new DisqusJS(Object.assign({
@@ -34,7 +27,7 @@ script.
 
     if (window.disqusJsLoad) initDisqusjs()
     else {
-      addDisqusjsCSS()
+      getCSS('!{url_for(theme.asset.disqusjs_css)}')
       getScript('!{url_for(theme.asset.disqusjs)}').then(initDisqusjs)
       window.disqusJsLoad = true
     }
diff --git a/layout/includes/third-party/comments/gitalk.pug b/layout/includes/third-party/comments/gitalk.pug
index fccb64d..e162cce 100644
--- a/layout/includes/third-party/comments/gitalk.pug
+++ b/layout/includes/third-party/comments/gitalk.pug
@@ -1,11 +1,4 @@
 script.
-  function addGitalkSource () {
-    const ele = document.createElement('link')
-    ele.rel = 'stylesheet'
-    ele.href= '!{url_for(theme.asset.gitalk_css)}'
-    document.getElementsByTagName('head')[0].appendChild(ele)
-  }
-
   function loadGitalk () {
     function initGitalk () {
       var gitalk = new Gitalk(Object.assign({
@@ -23,7 +16,7 @@ script.
 
     if (typeof Gitalk === 'function') initGitalk()
     else {
-      addGitalkSource()
+      getCSS('!{url_for(theme.asset.gitalk_css)}')
       getScript('!{url_for(theme.asset.gitalk)}').then(initGitalk)
     }
   }
diff --git a/layout/includes/third-party/comments/waline.pug b/layout/includes/third-party/comments/waline.pug
index 06e8078..55c7b45 100644
--- a/layout/includes/third-party/comments/waline.pug
+++ b/layout/includes/third-party/comments/waline.pug
@@ -3,13 +3,6 @@
 
 script.
   function loadWaline () {
-    function insertCSS () {
-      const link = document.createElement("link")
-      link.rel = "stylesheet"
-      link.href = "!{url_for(theme.asset.waline_css)}"
-      document.head.appendChild(link)
-    }
-
     function initWaline () {
       const waline = Waline.init(Object.assign({
         el: '#waline-wrap',
@@ -21,10 +14,11 @@ script.
       }, !{JSON.stringify(option)}))
     }
 
-    if (typeof Waline === 'function') initWaline()
+    if (typeof Waline === 'object') initWaline()
     else {
-      insertCSS()
-      getScript('!{url_for(theme.asset.waline_js)}').then(initWaline)
+      getCSS('!{url_for(theme.asset.waline_css)}').then(() => {
+        getScript('!{url_for(theme.asset.waline_js)}').then(initWaline)
+      })
     }
   }
 
diff --git a/layout/includes/third-party/newest-comments/waline.pug b/layout/includes/third-party/newest-comments/waline.pug
index 15ca44c..565f6f4 100644
--- a/layout/includes/third-party/newest-comments/waline.pug
+++ b/layout/includes/third-party/newest-comments/waline.pug
@@ -64,7 +64,7 @@ script.
         }) 
       }
 
-      if (typeof Waline === 'function') loadWaline() 
+      if (typeof Waline === 'object') loadWaline()
       else getScript('!{url_for(theme.asset.waline_js)}').then(loadWaline)
     }
 
diff --git a/layout/includes/third-party/subtitle.pug b/layout/includes/third-party/subtitle.pug
index a565a66..9236757 100644
--- a/layout/includes/third-party/subtitle.pug
+++ b/layout/includes/third-party/subtitle.pug
@@ -36,6 +36,38 @@ case source
       }
 
   when 2
+    script.
+      function subtitleType () {
+        getScript('https://yijuzhan.com/api/word.php?m=js').then(() => {
+          const con = str[0]
+          if (!{effect}) {
+            const from = '出自 ' + str[1]
+            const sub = !{JSON.stringify(subContent)}
+            sub.unshift(con, from)
+            window.typed = new Typed('#subtitle', {
+              strings: sub,
+              startDelay: !{startDelay},
+              typeSpeed: !{typeSpeed},
+              loop: !{loop},
+              backSpeed: !{backSpeed},
+            })
+          } else {
+            document.getElementById('subtitle').innerHTML = con
+          }
+        })
+      }
+
+      if (!{effect}) {
+        if (typeof Typed === 'function') {
+          subtitleType()
+        } else {
+          getScript('!{url_for(theme.asset.typed)}').then(subtitleType)
+        }
+      } else {
+        subtitleType()
+      }
+
+  when 3
     script.
       function subtitleType () {
         getScript('https://sdk.jinrishici.com/v2/browser/jinrishici.js').then(() => {
diff --git a/package.json b/package.json
index 38f6ca7..bbe5b1f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "4.6.0-b4",
+  "version": "4.6.0",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {
diff --git a/plugins.yml b/plugins.yml
index 115c124..c183f69 100644
--- a/plugins.yml
+++ b/plugins.yml
@@ -42,12 +42,12 @@ waline_js:
   name: '@waline/client'
   file: dist/waline.js
   other_name: waline
-  version: 2.14.6
+  version: 2.14.7
 waline_css:
   name: '@waline/client'
   file: dist/waline.css
   other_name: waline
-  version: 2.14.6
+  version: 2.14.7
 sharejs:
   name: butterfly-extsrc
   file: sharejs/dist/js/social-share.min.js
diff --git a/scripts/helpers/inject_head_js.js b/scripts/helpers/inject_head_js.js
index 387c45d..88ff5f2 100644
--- a/scripts/helpers/inject_head_js.js
+++ b/scripts/helpers/inject_head_js.js
@@ -60,6 +60,17 @@ hexo.extend.helper.register('inject_head_js', function () {
     })
   `
 
+  const getCSS = `
+    win.getCSS = url => new Promise((resolve, reject) => {
+      const link = document.createElement('link')
+      link.rel = 'stylesheet'
+      link.href = url
+      link.onload = () => resolve()
+      link.onerror = () => reject()
+      document.head.appendChild(link)
+    })
+  `
+
   let darkmodeJs = ''
   if (darkmode.enable) {
     darkmodeJs = `
@@ -144,5 +155,5 @@ hexo.extend.helper.register('inject_head_js', function () {
     detectApple()
     `
 
-  return `<script>(win=>{${localStore + getScript + darkmodeJs + asideStatus + detectApple}})(window)</script>`
+  return `<script>(win=>{${localStore + getScript + getCSS + darkmodeJs + asideStatus + detectApple}})(window)</script>`
 })
diff --git a/source/js/main.js b/source/js/main.js
index 595e194..80cff14 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -275,10 +275,7 @@ document.addEventListener('DOMContentLoaded', function () {
       return
     }
 
-    const newEle = document.createElement('link')
-    newEle.rel = 'stylesheet'
-    newEle.href = GLOBAL_CONFIG.source.justifiedGallery.css
-    document.body.appendChild(newEle)
+    getCSS(`${GLOBAL_CONFIG.source.justifiedGallery.css}`)
     getScript(`${GLOBAL_CONFIG.source.justifiedGallery.js}`).then(() => { btf.initJustifiedGallery(ele) })
   }