breaking changes: 移除最新評論的評論服務商選擇，默認為第一個評論服務商

feat: 增加 waline avatarCDN 配置（最新評論也會更新）
feat: archives 的 標題 在 menu 配置中獲取
fix: 修復文章頁 mathjax 因字體小導致顯示重疊的 bug close #587
fix: 修復 mathjax 在列表下，導致 列表沒有樣式的 bug  close #586
improvement: 減少卡頓，apple 裝置首頁背景 background-attachment 設為 scroll

_config.yml

@@ -274,6 +274,7 @@ comments:
 # https://disqus.com/
 disqus:
   shortname:
+  apikey: # For newest comments widget
 
 # Alternative Disqus - Render comments with Disqus API
 # DisqusJS 評論系統，可以實現在網路審查地區載入 Disqus 評論列表，兼容原版
@@ -331,6 +332,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
   bg: # waline background
   visitor: false
   option:
@@ -693,17 +695,6 @@ 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 (右下角按鈕)
 # --------------------------------------

layout/includes/head.pug

@@ -1,5 +1,5 @@
 - var pageTitle
-- if (is_archive()) pageTitle = _p('page.archives')
+- if (is_archive()) pageTitle = fragment_cache('findArchivesTitle', function(){return findArchivesTitle(theme.menu);})
 - 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/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() ? _p('page.archives') : page.title || page.tag || page.category || config.title
+    - var site_title = is_archive() ? fragment_cache('findArchivesTitle', function(){return findArchivesTitle(theme.menu);}) : 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/sidebar.pug

@@ -1,8 +1,8 @@
 #sidebar
   #menu-mask
   #sidebar-menus
-    .author-avatar
-      img.avatar-img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
+    .avatar-img.is-center
+      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

@@ -6,7 +6,6 @@ script.
           el: null,
           serverURL: '!{theme.waline.serverURL}',
         }
-        
         const waline = new Waline(initData)
       }
 

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

@@ -1,21 +1,14 @@
 //- 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 => {
@@ -28,15 +21,7 @@ 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=!{theme.newest_comments.disqus.forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{theme.newest_comments.disqus.api_key}')
+      fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{apiKey}')
         .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/!{theme.newest_comments.github_issues.repo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
+      fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
         "headers": {
           Accept: 'application/vnd.github.v3.html+json'
         }

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

@@ -1,12 +1,26 @@
-- let config = theme.newest_comments
+- let { use } = theme.comments
 
-if config.valine
-  include ./valine.pug
-else if config.waline
-  include ./waline.pug
-else if config.github_issues.enable
-  include ./github-issues.pug
-else if config.disqus.enable
-  include ./disqus-comment.pug
-else if config.twikoo
-  include ./twikoo-comment.pug
+if use
+  - let forum,apiKey,userRepo
+  case use[0]
+    when 'Valine'
+      include ./valine.pug
+    when 'Waline'
+      include ./waline.pug
+    when 'Twikoo'
+      include ./twikoo-comment.pug
+    when 'Disqus'
+      - 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 default_avatar = theme.waline.avatar
+- let { avatar,avatarCDN } = theme.waline
 
 script.
   window.addEventListener('load', () => {
@@ -16,10 +16,10 @@ script.
       return content
     }
 
-    const getIcon = (avatar,mail) => {
-      if (avatar) return avatar
-      let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
-      let iconUrl = `https://gravatar.loli.net/avatar/${mail + defaultIcon}`
+    const getIcon = (ava,mail) => {
+      if (ava) return ava
+      let defaultIcon = '!{ avatar ? `?d=${avatar}` : ''}'
+      let iconUrl = "!{avatarCDN ? avatarCDN : 'https://gravatar.loli.net/avatar/'}" + mail + defaultIcon
       return iconUrl
     }
 

layout/includes/widget/card_author.pug

@@ -1,7 +1,8 @@
 if theme.aside.card_author.enable
   .card-widget.card-info
-    .card-info-avatar.is-center
-      img.avatar-img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
+    .is-center
+      .avatar-img
+        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
 

package.json

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

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 } = this.theme
+  const { darkmode, aside, change_font_size, index_img, disable_top_img, pjax} = this.theme
 
   const localStore = `
     win.saveToLocal = {
@@ -141,5 +141,21 @@ hexo.extend.helper.register('inject_head_js', function () {
     `
   }
 
-  return `<script>(win=>{${localStore + getScript + darkmodeJs + asideStatus + changFontAside}})(window)</script>`
+  let detectApple = ''
+  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,3 +70,22 @@ 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
+})

source/css/_layout/aside.styl

@@ -35,15 +35,6 @@
           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
@@ -331,6 +322,21 @@
     &: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

@@ -157,12 +157,9 @@
         top: 70px
         transition: top .5s
 
-// css hack
-// all browser in ios and safari in all apple device
-_::-webkit-full-page-media,
-_:future,
-:root #page-header.full_page
-  background-attachment: scroll !important
+.apple
+  #page-header.full_page
+    background-attachment: scroll !important
 
 #page
   h1.page-title

source/css/_layout/sidebar.styl

@@ -22,22 +22,12 @@
     &.open
       transform: translate3d(-100%, 0, 0)
 
-    & > .author-avatar
-      padding: 1.3rem 1.5rem 0
-      text-align: center
-
-      img
-        width: 110px
-        height: 110px
-        border-radius: 70px
-        transition: all .5s
-
-        &:hover
-          transform: rotate(360deg)
+    & > .avatar-img
+      margin: 1rem auto
 
     .site-data
       display: table
-      padding: .6rem .5rem 0
+      padding: 0 .5rem
       width: 100%
       table-layout: fixed
 

source/css/_layout/third-party.styl

@@ -79,14 +79,13 @@ if hexo-config('waline.bg')
       display: none
 
 // mathjax
-.mathjax-overflow
+mjx-container
   overflow-x: auto
   overflow-y: hidden
 
-mjx-container[jax='CHTML'][display='true']
-  overflow-x: auto
-  overflow-y: hidden
-  padding-bottom: .3rem
+  &:not([display])
+    display: inline-grid
+    max-width: 100%
 
 .aplayer
   color: $font-black