fix: 修復 github-issues 最新評論 獲取的url格式 bug

fix: 當標題有符號'時，disqus 和 disqusjs 無法加載的 bug

README.md

@@ -12,8 +12,6 @@
 ![hexo version](https://img.shields.io/badge/hexo-5.0+-0e83c)
 ![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531)
 
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png)
-
 Demo: 👍 [Butterfly](https://butterfly.js.org/)  ||   🤞 [MYW](https://immyw.com/)
 
 Docs: 📖 [Butterfly Docs](https://butterfly.js.org/posts/21cfbf15/)
@@ -82,9 +80,9 @@ npm i hexo-theme-butterfly
 - [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo)
 - [x] Multiple Comment System Support
 - [x] Online Chats (Chatra/Tidio/Daovoice/Gitter/Crisp)
-- [x] Web analytics
+- [x] Web analytics (Baidu Analytics/Google Analytics/Tencent Analytics/CNZZ Analytics)
 - [x] Google AdSense
-- [x] Webmaster Verification
+- [x] Webmaster Verification (google/Bing/Baidu/360/Yandex)
 - [x] Change website colour scheme
 - [x] Typewriter Effect: activate_power_mode
 - [x] Background effects (Canvas ribbon/canvas_ribbon_piao/canvas_nest)
@@ -99,9 +97,6 @@ npm i hexo-theme-butterfly
 
 ## Screenshots
 
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg)
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg)
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg)
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg)
 ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/theme-butterfly-readme-homepage-1.png)
+
 ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/theme-butterfly-readme-homepage-2.png)

README_CN.md

@@ -12,8 +12,6 @@
 ![hexo version](https://img.shields.io/badge/hexo-5.0+-0e83c)
 ![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531)
 
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png)
-
 預覽: 👍 [Butterfly](https://butterfly.js.org/)  ||  🤞 [MYW](https://immyw.com/)
 
 文檔: 📖 [Butterfly Docs](https://butterfly.js.org/posts/21cfbf15/)
@@ -81,7 +79,7 @@ theme: butterfly
 - [X] 多種評論系統（Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo）
 - [x] 支持雙評論部署
 - [x] 多種在線聊天（Chatra/Tidio/Daovoice/Gitter/Crisp）
-- [x] 多種分析系統
+- [x] 多種分析系統（百度分析/谷歌分析/騰訊分析/CNZZ分析）
 - [x] 谷歌廣告/手動廣告位置
 - [x] 各種站長驗證（Google/Bing/Baidu/360/Yandex）
 - [x] 修改網站配色
@@ -98,9 +96,6 @@ theme: butterfly
 
 ## 截圖
 
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg)
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg)
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg)
-![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg)
 ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/theme-butterfly-readme-homepage-1.png)
+
 ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/theme-butterfly-readme-homepage-2.png)

_config.yml

@@ -4,7 +4,7 @@
 # format: name: link || icon
 # sub-menu
 # name || icon:
-#   name: link || icon
+#   name || link || icon
 
 menu:
   # Home: / || fas fa-home
@@ -274,7 +274,6 @@ comments:
 # https://disqus.com/
 disqus:
   shortname:
-  apikey: # For newest comments widget
 
 # Alternative Disqus - Render comments with Disqus API
 # DisqusJS 評論系統，可以實現在網路審查地區載入 Disqus 評論列表，兼容原版
@@ -332,7 +331,7 @@ valine:
 waline:
   serverURL: # Waline server address url
   avatar: monsterid # gravatar style https://zh-tw.gravatar.com/site/implement/images/#default-image
-  avatarCDN: # Gravatar CDN baseURL
+  emojiCDN: # emoji CDN
   bg: # waline background
   visitor: false
   option:
@@ -460,11 +459,25 @@ google_adsense:
 # Verification (站長驗證)
 # --------------------------------------
 
-site_verification:
+# Google Webmaster tools verification setting
-  # - name: google_site_verification
+# See: https://www.google.com/webmasters/
-  #   content: xxxxxx
+google_site_verification:
-  # - name: baidu_site_verification
+
-  #   content: xxxxxxx
+# Bing Webmaster tools verification setting
+# See: https://www.bing.com/webmaster/
+bing_site_verification:
+
+# Baidu Webmaster tools verification setting
+# See: https://ziyuan.baidu.com/site/
+baidu_site_verification:
+
+# 360 Webmaster tools verification setting
+# see http://zhanzhang.so.com/
+qihu_site_verification:
+
+# Yandex Webmaster tools verification setting
+# see https://webmaster.yandex.com/
+yandex_site_verification:
 
 # Beautify/Effect (美化/效果)
 # --------------------------------------
@@ -695,6 +708,17 @@ newest_comments:
   limit: 6
   storage: 10 # unit: mins, save data to localStorage
   avatar: true
+  # You can only choose one, or neither
+  valine: false
+  github_issues:
+    enable: false
+    repo:
+  disqus:
+    enable: false
+    forum:
+    api_key:
+  twikoo: false
+  waline: false
 
 # Bottom right button (右下角按鈕)
 # --------------------------------------
@@ -746,7 +770,7 @@ fancybox: true
 # --------------------------------------
 
 # mermaid
-# see https://github.com/mermaid-js/mermaid
+# see https://github.com/knsv/mermaid
 mermaid:
   enable: false
   # built-in themes: default/forest/dark/neutral
@@ -804,12 +828,10 @@ pangu:
   field: site # site/post
 
 # Lazyload (圖片懶加載)
-# https://github.com/verlok/vanilla-lazyload
+# https://github.com/verlok/lazyload
 lazyload:
   enable: false
-  field: site # site/post
+  post: /img/loading.gif
-  placeholder:
-  blur: false
 
 # PWA
 # See https://github.com/JLHwung/hexo-offline

layout/404.pug

@@ -0,0 +1,28 @@
+- var top_img = theme.error_404.background || theme.default_top_img
+- var bg_img = `background-image: url('${url_for(top_img)}')`
+
+doctype html
+html(lang=config.language data-theme=theme.display_mode)
+  head
+    include includes/head.pug
+  body
+    if theme.preloader
+      !=partial('includes/loading/loading', {}, {cache: true})
+
+    if theme.fireworks && theme.fireworks.enable
+      canvas.fireworks
+    
+    if theme.background
+      #web_bg
+
+    #error-wrap
+      .error-content
+        .error-img(style=bg_img)
+        .error-info
+          h1.error_title= '404'
+          .error_subtitle= theme.error_404.subtitle
+          a.button--animated(href=config.root)
+            i.fas.fa-rocket
+            = _p('error404.back_button')
+          
+    include includes/additional-js.pug

layout/includes/404.pug

@@ -1,17 +0,0 @@
-- var top_img = theme.error_404.background || theme.default_top_img
-- var bg_img = `background-image: url('${url_for(top_img)}')`
-
-#body-wrap.error404
-  div(style='display: none')
-    include ./header/index.pug
-
-  #error-wrap
-    .error-content
-      .error-img(style=bg_img)
-      .error-info
-        h1.error_title= '404'
-        .error_subtitle= theme.error_404.subtitle
-        a.button--animated(href=config.root)
-          i.fas.fa-rocket
-          = _p('error404.back_button')
-          

layout/includes/head.pug

@@ -1,5 +1,5 @@
 - var pageTitle
-- if (is_archive()) pageTitle = fragment_cache('findArchivesTitle', function(){return findArchivesTitle(theme.menu);})
+- if (is_archive()) pageTitle = _p('page.archives')
 - else if (is_tag()) pageTitle = _p('page.tag') + ': ' + page.tag
 - else if (is_category()) pageTitle = _p('page.category') + ': ' + page.category
 - else if (is_month()) pageTitle += ': ' + page.month + '/' + page.year

layout/includes/head/config_site.pug

@@ -6,16 +6,14 @@
 
   var pageToc = page.toc === true || page.toc === false ? page.toc : theme.toc.enable
   var showToc = is_post() && theme.aside.enable && pageToc && (toc(page.content) !== '' || page.encrypt == true )
-
-  let titleVal = pageTitle.replace(/'/ig,"\\'")
 -
 
-script#config-diff.
+script#config-diff
-  var GLOBAL_CONFIG_SITE = {
+  .
-    title: '!{titleVal}',
+    var GLOBAL_CONFIG_SITE = { 
-    isPost: !{is_post()},
+      isPost: !{is_post()},
-    isHome: !{is_home()},
+      isHome: !{is_home()},
-    isHighlightShrink: !{isHighlightShrink},
+      isHighlightShrink: !{isHighlightShrink},
-    isToc: !{showToc},
+      isToc: !{showToc},
-    postUpdate: '!{full_date(page.updated)}'
+      postUpdate: '!{full_date(page.updated)}'
-  }
+    }

layout/includes/head/site_verification.pug

@@ -1,3 +1,14 @@
-if theme.site_verification
+if theme.google_site_verification
-  each item in theme.site_verification
+  meta(name="google-site-verification" content=theme.google_site_verification)
-    meta(name=item.name content=item.content)
+
+if theme.bing_site_verification
+  meta(name="msvalidate.01" content=theme.bing_site_verification)
+
+if theme.baidu_site_verification
+  meta(name="baidu-site-verification" content=theme.baidu_site_verification)
+
+if theme.qihu_site_verification
+  meta(name="360-site-verification" content=theme.qihu_site_verification)
+
+if theme.yandex_site_verification
+  meta(name="yandex-verification" content=theme.yandex_site_verification)

layout/includes/header/index.pug

@@ -19,7 +19,7 @@ if !theme.disable_top_img && page.top_img !== false
   if top_img !== false
     - var imgSource = top_img && top_img.indexOf('/') !== -1 ? `background-image: url('${url_for(top_img)}')` : `background: ${top_img}`
     - var bg_img = top_img ? imgSource : ''
-    - var site_title = is_archive() ? fragment_cache('findArchivesTitle', function(){return findArchivesTitle(theme.menu);}) : page.title || page.tag || page.category || config.title
+    - var site_title = is_archive() ? _p('page.archives') : page.title || page.tag || page.category || config.title
     - var isHomeClass = is_home() ? 'full_page' : 'not-home-page'
     - is_post() ? isHomeClass = 'post-bg' : isHomeClass
   else

layout/includes/layout.pug

@@ -15,32 +15,28 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside
       
     !=partial('includes/sidebar', {}, {cache: true})
 
-    if page.type !== '404'
+    #body-wrap(class=pageType)
-      #body-wrap(class=pageType)
+      include ./header/index.pug
-        include ./header/index.pug
 
-        main#content-inner.layout(class=hideAside)
+      main#content-inner.layout(class=hideAside)
-          if body
+        if body
-            div!= body
+          div!= body
-          else
-            block content
-            if theme.aside.enable && page.aside !== false
-              include widget/index.pug
-
-        - var footerBg = theme.footer_bg
-        if (footerBg)
-          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}`
         else
-          - var footer_bg = ''
+          block content
+          if theme.aside.enable && page.aside !== false
+            include widget/index.pug
 
-        footer#footer(style=footer_bg)
+      - var footerBg = theme.footer_bg
-          !=partial('includes/footer', {}, {cache: true})
+      if (footerBg)
+        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}`
+      else
+        - var footer_bg = ''
 
-    else
+      footer#footer(style=footer_bg)
-      include ./404.pug
+        !=partial('includes/footer', {}, {cache: true})
 
     include ./rightside.pug
     !=partial('includes/third-party/search/index', {}, {cache: true})

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 theme.lazyload.enable
+              img(data-lazy-src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
+            else
+              img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
         .article-sort-item-info
           .article-sort-item-time
             i.far.fa-calendar-alt

layout/includes/mixins/post-ui.pug

@@ -9,7 +9,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 theme.lazyload.enable
+              img.post_bg(data-lazy-src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.error_img.post_page) + `'` alt=title)
+            else
+              img.post_bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.error_img.post_page) + `'` alt=title)
       .recent-post-info(class=no_cover)
         a.article-title(href=url_for(link) title=title)= title
         .article-meta-wrap

layout/includes/page/flink.pug

@@ -13,9 +13,11 @@
           each item in i.link_list
             .flink-list-item
               a(href=url_for(item.link)  title=item.name target="_blank")
-                .flink-item-icon
+                if theme.lazyload.enable
+                  img(data-lazy-src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
+                else
                   img(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
-                .flink-item-name= item.name 
+                span.flink-item-name= item.name 
-                .flink-item-desc(title=item.descr)= item.descr
+                span.flink-item-desc(title=item.descr)= item.descr
     != page.content
 

layout/includes/pagination.pug

@@ -15,7 +15,10 @@ if is_post()
       .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')
+          if theme.lazyload.enable
+            img.prev-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
+          else
+            img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
           .pagination-info
             .label=_p('pagination.prev')
             .prev_info=prev.title
@@ -25,7 +28,10 @@ if is_post()
       - 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')
+          if theme.lazyload.enable
+            img.next-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
+          else
+            img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
           .pagination-info
             .label=_p('pagination.next')
             .next_info=next.title

layout/includes/post/reward.pug

@@ -8,6 +8,9 @@
         - var clickTo = item.link ? item.link : item.img
         li.reward-item
           a(href=url_for(clickTo) target='_blank')
-            img.post-qr-code-img(src=url_for(item.img) alt=item.text)
+            if theme.lazyload.enable
+              img.post-qr-code-img(data-lazy-src=url_for(item.img) alt=item.text)
+            else
+              img.post-qr-code-img(src=url_for(item.img) alt=item.text)
           .post-qr-code-desc=item.text
 

layout/includes/sidebar.pug

@@ -1,8 +1,11 @@
 #sidebar
   #menu-mask
   #sidebar-menus
-    .avatar-img.is-center
+    .author-avatar
-      img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
+      if theme.lazyload.enable
+        img.avatar-img(data-lazy-src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
+      else
+        img.avatar-img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
     .site-data
       if site.posts.length
         .data-item.is-center

layout/includes/third-party/card-post-count/waline.pug

@@ -3,9 +3,10 @@ script.
     function loadWaline () {
       function initWaline () {
         let initData = {
-          el: null,
+          el: '#waline-wrap',
           serverURL: '!{theme.waline.serverURL}',
         }
+        
         const waline = new Waline(initData)
       }
 

layout/includes/third-party/comments/disqusjs.pug

@@ -57,4 +57,3 @@ if is_post() && !theme.comments.lazyload && theme.comments.count && theme.commen
     } else {
       DISQUSWIDGETS.getCount({reset: true});
     }
-

layout/includes/third-party/comments/facebook_comments.pug

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

layout/includes/third-party/comments/waline.pug

@@ -1,3 +1,7 @@
+- let emojiMaps = '""'
+if site.data.waline
+  - emojiMaps = JSON.stringify(site.data.waline)
+
 script.
   function loadWaline () {
     function initWaline () {
@@ -6,8 +10,9 @@ script.
         serverURL: '!{theme.waline.serverURL}',
         avatar: '#{theme.waline.avatar}',
         path: location.pathname,
-        visitor: #{theme.waline.visitor},
+        emojiCDN: '#{theme.waline.emojiCDN}',
-        dark: 'html[data-theme="dark"]'
+        emojiMaps: !{emojiMaps},
+        visitor: #{theme.waline.visitor}
       }, !{JSON.stringify(theme.waline.option)}))
     }
 

layout/includes/third-party/math/katex.pug

@@ -4,7 +4,7 @@ link(rel="stylesheet" type="text/css" href=theme.CDN.katex_copytex_css)
 script.
   (() => {
     document.querySelectorAll('#article-container span.katex-display').forEach(item => {
-      btf.wrap(item, 'div', { class: 'katex-wrap'})
+      btf.wrap(item, 'div', '', 'katex-wrap')
     })
   })()
   

layout/includes/third-party/math/mathjax.pug

@@ -1,14 +1,21 @@
 //- Mathjax 3
+//- http://docs.mathjax.org/en/latest/upgrading/v2.html#changes-in-the-mathjax-api
+//- https://github.com/mathjax/MathJax/issues/2209
+//- http://docs.mathjax.org/en/latest/options/input/tex.html#the-configuration-block
+//- http://docs.mathjax.org/en/latest/web/typeset.html#resetting-automatic-equation-numbering
+
 script.
   if (!window.MathJax) {
     window.MathJax = {
+      loader: {
+        source: {
+          '[tex]/amsCd': '[tex]/amscd'
+        }
+      },
       tex: {
         inlineMath: [ ['$','$'], ["\\(","\\)"]],
         tags: 'ams'
       },
-      chtml: {
-        scale: 1.2
-      },
       options: {
         renderActions: {
           findScript: [10, doc => {
@@ -21,7 +28,15 @@ script.
               math.end = {node: text, delim: '', n: 0}
               doc.math.push(math)
             }
-          }, '']
+          }, ''],
+          addClass: [200,() => {
+            document.querySelectorAll('mjx-container:not([display=\'true\']').forEach( node => {
+              const target = node.parentNode
+              if (!target.classList.contains('has-jax')) {
+                target.classList.add('mathjax-overflow')
+              }
+            })
+          }, '', false]
         }
       }
     }

layout/includes/third-party/newest-comments/disqus-comment.pug

@@ -15,7 +15,7 @@ script.
     }
 
     const getComment = () => {
-      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{apiKey}')
+      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{theme.newest_comments.disqus.forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{theme.newest_comments.disqus.api_key}')
         .then(response => response.json())
         .then(data => {
           const disqusArray = data.response.map(item => {

layout/includes/third-party/newest-comments/github-issues.pug

@@ -38,7 +38,7 @@ script.
     }
 
     const getComment = () => {
-      fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
+      fetch('https://api.github.com/repos/!{theme.newest_comments.github_issues.repo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
         "headers": {
           Accept: 'application/vnd.github.v3.html+json'
         }
@@ -102,8 +102,4 @@ script.
 
     newestCommentInit()
     document.addEventListener('pjax:complete', newestCommentInit)
-  })
+  })
-
-
-
-

layout/includes/third-party/newest-comments/index.pug

@@ -1,26 +1,12 @@
-- let { use } = theme.comments
+- let config = theme.newest_comments
 
-if use
+if config.valine
-  - let forum,apiKey,userRepo
+  include ./valine.pug
-  case use[0]
+else if config.waline
-    when 'Valine'
+  include ./waline.pug
-      include ./valine.pug
+else if config.github_issues.enable
-    when 'Waline'
+  include ./github-issues.pug
-      include ./waline.pug
+else if config.disqus.enable
-    when 'Twikoo'
+  include ./disqus-comment.pug
-      include ./twikoo-comment.pug
+else if config.twikoo
-    when 'Disqus'
+  include ./twikoo-comment.pug
-      - forum = theme.disqus.shortname
-      - apiKey = theme.disqus.apikey
-      include ./disqus-comment.pug
-    when 'Disqusjs'
-      - forum = theme.disqusjs.shortname
-      - apiKey = theme.disqusjs.apikey
-      include ./disqus-comment.pug
-    when 'Gitalk'
-      - let { repo,owner } = theme.gitalk
-      - userRepo = owner + '/' + repo
-      include ./github-issues.pug
-    when 'Utterances'
-      - userRepo = theme.utterances.repo
-      include ./github-issues.pug

layout/includes/third-party/newest-comments/waline.pug

@@ -1,4 +1,4 @@
-- let { avatar,avatarCDN } = theme.waline
+- let default_avatar = theme.waline.avatar
 
 script.
   window.addEventListener('load', () => {
@@ -16,10 +16,10 @@ script.
       return content
     }
 
-    const getIcon = (ava,mail) => {
+    const getIcon = (avatar,mail) => {
-      if (ava) return ava
+      if (avatar) return avatar
-      let defaultIcon = '!{ avatar ? `?d=${avatar}` : ''}'
+      let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
-      let iconUrl = "!{avatarCDN ? avatarCDN : 'https://gravatar.loli.net/avatar/'}" + mail + defaultIcon
+      let iconUrl = `https://gravatar.loli.net/avatar/${mail + defaultIcon}`
       return iconUrl
     }
 
@@ -53,10 +53,11 @@ script.
     const getComment = () => {
       const loadWaline = () => {
         Waline.Widget.RecentComments({
+          el: '#card-newest-comments .aside-list',
           serverURL: '!{theme.waline.serverURL}',
           count: !{theme.newest_comments.limit}
-        }).then(res => {
+        }).then(comments => {
-          const walineArray = res.comments.map(e => {
+          const walineArray = comments.map(function (e) {
             return {
               'content': changeContent(e.comment),
               'avatar': getIcon(e.QQAvatar,e.mail),

layout/includes/third-party/pjax.pug

@@ -26,30 +26,6 @@ script.
     scrollRestoration: false
   })
 
-  document.addEventListener('pjax:send', function () {
-
-    // removeEventListener scroll 
-    window.removeEventListener('scroll', window.tocScrollFn)
-    window.removeEventListener('scroll', scrollCollect)
-
-    typeof preloader === 'object' && preloader.initLoading()
-    
-    if (window.aplayers) {
-      for (let i = 0; i < window.aplayers.length; i++) {
-        if (!window.aplayers[i].options.fixed) {
-          window.aplayers[i].destroy()
-        }
-      }
-    }
-
-    typeof typed === 'object' && typed.destroy()
-
-    //reset readmode
-    const $bodyClassList = document.body.classList
-    $bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')
-
-  })
-
   document.addEventListener('pjax:complete', function () {
     window.refreshFn()
 
@@ -85,6 +61,26 @@ script.
     typeof preloader === 'object' && preloader.endLoading()
   })
 
+
+  document.addEventListener('pjax:send', function () {
+    typeof preloader === 'object' && preloader.initLoading()
+    
+    if (window.aplayers) {
+      for (let i = 0; i < window.aplayers.length; i++) {
+        if (!window.aplayers[i].options.fixed) {
+          window.aplayers[i].destroy()
+        }
+      }
+    }
+
+    typeof typed === 'object' && typed.destroy()
+
+    //reset readmode
+    const $bodyClassList = document.body.classList
+    $bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')
+
+  })
+
   document.addEventListener('pjax:error', (e) => {
     if (e.request.status === 404) {
       pjax.loadUrl('/404.html')

layout/includes/widget/card_author.pug

@@ -1,8 +1,10 @@
 if theme.aside.card_author.enable
   .card-widget.card-info
-    .is-center
+    .card-info-avatar.is-center
-      .avatar-img
+      if theme.lazyload.enable
-        img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
+        img.avatar-img(data-lazy-src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
+      else
+        img.avatar-img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
       .author-info__name= config.author
       .author-info__description!= theme.aside.card_author.description || config.description
 

layout/includes/widget/card_newest_comment.pug

@@ -1,7 +1,7 @@
 if theme.newest_comments.enable
   .card-widget#card-newest-comments
     .item-headline
-      i.fas.fa-comment-dots
+      i.fas.fa-bolt
       span= _p('aside.card_newest_comments.headline')
     .aside-list
       span= _p('aside.card_newest_comments.loading_text')

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 theme.lazyload.enable
+                img(data-lazy-src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
+              else
+                img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
           .content
             a.title(href=url_for(link) title=title)= title
             if theme.aside.card_recent_post.sort === 'updated'

layout/includes/widget/card_self.pug

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

layout/includes/widget/card_top_self.pug

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

layout/includes/widget/index.pug

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

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "3.8.0",
+  "version": "3.7.1",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {
@@ -27,6 +27,6 @@
     "hexo-renderer-pug": "^1.0.0"
   },
   "homepage": "https://butterfly.js.org/",
-  "author": "Jerry <i@immyw.com>",
+  "author": "Jerry <btf@immyw.com>",
   "license": "Apache-2.0"
 }

scripts/events/404.js

@@ -9,10 +9,7 @@ hexo.extend.generator.register('404', function (locals) {
   if (!hexo.theme.config.error_404.enable) return
   return {
     path: '404.html',
-    layout: ['page'],
+    data: locals.posts,
-    data: {
+    layout: ['404']
-      type: '404',
-      top_img: false
-    }
   }
 })

scripts/events/init.js

@@ -2,7 +2,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')
+  var hexoVer = hexo.version.replace(/(^.*\..*)\..*/, '$1')
 
   if (hexoVer < 5) {
     logger.error('Please update Hexo to V5.0.0 or higher!')

scripts/filters/post_lazyload.js

@@ -8,22 +8,9 @@
 
 const urlFor = require('hexo-util').url_for.bind(hexo)
 
-function lazyload (htmlContent) {
-  const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs='
-  return htmlContent.replace(/(<img.*? src=)/ig, `$1 "${bg}" data-lazy-src=`)
-}
-
-hexo.extend.filter.register('after_render:html', function (data) {
-  const config = hexo.theme.config.lazyload
-  if (!config.enable) return
-  if (config.field !== 'site') return
-  return lazyload.call(this, data)
-})
-
 hexo.extend.filter.register('after_post_render', data => {
-  const config = hexo.theme.config.lazyload
+  if (!hexo.theme.config.lazyload.enable) return
-  if (!config.enable) return
+  const bg = hexo.theme.config.lazyload.post ? urlFor(hexo.theme.config.lazyload.post) : 'data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs='
-  if (config.field !== 'post') return
+  data.content = data.content.replace(/(<img.*? src=)/ig, `$1 "${bg}" data-lazy-src=`)
-  data.content = lazyload.call(this, data.content)
   return data
 })

scripts/helpers/inject_head_js.js

@@ -6,7 +6,7 @@
 'use strict'
 
 hexo.extend.helper.register('inject_head_js', function () {
-  const { darkmode, aside, change_font_size, index_img, disable_top_img, pjax} = this.theme
+  const { darkmode, aside, change_font_size } = this.theme
 
   const localStore = `
     win.saveToLocal = {
@@ -141,21 +141,5 @@ hexo.extend.helper.register('inject_head_js', function () {
     `
   }
 
-  let detectApple = ''
+  return `<script>(win=>{${localStore + getScript + darkmodeJs + asideStatus + changFontAside}})(window)</script>`
-  if (!disable_top_img || index_img !== false) {
-    detectApple = `
-    const detectApple = () => {
-      if (GLOBAL_CONFIG_SITE.isHome && /iPad|iPhone|iPod|Macintosh/.test(navigator.userAgent)){
-        document.documentElement.classList.add('apple')
-      }
-    }
-    detectApple()
-    `
-
-    if (pjax.enable) {
-      detectApple += 'document.addEventListener(\'pjax:complete\', detectApple)'
-    }
-  }
-
-  return `<script>(win=>{${localStore + getScript + darkmodeJs + asideStatus + changFontAside + detectApple}})(window)</script>`
 })

scripts/helpers/page.js

@@ -70,22 +70,3 @@ hexo.extend.helper.register('injectHtml', function (data) {
   }
   return result
 })
-
-hexo.extend.helper.register('findArchivesTitle', function (menu) {
-  const defaultTitle = this._p('page.archives')
-  if (!menu) return defaultTitle
-
-  const loop = (m) => {
-    for (const key in m) {
-      if (typeof m[key] === 'object') {
-        loop(m[key])
-      }
-
-      if (/\/archives\//.test(m[key])) {
-        return key
-      }
-    }
-  }
-
-  return loop(menu) || defaultTitle
-})

scripts/helpers/related_post.js

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

scripts/tag/button.js

@@ -22,7 +22,7 @@ function btn (args) {
   option = option.trim()
 
   return `<a class="btn-beautify button--animated ${option}" href="${urlFor(url)}" 
-  title="${text}">${icon.length ? `<i class="${icon}"></i>` : ''}${text.length ? `<span>${text}</span>` : ''}</a>`
+  title="${text}">${icon.length > 0 ? `<i class="${icon} fa-fw"></i>` : ''}<span>${text}</span></a>`
 }
 
 hexo.extend.tag.register('btn', btn, { ends: false })

scripts/tag/label.js

@@ -1,16 +0,0 @@
-/**
- * Butterfly
- * label
- * {% label text color %}
- */
-
-'use strict'
-
-function addLabel (args, content) {
-  const text = args[0]
-  const className = args[1] || 'default'
-
-  return `<mark class="hl-label ${className}">${text}</mark> `
-}
-
-hexo.extend.tag.register('label', addLabel, { ends: false })

source/css/_global/index.styl

@@ -19,7 +19,7 @@
   --btn-hover-color: $button-hover-color
   --btn-color: $button-color
   --btn-bg: $button-bg
-  --text-bg-hover: rgba($text-bg-hover, .7)
+  --text-bg-hover: $text-bg-hover
   --light-grey: $light-grey
   --white: $white
   --text-highlight-color: $text-highlight-color
@@ -206,15 +206,6 @@ img
   &:not([src])
     opacity: 0
 
-// lazyload blur
-if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
-  img
-    &[data-lazy-src]:not(.loaded)
-      filter: blur(10px) brightness(1)
-
-    &[data-lazy-src].error
-      filter: none
-
 .img-alt
   margin: -.5rem 0 .5rem
   color: #858585

source/css/_highlight/highlight.styl

@@ -110,7 +110,7 @@ blockquote
     color: var(--hltools-color)
     font-size: $code-font-size
 
-    &.closed ~ *
+    &.closed + table
       display: none
 
     .expand

source/css/_layout/404.styl

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

source/css/_layout/aside.styl

@@ -35,6 +35,15 @@
           display: none
 
   .card-info
+    img
+      width: 110px
+      height: 110px
+      border-radius: 70px
+      transition: all .5s
+
+      &:hover
+        transform: rotate(360deg)
+
     .author-info
       &__name
         font-weight: 500
@@ -94,7 +103,7 @@
     font-size: 1.2em
 
     span
-      margin-left: .3rem
+      margin-left: .5rem
 
   .sticky_layout
     +minWidth900()
@@ -322,21 +331,6 @@
     &:hover
       animation: more-btn-move 1s infinite
 
-.avatar-img
-  overflow: hidden
-  margin: 0 auto
-  width: 110px
-  height: 110px
-  border-radius: 70px
-
-  img
-    height: 100%
-    transition: all .5s
-    object-fit: cover
-
-    &:hover
-      transform: rotate(360deg)
-
 @keyframes more-btn-move
   0%,
   100%

source/css/_layout/head.styl

@@ -9,7 +9,7 @@
 
   // index
   &.full_page
-    min-height: $index_top_img_height
+    height: $index_top_img_height
     background-attachment: fixed
 
     #site-info
@@ -70,7 +70,7 @@
 
   // page
   &.not-home-page
-    min-height: 20rem
+    height: 20rem
 
     +maxWidth768()
       height: 14rem
@@ -86,7 +86,7 @@
 
   // post
   &.post-bg
-    min-height: 20rem
+    height: 20rem
 
     +maxWidth768()
       height: 18rem
@@ -118,7 +118,7 @@
 
   &.not-top-img
     margin-bottom: .5rem
-    min-height: 60px
+    height: 60px
     background: 0
 
     #nav
@@ -157,9 +157,12 @@
         top: 70px
         transition: top .5s
 
-.apple
+// css hack
-  #page-header.full_page
+// all browser in ios and safari in all apple device
-    background-attachment: scroll !important
+_::-webkit-full-page-media,
+_:future,
+:root #page-header.full_page
+  background-attachment: scroll !important
 
 #page
   h1.page-title

source/css/_layout/post.styl

@@ -185,9 +185,6 @@ no-beautify()
   else
     no-beautify()
 
-  > :last-child
-    margin-bottom: 0 !important
-
 #post
   .tag_share
     .post-meta

source/css/_layout/sidebar.styl

@@ -22,12 +22,22 @@
     &.open
       transform: translate3d(-100%, 0, 0)
 
-    & > .avatar-img
+    & > .author-avatar
-      margin: 1rem auto
+      padding: 1.3rem 1.5rem 0
+      text-align: center
+
+      img
+        width: 110px
+        height: 110px
+        border-radius: 70px
+        transition: all .5s
+
+        &:hover
+          transform: rotate(360deg)
 
     .site-data
       display: table
-      padding: 0 .5rem
+      padding: .6rem .5rem 0
       width: 100%
       table-layout: fixed
 
@@ -55,21 +65,25 @@
         @extend .limit-one-line
         position: relative
         display: block
-        padding: .3rem 1.5rem .3rem 1.1rem
+        padding: .3rem 1.5rem
         color: var(--font-color)
         font-size: 1.15em
-
+        cursor: pointer
-        &:hover
-          background: var(--text-bg-hover)
 
         i:first-child
-          width: 15%
+          width: 25%
           text-align: left
 
+        span
+          width: 75%
+
+          &:hover
+            color: $light-blue
+
       .expand
         position: absolute
         top: .78em
-        right: .9rem
+        right: .4rem
         transition: transform .3s
 
         &.hide

source/css/_layout/third-party.styl

@@ -1,4 +1,5 @@
-#vcomment
+#vcomment,
+#waline
   font-size: 1.1em
 
   .vbtn
@@ -20,18 +21,6 @@
     &:after
       z-index: 22
 
-#waline-wrap
-  --waline-font-size: 1.1em
-  --waline-theme-color: $button-bg
-  --waline-active-color: $button-hover-color
-  --waline-avatar-size: 2.75rem
-
-  .vuser
-    transition: all .5s
-
-    &:hover
-      transform: rotate(360deg)
-
 if hexo-config('valine.bg')
   #vcomment
     textarea
@@ -90,13 +79,14 @@ if hexo-config('waline.bg')
       display: none
 
 // mathjax
-mjx-container
+.mathjax-overflow
   overflow-x: auto
   overflow-y: hidden
 
-  &:not([display])
+mjx-container[jax='CHTML'][display='true']
-    display: inline-grid
+  overflow-x: auto
-    max-width: 100%
+  overflow-y: hidden
+  padding-bottom: .3rem
 
 .aplayer
   color: $font-black

source/css/_mode/darkmode.styl

@@ -91,20 +91,14 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
     .hide-button,
     .btn-beautify,
     .mermaid,
-    .hl-label,
     .post-outdate-notice,
     .error-img,
     #article-container iframe,
+    img,
     .gist,
     .ads-wrap
       filter: brightness(.8)
 
-    img
-      if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
-        filter: blur(0) brightness(.8)
-      else
-        filter: brightness(.8)
-
     #aside-content .aside-list > .aside-list-item:not(:last-child)
       border-bottom: 1px dashed alpha(#FFFFFF, .1)
 

source/css/_mode/readmode.styl

@@ -173,15 +173,24 @@ if hexo-config('readmode')
         border: 1px solid var(--gray) !important
 
       .hide-button,
-      .btn-beautify,
+      .btn-beautify
-      .hl-label
-        border: 1px solid var(--gray) !important
         background: var(--readmode-light-color) !important
         color: var(--font-color) !important
 
+      .btn-beautify
+        border: 1px solid var(--gray) !important
+
       .button--animated:before
         background: var(--readmode-light-color) !important
 
+      .hide-inline,
+      .hide-block
+        & >.hide-button
+          border: 1px solid var(--gray)
+
+        & > .button--animated:before
+          background: var(--readmode-light-color)
+
       .note
         border: 2px solid var(--gray)
         border-left-color: var(--gray) !important

source/css/_page/404.styl

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

source/css/_page/common.styl

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

source/css/_page/flink.styl

@@ -50,24 +50,20 @@
           color: var(--font-color)
           text-decoration: none
 
-          .flink-item-icon
+          img
             float: left
-            overflow: hidden
             margin: 15px 10px
             width: 60px
             height: 60px
             border-radius: 35px
-
+            transition: all .3s
-            img
-              width: 100%
-              height: 100%
-              transition: all .3s
 
           .img-alt
             display: none
 
           .flink-item-name
             @extend .limit-one-line
+            display: block
             padding: 16px 10px 0 0
             height: 40px
             font-weight: bold
@@ -75,6 +71,7 @@
 
           .flink-item-desc
             @extend .limit-one-line
+            display: block
             padding: 16px 10px 16px 0
             height: 50px
             font-size: .93em

source/css/_search/algolia.styl

@@ -1,5 +1,7 @@
 #algolia-search
   .search-dialog
+    animation: titlescale .5s
+
     .ais-search-box
       margin: 0 auto
       max-width: 100%

source/css/_search/index.styl

@@ -7,9 +7,7 @@
   margin-left: -15rem
   padding: 1rem
   width: 30rem
-  border-radius: 8px
   background: var(--search-bg)
-  animation: titlescale .5s
 
   +maxWidth768()
     top: 0
@@ -17,7 +15,6 @@
     margin: 0
     width: 100%
     height: 100%
-    border-radius: 0
 
   hr
     margin: 1rem auto

source/css/_search/local-search.styl

@@ -1,5 +1,7 @@
 #local-search
   .search-dialog
+    animation: titlescale .5s
+
     .local-search-box
       margin: 0 auto
       max-width: 100%

source/css/_tags/button.styl

@@ -11,9 +11,6 @@
     color: $btn-color
     line-height: 2
 
-    i + span
-      margin-left: .3rem
-
     &:not(.block) + .btn-beautify:not(.block)
       margin: 0 .2rem 1rem
 

source/css/_tags/label.styl

@@ -1,11 +0,0 @@
-.hl-label
-  padding: 2px 4px
-  border-radius: 3px
-  color: $btn-color
-
-  &.default
-    background-color: $btn-default-color
-
-  for $type in $tagsP-types
-    &.{$type}
-      background-color: lookup('$tagsP-' + $type + '-color')

source/css/var.styl

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

source/js/main.js

@@ -194,7 +194,7 @@ document.addEventListener('DOMContentLoaded', function () {
         $figureHighlight.forEach(function (item) {
           const langName = item.getAttribute('data-language') ? item.getAttribute('data-language') : 'Code'
           const highlightLangEle = `<div class="code-lang">${langName}</div>`
-          btf.wrap(item, 'figure', { class: 'highlight' })
+          btf.wrap(item, 'figure', '', 'highlight')
           createEle(highlightLangEle, item)
         })
       } else {
@@ -208,7 +208,7 @@ document.addEventListener('DOMContentLoaded', function () {
     } else {
       if (isPrismjs) {
         $figureHighlight.forEach(function (item) {
-          btf.wrap(item, 'figure', { class: 'highlight' })
+          btf.wrap(item, 'figure', '', 'highlight')
           createEle('', item)
         })
       } else {
@@ -332,55 +332,50 @@ document.addEventListener('DOMContentLoaded', function () {
       return
     }
 
+    let initTop = 0
+    let isChatShow = true
+    const $header = document.getElementById('page-header')
+    const isChatBtnHide = typeof chatBtnHide === 'function'
+    const isChatBtnShow = typeof chatBtnShow === 'function'
+    window.addEventListener('scroll', btf.throttle(function (e) {
+      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: 1; transform: translateX(-38px)'
+        }
+      } else {
+        if (currentTop === 0) {
+          $header.classList.remove('nav-fixed', 'nav-visible')
+        }
+        $rightside.style.cssText = "opacity: ''; transform: ''"
+      }
+
+      if (document.body.scrollHeight <= innerHeight) {
+        $rightside.style.cssText = 'opacity: 1; transform: translateX(-38px)'
+      }
+    }, 200))
+
     // find the scroll direction
     function scrollDirection (currentTop) {
       const result = currentTop > initTop // true is down & false is up
       initTop = currentTop
       return result
     }
-
-    let initTop = 0
-    let isChatShow = true
-    const $header = document.getElementById('page-header')
-    const isChatBtnHide = typeof chatBtnHide === 'function'
-    const isChatBtnShow = typeof chatBtnShow === 'function'
-
-    window.scrollCollect = () => {
-      return btf.throttle(function (e) {
-        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: 1; transform: translateX(-38px)'
-          }
-        } else {
-          if (currentTop === 0) {
-            $header.classList.remove('nav-fixed', 'nav-visible')
-          }
-          $rightside.style.cssText = "opacity: ''; transform: ''"
-        }
-
-        if (document.body.scrollHeight <= innerHeight) {
-          $rightside.style.cssText = 'opacity: 1; transform: translateX(-38px)'
-        }
-      }, 200)()
-    }
-
-    window.addEventListener('scroll', scrollCollect)
   }
 
   /**
@@ -393,14 +388,11 @@ document.addEventListener('DOMContentLoaded', function () {
     const $article = document.getElementById('article-container')
 
     // main of scroll
-    window.tocScrollFn = function () {
+    window.addEventListener('scroll', btf.throttle(function (e) {
-      return btf.throttle(function () {
+      const currentTop = window.scrollY || document.documentElement.scrollTop
-        const currentTop = window.scrollY || document.documentElement.scrollTop
+      scrollPercent(currentTop)
-        scrollPercent(currentTop)
+      findHeadPosition(currentTop)
-        findHeadPosition(currentTop)
+    }, 100))
-      }, 100)()
-    }
-    window.addEventListener('scroll', tocScrollFn)
 
     const scrollPercent = function (currentTop) {
       const docHeight = $article.clientHeight
@@ -418,11 +410,7 @@ document.addEventListener('DOMContentLoaded', function () {
     const updateAnchor = function (anchor) {
       if (window.history.replaceState && anchor !== window.location.hash) {
         if (!anchor) anchor = location.pathname
-        const title = GLOBAL_CONFIG_SITE.title
+        window.history.replaceState({}, '', anchor)
-        window.history.replaceState({
-          url: location.href,
-          title: title
-        }, title, anchor)
       }
     }
 
@@ -692,7 +680,7 @@ document.addEventListener('DOMContentLoaded', function () {
     const $table = document.querySelectorAll('#article-container :not(.highlight) > table, #article-container > table')
     if ($table.length) {
       $table.forEach(item => {
-        btf.wrap(item, 'div', { class: 'table-wrap' })
+        btf.wrap(item, 'div', '', 'table-wrap')
       })
     }
   }

source/js/utils.js

@@ -207,18 +207,18 @@ const btf = {
    *
    * @param {*} selector
    * @param {*} eleType the type of create element
-   * @param {*} options object key: value
+   * @param {*} id id
+   * @param {*} cn class name
    */
-  wrap: (selector, eleType, options) => {
+  wrap: function (selector, eleType, id = '', cn = '') {
     const creatEle = document.createElement(eleType)
-    for (const [key, value] of Object.entries(options)) {
+    if (id) creatEle.id = id
-      creatEle.setAttribute(key, value)
+    if (cn) creatEle.className = cn
-    }
     selector.parentNode.insertBefore(creatEle, selector)
     creatEle.appendChild(selector)
   },
 
-  unwrap: el => {
+  unwrap: function (el) {
     const elParentNode = el.parentNode
     if (elParentNode !== document.body) {
       elParentNode.parentNode.insertBefore(el, elParentNode)
@@ -226,7 +226,7 @@ const btf = {
     }
   },
 
-  isJqueryLoad: fn => {
+  isJqueryLoad: (fn) => {
     if (typeof jQuery === 'undefined') {
       getScript(GLOBAL_CONFIG.source.jQuery).then(fn)
     } else {
@@ -234,9 +234,9 @@ const btf = {
     }
   },
 
-  isHidden: ele => ele.offsetHeight === 0 && ele.offsetWidth === 0,
+  isHidden: (ele) => ele.offsetHeight === 0 && ele.offsetWidth === 0,
 
-  getEleTop: ele => {
+  getEleTop: (ele) => {
     let actualTop = ele.offsetTop
     let current = ele.offsetParent