breaking changes: 移除 cnzz 分析

feat: 導航欄可隱藏博客名字
feat: 導航欄可設置 logo closed #1104

_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:

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}"}`)
 

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")
 

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)

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": {

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

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

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')