🏷️ 2.3.0發佈

README.md

@@ -1,13 +1,11 @@
 # hexo-theme-butterfly
 
-<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.2.5-blue"/></a>
+<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.3.0-blue"/></a>
 <a href="https://jerryc.me"><img alt="Author" src="https://img.shields.io/badge/author-JerryC-blur"/></a>
 <a href="https://hexo.io"><img alt="Hexo" src="https://img.shields.io/badge/hexo-4.0+-0e83c"/></a>
 <a href="https://nodejs.org/"><img alt="node.js" src="https://img.shields.io/badge/node.js-8.0+-blur"/></a>
 
-Demo:  https://demo.jerryc.me/
+Demo:  👍 [Butterfly](https://demo.jerryc.me/)  ||   🤞 [JerryC](https://jerryc.me/)
-
-JerryC:  https://jerryc.me/
 
 Based on [hexo-theme-melody](https://github.com/Molunerfinn/hexo-theme-melody) theme.
 

README_CN.md

@@ -1,14 +1,11 @@
 # hexo-theme-butterfly
 
-<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.2.5-blue"/></a>
+<a href="https://github.com/jerryc127/hexo-theme-butterfly/releases"><img alt="Version" src="https://img.shields.io/badge/release-2.3.0-blue"/></a>
 <a href="https://jerryc.me"><img alt="Author" src="https://img.shields.io/badge/author-JerryC-blur"/></a>
 <a href="https://hexo.io"><img alt="Hexo" src="https://img.shields.io/badge/hexo-4.0+-0e83c"/></a>
 <a href="https://nodejs.org/"><img alt="node.js" src="https://img.shields.io/badge/node.js-8.0+-blur"/></a>
 
-Demo:  https://demo.jerryc.me/ 
+Demo:  👍 [Butterfly](https://demo.jerryc.me/)  ||   🤞 [JerryC](https://jerryc.me/)
-
-JerryC:  https://jerryc.me/
-
 
 一款基於[hexo-theme-melody](https://github.com/Molunerfinn/hexo-theme-melody)修改的主題
 

_config.yml

@@ -221,7 +221,7 @@ addtoany:
 disqus:
   enable: false
   shortname:
-  count: false # top_img顯示評論數
+  count: false # dispaly comment count in top_img
 
 # Disqus.js版評論系統，應對大陸長城的折中方案，兼容原版：https://github.com/SukkaW/DisqusJS
 # API 申請地址：https://disqus.com/api/applications/
@@ -234,7 +234,7 @@ disqusjs:
   api: https://disqus.skk.moe/disqus/ #一般情況下無需修改 API 地址
   admin:
   adminLabel:
-  count: true # top_img顯示評論數
+  count: false # dispaly comment count in top_img
 
 laibili:
   enable: false
@@ -252,7 +252,7 @@ gitalk:
   distractionFreeMode: false # Facebook-like distraction free mode.
   pagerDirection: last # Comment sorting direction, available values are last and first.
   createIssueManually: false # Gitalk will create a corresponding github issue for your every single page automatically
-  count: true # top_img顯示評論數
+  count: false # dispaly comment count in top_img
 
 # valine comment system. https://valine.js.org
 valine:
@@ -269,8 +269,10 @@ valine:
   recordIP: false # Record reviewer IP
   serverURLs: # This configuration is suitable for domestic custom domain name users, overseas version will be automatically detected (no need to manually fill in)
   emojiCDN: # emoji CDN
+  enableQQ: false # enable the Nickname box to automatically get QQ Nickname and QQ Avatar
+  requiredFields: nick,mail # required fields nick/mail/link
   bg: /img/comment_bg.png # valine background
-  count: true # top_img顯示評論數
+  count: false # dispaly comment count in top_img
 
 # utterances
 # https://utteranc.es/
@@ -292,7 +294,7 @@ facebook_comments:
   pageSize: 10 # The number of comments to show
   order_by: social # social/time/reverse_time
   lang: en_US # Language en_US/zh_CN/zh_TW and so on
-  count: true
+  count: false
 
 #####     Footer Settings    ####
 # ------------------------------------
@@ -463,8 +465,9 @@ click_heart:
 ClickShowText:
   enable: false
   text:
-    - 本人
+    - I
-    - 超帥
+    - LOVE
+    - YOU
   fontSize: 15px
 
 # 網站顯示模式

layout/includes/comments/valine.pug

@@ -5,11 +5,17 @@ if site.data.valine
 #vcomment.vcomment
 script(src=url_for(theme.CDN.valine))
 script.
-  var GUEST_INFO = ['nick','mail','link'];
+  var requestSetting = function (from,set) {
-  var guest_info = '#{ theme.valine.guest_info }'.split(',').filter(function(item){
+    var from = from
-    return GUEST_INFO.indexOf(item) > -1
+    var setting = set.split(',').filter(function(item){
+    return from.indexOf(item) > -1
     });
-  guest_info = guest_info.length == 0 ? GUEST_INFO :guest_info;
+    setting = setting.length == 0 ? from :setting;
+    return setting
+  }
+
+  var guestInfo = requestSetting(['nick','mail','link'],'#{ theme.valine.guest_info }')
+  var requiredFields = requestSetting(['nick','mail','link'],'#{ theme.valine.requiredFields }')
 
   window.valine = new Valine({
     el:'#vcomment',
@@ -19,11 +25,13 @@ script.
     verify: #{theme.valine.verify},
     placeholder: '#{theme.valine.placeholder}',
     avatar: '#{theme.valine.avatar}',
-    meta: guest_info,
+    meta: guestInfo,
     pageSize: '#{theme.valine.pageSize}',
     lang: '#{theme.valine.lang}',
     recordIP: #{theme.valine.recordIP},
     serverURLs: '#{theme.valine.serverURLs}',
     emojiCDN: '#{theme.valine.emojiCDN}',
-    emojiMaps: !{emojiMaps}
+    emojiMaps: !{emojiMaps},
+    enableQQ: #{theme.valine.enableQQ},
+    requiredFields: requiredFields
   });

layout/includes/head/dns_prefetch.pug

@@ -1,16 +1,22 @@
 link(rel="preconnect" href="//cdn.jsdelivr.net")
+link(rel="dns-prefetch" href="//cdn.jsdelivr.net")
 
 if theme.google_analytics
   link(rel="preconnect" href="https://www.google-analytics.com" crossorigin)
+  link(rel="dns-prefetch" href="https://www.google-analytics.com")
 
 if theme.baidu_analytics
   link(rel="preconnect" href="https://hm.baidu.com")
+  link(rel="dns-prefetch" href="https://hm.baidu.com")
 
 if theme.tencent_analytics
   link(rel="preconnect" href="http://ta.qq.com")
+  link(rel="dns-prefetch" href="http://ta.qq.com")
 
 if theme.blog_title_font.font_link
   link(rel="preconnect" href="https://fonts.googleapis.com" crossorigin)
+  link(rel="dns-prefetch" href="https://fonts.googleapis.com")
 
 if theme.busuanzi.site_uv || theme.busuanzi.site_pv || theme.busuanzi.page_pv
   link(rel="preconnect" href="//busuanzi.ibruce.info")
+  link(rel="dns-prefetch" href="//busuanzi.ibruce.info")

layout/includes/mixins/article-sort.pug

@@ -11,7 +11,7 @@ mixin articleSort(posts)
         if article.cover && theme.cover.archives_enable
           .article-sort-img
             a.article-sort-item__img(href=url_for(article.path))
-              img(src=article.cover alt=article.title || 'No Title' onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'`)
+              img(src=`${article.cover}` alt=article.title || 'No Title' onerror=`this.onerror=null;this.src='`+ url_for(theme.lodding_bg.post_page) + `'`)
         .article-sort-post
           a.article-sort-item__post(href=url_for(article.path))
             i.fa.fa-clock-o(aria-hidden="true")

layout/includes/widget/card_tags.pug

@@ -7,6 +7,6 @@ if site.tags.length
 
       - let tagLimit = theme.aside.card_tags.limit === 0 ? 0 : theme.aside.card_tags.limit || 40
       if theme.aside.card_tags.color
-        .card-tag-cloud!=cloudTags(site.tags,16,22,tagLimit)
+        .card-tag-cloud!=cloudTags({source: site.tags, minfontsize: 16, maxfontsize: 22, limit: tagLimit})
       else
-        .card-tag-cloud!= tagcloud({min_font: 16, max_font: 24, amount: tagLimit , color: true, start_color: '#999', end_color: '#99a9bf'})
+        .card-tag-cloud!= tagcloud({min_font: 16, max_font: 22, amount: tagLimit , color: true, start_color: '#999', end_color: '#99a9bf'})

layout/page.pug

@@ -7,7 +7,7 @@ block content
         |  - 
         span.tag-cloud__amount= site.tags.length
       .tag-cloud-tags
-        !=cloudTags(site.tags,15,30,0)
+        !=cloudTags({source: site.tags, minfontsize: 15, maxfontsize: 30, limit: 0})
       if page.comments !== false
         include includes/comments/index.pug
   else if page.type === 'link'

package.json

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

scripts/helpers/aside_archives.js

@@ -67,7 +67,7 @@ hexo.extend.helper.register('aside_archives', function (options = {}) {
     return this.url_for(url)
   }
 
-  result += '<ul class="archive-list">'
+  result += '<ul class="card-archive-list">'
 
   const len = data.length
   const Judge = limit === 0 ? len : Math.min(len, limit)
@@ -75,23 +75,24 @@ hexo.extend.helper.register('aside_archives', function (options = {}) {
   for (let i = 0; i < Judge; i++) {
     const item = data[i]
 
-    result += '<li class="archive-list-item">'
+    result += '<li class="card-archive-list-item">'
 
-    result += `<a class="archive-list-link" href="${link(item)}">`
+    result += `<a class="card-archive-list-link" href="${link(item)}">`
-    result += '<span class="archive-list-date">'
+    result += '<span class="card-archive-list-date">'
     result += transform ? transform(item.name) : item.name
     result += '</span>'
 
     if (showCount) {
-      result += `<span class="archive-list-count">${item.count}</span>`
+      result += `<span class="card-archive-list-count">${item.count}</span>`
     }
     result += '</a>'
     result += '</li>'
   }
 
   if (len > Judge) {
-    result += '<li class="archive-list-item is-center">'
+    result += '<li class="card-archive-list-item more is-center">'
-    result += `<a class="archive-list-link-more" href="${this.url_for(archiveDir)}">${moreButton}</a></li>`
+    result += `<a class="card-archive-list-link-more" href="${this.url_for(archiveDir)}">
+              <span>${moreButton}</span><i class="fa fa-angle-right" aria-hidden="true"></i></a></li>`
   }
   result += '</ul>'
   return result

scripts/helpers/aside_categories.js

@@ -6,7 +6,10 @@
 'use strict'
 
 hexo.extend.helper.register('aside_categories', function (categories, options) {
-  if (!options && (!categories || !Object.prototype.hasOwnProperty.call(categories, 'length'))) {
+  if (
+    !options &&
+    (!categories || !Object.prototype.hasOwnProperty.call(categories, 'length'))
+  ) {
     options = categories
     categories = this.site.categories
   }
@@ -14,23 +17,28 @@ hexo.extend.helper.register('aside_categories', function (categories, options) {
   if (!categories || !categories.length) return ''
   options = options || {}
   const { config } = this
-  const showCount = Object.prototype.hasOwnProperty.call(options, 'show_count') ? options.show_count : true
+  const showCount = Object.prototype.hasOwnProperty.call(options, 'show_count')
+    ? options.show_count
+    : true
   const depth = options.depth ? parseInt(options.depth, 10) : 0
   const orderby = options.orderby || 'name'
   const order = options.order || 1
   const categoryDir = this.url_for(config.category_dir)
   const limit = options.limit === 0 ? categories.length : options.limit
   const buttonLabel = this._p('aside.more_button')
-  const prepareQuery = parent => {
+  const prepareQuery = (parent) => {
     const query = {}
     if (parent) {
       query.parent = parent
     } else {
       query.parent = {
-        $exists: false
+        $exists: false,
       }
     }
-    return categories.find(query).sort(orderby, order).filter(cat => cat.length)
+    return categories
+      .find(query)
+      .sort(orderby, order)
+      .filter((cat) => cat.length)
   }
 
   const hierarchicalList = (t, level, parent) => {
@@ -46,20 +54,22 @@ hexo.extend.helper.register('aside_categories', function (categories, options) {
             t = childList[1]
           }
 
-          result += '<li class="aside-category-list-item">'
+          result += '<li class="card-category-list-item">'
 
-          result += `<a class="aside-category-list-link" href="${this.url_for(cat.path)}">`
+          result += `<a class="card-category-list-link" href="${this.url_for(
-          result += `<span class="aside-category-list-name">${cat.name}</span>`
+            cat.path
+          )}">`
+          result += `<span class="card-category-list-name">${cat.name}</span>`
 
           if (showCount) {
-            result += `<span class="aside-category-list-count">${cat.length}</span>`
+            result += `<span class="card-category-list-count">${cat.length}</span>`
           }
 
           result += '</a>'
           result += '</li>'
 
           if (child) {
-            result += `<ul class="aside-category-list child">${child}</ul>`
+            result += `<ul class="card-category-list child">${child}</ul>`
           }
         }
       })
@@ -73,14 +83,14 @@ hexo.extend.helper.register('aside_categories', function (categories, options) {
   var moreButton = function () {
     var moreHtml = ''
     if (categories.length <= limit) return ''
-    moreHtml += '<li class="aside-category-list-item is-center">'
+    moreHtml += '<li class="card-category-list-item more is-center">'
-    moreHtml += `<a class="aside-category-list-item-more" href="${categoryDir}" >`
+    moreHtml += `<a class="card-category-list-link-more" href="${categoryDir}">
-    moreHtml += buttonLabel
+                <span>${buttonLabel}</span><i class="fa fa-angle-right" aria-hidden="true"></i></a></li>`
-    moreHtml += '</a></li>'
+
     return moreHtml
   }
 
-  return `<ul class="aside-category-list">
+  return `<ul class="card-category-list">
             ${list[0]}
             ${moreButton()}           
             </ul>`

scripts/helpers/page.js

@@ -31,8 +31,13 @@ hexo.extend.helper.register('injectHtml', function (data) {
   return result
 })
 
-hexo.extend.helper.register('cloudTags', function (source, minfontsize, maxfontsize, limit) {
+hexo.extend.helper.register('cloudTags', function (options = {}) {
   const env = this
+  const source = options.source
+  const minfontsize = options.minfontsize
+  const maxfontsize = options.maxfontsize
+  const limit = options.limit || 8
+
   let result = ''
   const tagLimit = limit === 0 ? source.length : limit
   source.sort('name').limit(tagLimit).forEach(function (tags) {

source/css/_global/index.styl

@@ -192,6 +192,10 @@ img:not([src])
 
 .img-alt
   margin: -.5rem 0 .5rem
+  color: $font-black
+
+  &:hover
+    text-decoration: none !important
 
 // hexo tag video
 .video-container

source/css/_layout/aside.styl

@@ -147,20 +147,20 @@
               .aside-post_title
                 height: auto
 
-  .card-archives ul.archive-list,
+  .card-archives ul.card-archive-list,
-  .card-categories ul.aside-category-list
+  .card-categories ul.card-category-list
     margin: 0
     padding: .2rem 0 0
     list-style: none
 
-  .card-archives ul.archive-list > .archive-list-item,
+  .card-archives ul.card-archive-list > .card-archive-list-item,
-  .card-categories ul.aside-category-list > .aside-category-list-item
+  .card-categories ul.card-category-list > .card-category-list-item
-    padding: .2rem 1rem
+    padding: .15rem 1rem
     cursor: pointer
-    transition: all .3s
+    transition: all .5s
 
     &:hover
-      padding: .2rem .85rem
+      padding: .15rem .85rem
       background-color: $light-blue
 
     a
@@ -180,8 +180,18 @@
           width: 20%
           text-align: right
 
+    &.more
+      span
+        padding-right: .3rem
+        width: auto !important
+        transition: .5s
+
+      &:hover
+        span
+          padding-right: .6rem
+
   .card-categories
-    .aside-category-list
+    .card-category-list
       &.child
         padding: 0 0 0 1.2rem
 

source/css/_mode/darkmode.styl

@@ -159,8 +159,8 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
           border-top: 13px solid lighten(#121212, 10) !important
 
     .md-links-item:before,
-    .aside-category-list-item:hover,
+    .card-category-list-item:hover,
-    .archive-list-item:hover,
+    .card-archive-list-item:hover,
     #bookmark-it
       background-color: lighten(#121212, 10) !important
 
@@ -177,11 +177,11 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
       .headline,
       .length_num,
       .aside-post_title,
-      .aside-category-list-link,
+      .card-category-list-link,
-      .archive-list-link,
+      .card-archive-list-link,
       .social-icon,
-      .aside-category-list-item-more,
+      .card-category-list-link-more,
-      .archive-list-link-more
+      .card-archive-list-link-more
         color: alpha(#FFFFFF, .6) !important
 
     .button--animated:before
@@ -190,7 +190,8 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
     #post-meta,
     #post-meta a,
     #footer-wrap,
-    #footer-wrap a
+    #footer-wrap a,
+    .img-alt
       color: alpha(#FFFFFF, .6) !important
 
     .posttitle,
@@ -286,9 +287,6 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
 
     if hexo-config('valine') && hexo-config('valine.enable')
       #vcomment
-        .vsys
-          background: #2c2c2c !important
-
         .vbtn,
         .vat
           border: 1px solid alpha(#FFFFFF, .6)

source/js/main.js

@@ -362,6 +362,21 @@ $(function () {
     }
   }
 
+  /**
+ * PhotoFigcaption
+ */
+  function addPhotoFigcaption () {
+    var images = $('#article-container img')
+    images.each(function (i, o) {
+      var $this = $(o)
+      if ($this.attr('alt')) {
+        var t = $('<div class="img-alt is-center">' + $this.attr('alt') + '</div>')
+        $this.after(t)
+      }
+    })
+  }
+  if (GLOBAL_CONFIG.isPhotoFigcaption) addPhotoFigcaption()
+
   /**
    * justified-gallery 圖庫排版
    */
@@ -518,8 +533,8 @@ $(function () {
     }
 
     var updateAnchor = function (anchor) {
-      if (window.history.replaceState && anchor !== window.location.hash) {
+      if (anchor !== window.location.hash) {
-        window.history.replaceState(undefined, undefined, anchor)
+        location.replace(window.location.href.split('#')[0] + anchor)
       }
     }
 
@@ -758,19 +773,4 @@ $(function () {
       }
     })
   }
-
-  /**
-   * PhotoFigcaption
-   */
-  function addPhotoFigcaption () {
-    var images = $('#article-container img')
-    images.each(function (i, o) {
-      var $this = $(o)
-      if ($this.attr('alt')) {
-        var t = $('<div class="img-alt is-center">' + $this.attr('alt') + '</div>')
-        $this.after(t)
-      }
-    })
-  }
-  if (GLOBAL_CONFIG.isPhotoFigcaption) addPhotoFigcaption()
 })