1. Feature: 可設置内联代码块样式 #26

2. Feature: 可設置夜間模式作爲默認樣式
3. Feature: 可設置是否顯示code language名稱
4. Feature: 可設置是否展開或關閉代碼框
5. Feature: 可設置背景圖片/顔色
6. Feature: 可設置是否顯示footer背景
7. Feature: 增加 canvas-nest.js
8. Feature: 頭像可設置效果(轉圈圈)
9. Feature: menu可設置分組
9. Fix: 優化打賞和搜索打開特效
10. Fix: 優化sidebar的打開特效，避免與文章頁特效不同步
11. Fix: 適配**hexo-blog-encrypt**，現在可以顯示toc
12. Fix: 修復設置不顯示評論時，直達評論按鈕沒有消失的bug
13. Fix: 修復post頁底欄，當沒有顯示評論，不顯示TOC，評論和toc都不顯示 這三種狀態下按鈕的bug
14. Fix: 修復代碼框左右滑動時，代碼名字跟著滑動的bug
15. Fix: 其他page頁標題的字體顯示
16. Fix: 修復當設置開啓canvas_ribbons，進入網站會先顯示canvas_ribbons的bug
17. Fix: 完善夜間模式下，字體顯示問題
18. Fix: 修復代碼框 複製 和 代碼名 z-index bug #25
19. Fix: 完善阅读模式

_config.yml

@@ -3,13 +3,15 @@
 # ---------------
 # theme_color:
 #   enable: true
-#   main: "#7A7FF1"
+#   main: "#49B1F5"
-#   paginator: "#7A7FF1"
+#   paginator: "#00c4b6"
 #   button_hover: "#FF7242"
-#   text_selection: "#69c46d"
+#   text_selection: "#00c4b6"
-#   link_color: "#858585"
+#   link_color: "#99a9bf"
+#   meta_color: '#858585'
 #   hr_color: "#A4D8FA"
 #   read-mode-bg_color: '#FAF9DE'
+#   inline-code-color: '#F47466'
 
 # Main menu navigation
 # format: xxx: /xxx/||icon
@@ -45,11 +47,13 @@ favicon: /img/favicon.ico
 # Highlight theme
 # ---------------
 highlight_theme: light
-highlight_copy: true
+highlight_copy: false #代碼複製按鈕
+highlight_lang: true #代碼語言顯示
+highlight_shrink: false #代碼框不展開，需點擊 '>' 打開
 
 code_word_wrap: false
 
-# Nav settings
+# social settings
 # formal: 
 #   icon: link
 # ---------------
@@ -57,6 +61,7 @@ social:
   fa fa-github: https://github.com/jerryc127
   fa fa-rss: /atom.xml
 
+####    search    ####
 # Algolia search
 # ---------------
 algolia_search:
@@ -69,7 +74,6 @@ algolia_search:
     hits_empty: "We didn't find any results for the search: ${query}" # if there are no result
     hits_stats: "${hits} results found in ${time} ms"
 
-
 # Local search
 # Please see doc for more details: https://jerryc.me/posts/21cfbf15/#本地搜索
 # ---------------
@@ -95,8 +99,7 @@ katex:
   hide_scrollbar: true
 
 
-
+####   Analysis    ####
-# Analysis
 # ---------------
 # baidu_analytics: 
 
@@ -151,7 +154,6 @@ lodding_bg:
   flink: /img/friend_404.gif
   post_page: /img/404.jpg
 
-
 post_meta:
   date_type: both # or created or updated 文章日期是创建日或者更新日或都显示
   categories: true # or false 是否显示分类
@@ -174,13 +176,14 @@ post_copyright:
   license: CC BY-NC-SA 4.0
   license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/
 
+# 自動節選
 auto_excerpt:
   enable: true
   length: 150
 
 
-# Share System
+####    Share System    ####
-# ---------------
+# -----------------------------------------
 addThis:
   enable: false
   pubid:
@@ -201,8 +204,8 @@ addtoany:
     - email
     - copy_link
 
-# Comments System
+####   Comments System    ####
-# ---------------
+# ------------------------------------
 disqus:
   enable: false
   shortname: 
@@ -242,8 +245,8 @@ valine:
   placeholder: Please leave your footprints # valine comment input placeholder(like: Please leave your footprints )
   guest_info: nick,mail,link #valine comment header inf
 
-# Footer Settings
+#####     Footer Settings    ####
-# ---------------
+# ------------------------------------
 since: 2018
 
 footer_custom_text:
@@ -256,15 +259,8 @@ ICP:
   url: 
   text:
 
-# busuanzi count for PV / UV in site
-busuanzi:
-  site_uv: true
-  site_pv: true
-  page_pv: true
-
-
-
 
+####    站長驗證    ####
 # Google Webmaster tools verification setting
 # See: https://www.google.com/webmasters/
 google_site_verification:
@@ -281,6 +277,8 @@ baidu_site_verification:
 # see http://zhanzhang.so.com/
 qihu_site_verification:
 
+
+# 友情鏈接界面設置 
 Flink:
   headline: 友情鏈接
   info_headline: 我的Blog資料
@@ -290,25 +288,7 @@ Flink:
   info: Blog 簡介： 今日事,今日畢
   comment: 如果需要交換友鏈,請留言
 
- 
+# 打賞按鈕
-
-runtimeshow:
-  enable: true
-  start_date: 6/7/2018 00:00:00
-
-
-nightshift:
-  enable: true
-
-
-activate_power_mode:
-  enable: false
-
-
-
-announcement:
-  content: 感謝訪問本站，若喜歡請收藏 ^_^
-
 reward:
   enable: true
   QR_code:
@@ -319,36 +299,69 @@ reward:
         img: /img/alipay.jpg
         text: 支付寶
 
+# 推薦文章
 related_post:
   enable: true
   limit: 6 # 顯示推薦文章數目
 
-# canvas_ribbon
+####    美化/效果    ####
+#--------------------------------
+
+# 設置網站背景
+# 可設置圖片 或者 顔色
+# 圖片格式 background: url(http://xxxxxx.com/xxx.jpg)
+# 顔色 background: '#49B202'
+# 留空 顯示白色
+background:
+
+# footer是否顯示圖片背景(與top_img一致)
+footer_bg: false
+
+
+# canvas_ribbon 禁止彩帶背景
 # See: https://github.com/hustcc/ribbon.js
 canvas_ribbon:
-  enable: true
+  enable: false
   size: 150
   alpha: 0.6
   zIndex: -1
   click_to_change: false
 
-
+# 動態彩帶
 canvas_ribbon_piao:
   enable: false
 
+# canvas_nest
+# https://github.com/hustcc/canvas-nest.js
+canvas_nest:
+  enable: false
+  color: '0,0,255' #color of lines, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.)
+  opacity: 0.7 # the opacity of line (0~1), default: 0.5.
+  zIndex: -1 # z-index property of the background, default: -1.
+  count: 99 # the number of lines, default: 99.
+  script: https://cdn.jsdelivr.net/gh/jerryc127/CDN/js/canvas-nest.js # or /js/third-party/canvas-nest.js
 
-# 避免重複網址分散seo
+# 打字效果
-canonical: true
+activate_power_mode:
+  enable: false
 
-# 禁止百度轉碼
+# 鼠標點擊效果
-disable_baidu_transformation: true
+fireworks:
+  enable: false
 
-twitter_meta: true
+# 頭像會一直轉圈
-Open_Graph_meta: true
+avatar_effect: false
 
-#閲讀模式
+# 網站顯示模式
-readmode:
+# day 默認模式
-  enable: true
+# night 黑暗模式（不建議）
+display_mode: day
+
+# 美化post頁顯示
+post_beautify:
+  enable: false
+  title-prefix-icon: '\f0c1'
+  title-prefix-icon-color: "#F47466"
 
 # 全局字體
 font:
@@ -359,23 +372,27 @@ font:
 # 網站名字字體
 # 左上角網站名字 主頁居中網站名字
 blog_title_font: 
-  #字體鏈接
+  font_link: https://fonts.googleapis.com/css?family=Titillium+Web #字體鏈接
-  font_link: https://fonts.googleapis.com/css?family=Titillium+Web
   font-family: Titillium Web, PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
 
 # 水平分隔綫
 hr:
   enable: false
-  #fontawesome上圖標的Unicode
+  icon: '\f21c' #fontawesome上圖標的Unicode
-  icon: '\f21c'
   icon-top: -20px
 
 # 主頁subtitle
+# 打字效果
 subtitle: 
   enable: true
   sub1: 今日事,今日畢
   sub2: Never put off till tomorrow what you can do today  #如果有符號 ' ，記得前面加上 \ 
 
+
+
+
+####    側邊欄    ####
+#-------------------------------------
 # 側邊欄顯示設置
 aside:
   position: right # left or right
@@ -387,8 +404,28 @@ aside:
   card_archives: true
   card_webinfo: true
 
+# 網站公告
+announcement:
+  content: 感謝訪問本站，若喜歡請收藏 ^_^
 
-## chinese traditional to Simplified
+# busuanzi count for PV / UV in site
+# 訪問人數
+busuanzi:
+  site_uv: true
+  site_pv: true
+  page_pv: true
+
+# 網頁開通時間
+# 格式: 月/日/年 時間
+# 也可以寫成 年/月/日 時間
+runtimeshow:
+  enable: true
+  start_date: 6/7/2018 00:00:00
+
+
+####   右下角按鈕  ####
+#----------------------------------------------
+# 簡繁轉換
 translate:
   enable: true
   # 默認按鈕顯示文字
@@ -404,10 +441,17 @@ translate:
   #當文字是繁體時，按鈕顯示的文字
   msgToSimplifiedChinese: "简"
 
+# 夜間模式
+nightshift:
+  enable: true
 
-# 鼠標點擊效果
+#閲讀模式
-fireworks:
+readmode:
-  enable: false
+  enable: true
+
+
+####    other     ####
+#------------------------------------------------
 
 #百度推送
 baidu_push:
@@ -418,6 +462,8 @@ baidu_push:
 instantpage:
   enable: true
 
+# Note (Bootstrap Callout)
+# https://muse.theme-next.org/docs/tag-plugins/note
 note:
   # Note tag style values:
   #  - simple    bs-callout old alert style. Default.
@@ -431,14 +477,21 @@ note:
   # Offset also applied to label tag variables. This option can work with disabled note tag.
   light_bg_offset: 0
 
-
 # 圖片懶加載
 lazyload:
   enable: true
   script: https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js
 
-# 美化post頁顯示
+# 避免重複網址分散seo
-post_beautify:
+canonical: true
-  enable: false
+
-  title-prefix-icon: '\f0c1'
+# 禁止百度轉碼
-  title-prefix-icon-color: "#F47466"
+disable_baidu_transformation: true
+
+# twitter分享自動帶上樣式
+# https://i.loli.net/2019/09/08/qm3RfvUCKbct1Wz.png
+twitter_meta: true
+
+# facebook QQ 等 分享自動帶上樣式
+# https://i.loli.net/2019/09/08/2wbFJEKloisRvhj.png
+Open_Graph_meta: true

layout/includes/additional-js.pug

@@ -22,6 +22,9 @@ if (theme.canvas_ribbon && theme.canvas_ribbon.enable)
 if (theme.canvas_ribbon_piao && theme.canvas_ribbon_piao.enable)
   include ./third-party/canvas-ribbon-piao.pug
 
+if (theme.canvas_nest && theme.canvas_nest.enable)
+  include ./third-party/canvas-nest.pug 
+
 if theme.baidu_push && theme.baidu_push.enable
   script(src=url_for('js/baidupush.js')) 
 

layout/includes/config.pug

@@ -49,6 +49,8 @@ script.
     localSearch: !{localSearch},
     translate: !{translate},
     highlight_copy: '!{theme.highlight_copy}',
+    highlight_lang: '!{theme.highlight_lang}',
+    highlight_shrink: '!{theme.highlight_shrink}',
     copy: {
       success: '!{_p("copy.success")}',
       error: '!{_p("copy.error")}',

layout/includes/footer.pug

@@ -1,4 +1,4 @@
-#footer.layout
+#footer
   - var now = new Date()
   - var nowYear = now.getFullYear()
   if theme.since && theme.since != nowYear

layout/includes/header.pug

@@ -11,7 +11,7 @@
   
   span.pull-right.menus
     .mobile_author_icon
-      img.lozad(src=theme.avatar || url_for('/img/avatar.png') onerror=`onerror=null;src='${theme.lodding_bg.flink}'`)
+      img.lozad.avatar_img(src=theme.avatar || url_for('/img/avatar.png') onerror=`onerror=null;src='${theme.lodding_bg.flink}'`)
     .mobile_post_data
       if site.posts.length
         .mobile_data_item.text-center
@@ -35,11 +35,27 @@
               .length_num= site.categories.length
 
     hr
-    .menus_item
+    .menus_items
       each value, label in theme.menu
+        if !Array.isArray(value)
+          .menus_item
             a.site-page(href=value.split('||')[0])
               i.fa-fw(class=value.split('||')[1])
               span=' '+label
+        else
+          .menus_item
+            a.site-page
+              i.fa-fw(class=label.split('||')[1] aria-hidden="true")
+              span=' '+label.split('||')[0]
+              i.fa.fa-chevron-down.menus-expand(aria-hidden="true")
+            ul.menus_item_child
+              each i in value
+                li
+                  a.site-page(href=i.split('||')[1])
+                    i.fa-fw(class=i.split('||')[2])
+                    span=' '+i.split('||')[0]
+
+
       script.
         document.body.addEventListener('touchstart', function(){ });
   span.pull-right

layout/includes/layout.pug

@@ -22,6 +22,8 @@
 - if (page.tags && page.tags.data) pageKeywords = page.tags.data.map(function(tag) {return tag.name;}).join(',')
 - var pageAuthor = config.email ? config.author + ',' + config.email : config.author
 - var pageCopyright = config.copyright || config.author
+- var body_class = theme.display_mode == 'night' ? 'night-mode' : ''
+
 
 doctype html
 html(lang=config.language)
@@ -44,9 +46,11 @@ html(lang=config.language)
         link(rel='stylesheet', href=item)
     include ./head.pug
     include ./config.pug
-  body
+  body(class=body_class)
     if theme.fireworks && theme.fireworks.enable
       canvas.fireworks
+    if theme.background
+      #web_bg
     if (is_post() && page.toc != false && theme.toc.enable)
       i.fa.fa-arrow-right#toggle-sidebar(aria-hidden="true")
       include ./sidebar.pug
@@ -66,7 +70,9 @@ html(lang=config.language)
             div!= body
           else
             block content
-    footer
+    
+    - var footer_bg = theme.footer_bg == false ? '' : bg_img
+    footer(style=footer_bg)
       include ./footer.pug
     i.fa.fa-arrow-up#go-up(aria-hidden="true")
     include ./rightside.pug

layout/includes/nav.pug

@@ -7,7 +7,8 @@ else
 
 
 if is_home()
-  nav#nav.full_page(style=bg_img)
+  nav#nav.full_page
+    .nav_bg(style=bg_img)
     include ./header.pug
     #site-info
       #site-title
@@ -25,7 +26,8 @@ if is_home()
       i.fa.fa-angle-down.scroll-down-effects
 
 else
-  nav#nav.bg_local(style=bg_img)
+  nav#nav.not_index_bg
+    .nav_bg(style=bg_img)
     include ./header.pug
     #page_site-info
       #site-title

layout/includes/post-bottom.pug

@@ -1,8 +1,17 @@
-#post_bottom
+- var no_comment_show = page.comments !== false ? '' : 'no_comment_show'
+- var no_toc_show = (is_post() && page.toc != false && theme.toc.enable) ? '' : 'no_toc_show'
+#post_bottom(class= no_comment_show + ' ' + no_toc_show)
   #post_bottom_items
+    if page.comments !== false
       a#mobile_to_comment(href="#post-comment")
         i.mobile_scroll_to_comment.fa.fa-comments
+    
+    if (is_post() && page.toc != false && theme.toc.enable)
       i#mobile_toc.fa.fa-list
       #toc_mobile
         .toc_mobile_headline= _p('sidebar.catalog')
+        if (page.encrypt == true)
+          .toc-div-class(style="display:none")!=toc(page.origin,{"class":"toc_mobile_items"})
+        else 
           !=toc(page.content,{"class":"toc_mobile_items"})
+        

layout/includes/rightside.pug

@@ -1,5 +1,5 @@
 section#rightside.rightside
-  if is_post()
+  if is_post() && page.comments !== false
     a#to_comment(href="#post-comment")
       i.scroll_to_comment.fa.fa-comments
   if theme.readmode.enable && is_post()
@@ -9,4 +9,5 @@ section#rightside.rightside
   if theme.translate && theme.translate.enable
     a#translateLink.translate_chn_to_cht(href="javascript:translatePage();" title=_p('rightside.translate_title'))= theme.translate.default
   if theme.nightshift.enable
-    i#nightshift.fa.fa-moon-o.nightshift(title=_p('rightside.night_mode_title'))
+    - var display_mode = theme.display_mode == 'night'? 'fa fa-sun-o' : 'fa fa-moon-o'
+    i#nightshift.nightshift(class=display_mode title=_p('rightside.night_mode_title'))

layout/includes/sidebar.pug

@@ -17,4 +17,8 @@
         span.progress-num 0
         span.progress-percentage %
         div.sidebar-toc__progress-bar      
+      if (page.encrypt == true)
+        div.sidebar-toc__content.toc-div-class(style="display:none")!=toc(page.origin, {list_number: tocNumber})
+      else 
         div.sidebar-toc__content!=toc(page.content, {list_number: tocNumber})
+      

layout/includes/third-party/canvas-nest.pug

@@ -0,0 +1 @@
+script(color=theme.canvas_nest.color opacity=theme.canvas_nest.opacity zIndex=theme.canvas_nest.zIndex count=theme.canvas_nest.count src=url_for(theme.canvas_nest.script))

layout/includes/widget/card_author.pug

@@ -2,7 +2,7 @@
   .card-content
     .post_data
       .data-item.text-center
-        img.lozad(src=theme.avatar || url_for('/img/avatar.png') onerror=`onerror=null;src='${theme.lodding_bg.flink}'`)
+        img.lozad.avatar_img(src=theme.avatar || url_for('/img/avatar.png') onerror=`onerror=null;src='${theme.lodding_bg.flink}'`)
         p.author-info__name.text-center= config.author
         p.author-info__description.text-center= config.description
 

package.json

@@ -1,6 +1,6 @@
 {
-  "name": "hexo-theme-butterfly",
+  "name": "hexo-theme-melody",
-  "version": "1.1.0",
+  "version": "1.1.5",
   "description": "A Hexo Theme: Butterfly"
 
 }

source/css/_global/index.styl

@@ -23,6 +23,19 @@ body
 *::-webkit-scrollbar-track
   background-color: transparent
 
+
+#web_bg
+  background: $web-bg
+  height: 100%
+  width: 100%
+  background-size: cover
+  position: fixed
+  z-index: -999
+  background-attachment: local
+  background-repeat: no-repeat
+  background-position: center
+  
+
 h1,
 h2,
 h3,
@@ -208,7 +221,8 @@ table
     font-size: 98%
     font-family: $code-font
 
-#site-title, #site-sub-title, 
+.full_page #site-title, 
+.full_page #site-sub-title, 
 #site-name,
 #aside_content .author-info__name,
 #aside_content .author-info__description
@@ -284,70 +298,67 @@ table
 
 
 // bookmark 樣式
-.fc-container .fancybox-bg {
+.fc-container .fancybox-bg 
-  background: #eee;
+  background: #eee
-}
 
-.fancybox-is-open.fc-container .fancybox-bg {
-  opacity: 0.95;
-}
 
-.fc-content {
+.fancybox-is-open.fc-container .fancybox-bg 
-  margin: 20px;
+  opacity: 0.95
-  max-width: 550px;
-  padding: 50px;
-  box-shadow: 10px 10px 60px -25px;
-  border-radius: 4px;
-}
 
-.fc-content h3 {
-  margin-top: 0;
-  font-size: 1.6em;
-  letter-spacing: normal;
-}
 
-.fc-content p {
+.fc-content 
-  color: #666;
+  margin: 20px
-  line-height: 1.5;
+  max-width: 550px
-}
+  padding: 50px
+  box-shadow: 10px 10px 60px -25px
+  border-radius: 4px
+
+
+.fc-content h3 
+  margin-top: 0
+  font-size: 1.6em
+  letter-spacing: normal
+
+
+.fc-content p 
+  color: #666
+  line-height: 1.5
+
+
+.fc-content p:last-child 
+  margin-bottom: 0
 
-.fc-content p:last-child {
-  margin-bottom: 0;
-}
 
 /* Custom animation */
 .fancybox-fx-material.fancybox-slide--previous,
-.fancybox-fx-material.fancybox-slide--next {
+.fancybox-fx-material.fancybox-slide--next 
-  transform: translateY(-60px) scale(1.1);
+  transform: translateY(-60px) scale(1.1)
-  opacity: 0;
+  opacity: 0
-}
+
+
+.fancybox-fx-material.fancybox-slide--current 
+  opacity: 1
+  transform: translateY(0) scale(1)
 
-.fancybox-fx-material.fancybox-slide--current {
-  opacity: 1;
-  transform: translateY(0) scale(1);
-}
 
 .bookmark-ok
-  background: #FF6666;
+  background: #FF6666
-  border-width: 0;
+  border-width: 0
-  color: #fff;
+  color: #fff
-  text-decoration: none;
+  text-decoration: none
-  padding: 7px 20px;
+  padding: 7px 20px
-  line-height: 1.5;
+  line-height: 1.5
-  border-radius: 20px;
+  border-radius: 20px
-  text-transform: uppercase;
+  text-transform: uppercase
-  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif
-  font-size: 80%;
+  font-size: 80%
-  font-weight: 700;
+  font-weight: 700
-  margin: 5px 5px 5px 0;
+  margin: 5px 5px 5px 0
-  display: inline-block;
+  display: inline-block
-  cursor: pointer;
+  cursor: pointer
-  outline: none;
+  outline: none
-  transition: all .2s ease-in-out;
+  transition: all .2s ease-in-out
-  -webkit-user-select: none;
+  user-select: none
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
 
 .tright
   text-align: right 
@@ -358,6 +369,9 @@ table
 .is_invisible
   display: none !important
 
+.is_hidden
+  overflow: hidden
+
 .fireworks
   position: fixed
   z-index: -1

source/css/_highlight/highlight.styl

@@ -2,21 +2,8 @@
 @require "theme"
 @require "diff"
 
-// languages = "js" "javascript" "python" "ruby" "xml" "html" "css" "perl" "sql" "coffeescript" "java" "scala" "kotlin" "c" "c\+\+" "go" "less" "sass" "scss" "stylus" "styl" "typescript" "ts" "bash" "yml" "yaml" "gradle" "groovy" "ejs" "swig" "markdown"
 wordWrap = !hexo-config("rootConfig.highlight.line_number") && hexo-config("code_word_wrap")
 
-// loopForLanguages()
-//   for lang in languages
-//     .article-container
-//       figure.highlight
-//         &{"." + lang}
-//           table
-//             &:before
-//               content: lang
-
-// loopForLanguages()
-
-// Placeholder: $code-block
 $code-block
   overflow: auto
   margin: 1rem 0
@@ -102,18 +89,8 @@ blockquote
       width: auto
       border: none
 
-      &:before
+      if hexo-config('highlight_shrink') == true
-        position: absolute
+        display: none
-        z-index: 1
-        display: inline-block
-        margin-top: -1.4rem
-        padding: 0 0.7rem
-        width: 5rem
-        color: $highlight-foreground
-        content: attr(data-content)
-        font-weight: bold
-        font-size: 0.8rem
-        line-height: 1.4rem
 
       &:after
         position: absolute

source/css/_layout/aside.styl

@@ -259,9 +259,6 @@
   .card-archives
     margin-bottom: 20px
   
-  .card-announcement-animation
-    animation: announ_animation 1.5s infinite
-  
   .card-webinfo
     .webinfo
       padding: 0.2rem 1rem

source/css/_layout/footer.styl

@@ -4,11 +4,27 @@ footer
   background-attachment: local
   background-position: bottom
   background-size: cover
+  position: relative
+
+  if hexo-config('footer_bg') != false
+    &:before
+      position: absolute
+      bottom: 0
+      left: 0
+      display: block
+      content: ''
+      width: 100%
+      height: 100%
+      opacity: 0.5
+      background-color: #394245
+      background-image: linear-gradient(234deg, #394245 0%, #000 100%)
+
 
 #footer
   padding: 1.2rem 1rem 1rem
   color: $light-grey
   text-align: center
+  position: relative
 
   a
     color: $light-grey

source/css/_layout/head.styl

@@ -1,17 +1,20 @@
 #nav
   position: relative
   margin-bottom: 1rem
+
+  &.full_page
+    height: 100vh
+  
+  .nav_bg
+    width: 100%
+    height: 100%
     background-color: $light-blue
     background-position: center
     background-size: cover
-
-
-  &.full_page
     background-attachment: local
-    height: 100vh
 
-  &.bg_local
+  &.not_index_bg
-    background-attachment: local
+    height: 20rem
 
 
   #site-social-icons
@@ -49,6 +52,11 @@
 #site-sub-title
   font-size: 0.8rem
 
+#page_site-info
+  position: absolute
+  top: 10rem
+  width: 100%
+
 .scroll-down
   position: absolute
   bottom: 0
@@ -58,6 +66,10 @@
   font-size: 30px
   text-align: center
 
+  .scroll-down-effects
+    position: absolute
+    color: #fff
+
 
 #page-header
   position: absolute
@@ -153,6 +165,20 @@
           text-transform: uppercase
           color:#4c4948
 
+    .menus-expand
+      position: absolute
+      width: 30px !important
+      height: 30px
+      right: 0
+      padding: 6px
+      display: none
+      transform: rotate(0deg)
+      transition: all .3s
+    
+      &.menus-closed
+        transform: rotate(180deg) !important
+        transition: all .3s
+      
     hr         
       margin: 1rem auto
       display: none
@@ -166,13 +192,10 @@
 
   .site-page
     position: relative
-    margin-left: 0.6rem
     padding-bottom: 0.3rem
     text-shadow: 0.05rem 0.05rem 0.1rem rgba(0, 0, 0, 0.3)
     font-size: 0.7rem
     cursor: pointer
-    margin-left: 1rem
-
     &::after
       position: absolute
       bottom: 0
@@ -232,6 +255,51 @@
   #site-sub-title
     font-size: 1.2rem
 
+  #page-header    
+    .menus_item
+      display: inline-block
+      padding: 0 0.5rem
+
+      &:hover,&:focus
+        .menus_item_child
+          display: block
+
+    .menus_item_child
+      position: absolute
+      background-color: alpha($white, 0.8)
+      padding: 8px 10px
+      width: fit-content
+      border-radius: 5px
+      box-shadow: 0 5px 20px -4px rgba(0,0,0,.5)
+      display: none
+      opacity: 1
+      animation: sub_menus .3s .1s ease both
+
+      &:before
+        content: ""
+        position: absolute
+        top: -20px
+        left: 50%
+        margin-left: -10px
+        border-width: 10px
+        border-style: solid
+        border-color: transparent transparent alpha($white, 0.8)
+
+    .menus_item_child li
+      list-style: none
+      text-align: center
+
+      a
+        color: #3b3a3a;
+        text-shadow: none;
+
+    &.fixed.visible
+      .menus_item_child
+        background-color: #ffffff
+
+        &:before
+          border-color: transparent transparent #ffffff
+
 @media screen and (max-width: $sm)
   #page-header
     padding: 10px 0.8rem
@@ -255,7 +323,7 @@
       .mobile_post_data
         display: flex
 
-      .menus_item
+      .menus_items
         a
           display: block !important
           opacity: 1 !important
@@ -279,10 +347,17 @@
           &:hover
             color: $light-blue
 
+        .menus-expand
+          display: inline-block
+        
+        .menus_item_child
+          list-style: none
+          margin: 0
+        
       .mobile_author_icon
         display: block
      
-      .menus_item 
+      .menus_items 
           padding: 0 .5rem
           margin-bottom: 5rem                              
               
@@ -299,3 +374,6 @@
       .search
         display: inline-block
         opacity: 1
+
+
+

source/css/_layout/nightshift.styl

@@ -1,8 +1,5 @@
 if hexo-config("nightshift") && hexo-config("nightshift.enable")
   .night-mode 
-    footer
-      background: #2d3035
-
     #sidebar
       background: #2d3035 !important
       box-shadow: -0.25rem 0 0.25rem #2d3035 !important
@@ -183,7 +180,8 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
       background:#2d3035
 
     #nav,
-    #top-container
+    #top-container,
+    footer
       &::before
         content: ""
         position: absolute
@@ -202,10 +200,14 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
 
     #site-info .blogtitle, 
     span.subtitle,
+    #site-title,
     #post-info .posttitle,
     #post-info #post-meta,
     #site-social-icons i,
-    #top-container a
+    #top-container a,
+    #footer,
+    #footer a,
+    #page-header a
       color: rgba(238,238,238,.6)
 
     //打賞 分享
@@ -234,6 +236,16 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
         a
           color: #99a9bf !important
 
+    #web_bg
+      background-color: #2d3032
+
+    #hbe-security
+      label
+        color: #99a9bf !important
+      input
+        background-color: #616a6b
+
+
   @media screen and (max-width: 768px)
     .night-mode
       color: #99a9bf 
@@ -264,6 +276,18 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
       .recent-post-item
           background: #2d3035 !important
 
+      #page-header 
+        .menus_item_child
+          background-color: #2d3035 !important
+
+          &:before
+            border-color: transparent transparent #2d3035 !important
+
+          li
+            a
+              color: #99a9bf
+
+
 
 
     

source/css/_layout/post.styl

@@ -285,6 +285,31 @@ img
   &:hover
     color: darken($highlight-aqua, 20%)
 
+.code_lang
+  position: absolute
+  font-weight: bold;
+  font-size: 0.8rem;
+  line-height: 1.4rem;
+  color: $highlight-foreground
+  left: 30px
+  z-index: 1
+  cursor: pointer
+
+.code-expand
+  position: absolute
+  top: 0
+  color: $highlight-foreground
+  padding: 7px 10px
+  z-index: 1
+  cursor: pointer
+  transition: all .3s
+  transform: rotate(0deg)
+
+.code-closed
+  transform: rotate(-90deg) !important
+  transition: all .3s
+
+
 .copy-notice
   position: absolute
   top: 0
@@ -352,8 +377,6 @@ img
   .layout
     width: $content-large-width
         
-
-        
 .katex-wrap
   overflow: auto
   if hexo-config("katex") && hexo-config("katex.hide_scrollbar")

source/css/_layout/post_bottom.styl

@@ -8,6 +8,7 @@
   display: none
   transition: all .2s
   cursor: pointer
+  z-index: 100
 
   &.toc_mobile_show
     bottom: 0
@@ -30,7 +31,7 @@
     width: 50%
     height: 70%
     position: fixed
-    bottom: 65px
+    bottom: 60px
     right: 10px
     overflow: scroll
     padding: 15px 10px
@@ -52,6 +53,18 @@
       font-size: 18px
       font-weight: bold
   
+  &.no_comment_show
+    #mobile_toc
+      width: 100%
+      padding: 16px 0
+
+    #toc_mobile
+      right: 25%
+
+  &.no_toc_show
+    #mobile_to_comment
+      width: 100%
+
 @media screen and (max-width:768px)
   #post_bottom
     display: block

source/css/_layout/readmode.styl

@@ -35,7 +35,7 @@ if hexo-config("readmode") && hexo-config("readmode.enable")
       
       #page-header
         &.fixed
-          background: none
+          background: alpha(darken($pale-yellow,5),0.5)
           box-shadow: none
 
           &.open-sidebar
@@ -99,6 +99,29 @@ if hexo-config("readmode") && hexo-config("readmode.enable")
     .copy-notice
       background: darken($pale-yellow,10)
     
+    .toc_mobile_show
+      background: alpha(darken($pale-yellow,5),0.5) !important
+      box-shadow: none !important
+      
+      #post_bottom_items
+        #mobile_to_comment
+          display: none 
+        #mobile_toc
+          width: 100%
+          padding: 16px 0
+        #toc_mobile
+          right: 25%
+          background: darken($pale-yellow,5)
+
+
+  @media screen and (min-width: 768px)
+    .read-mode
+      .menus_item_child
+        background-color: darken($pale-yellow,5) !important
+
+        &:before
+          border-color: transparent transparent darken($pale-yellow,5) !important
+
 
 
 

source/css/_layout/relatedposts.styl

@@ -21,10 +21,6 @@
 
   .relatedPosts_cover
     border: 0
-    -webkit-transition: all 0.6s
-    -moz-transition: all 0.6s
-    -o-transition: all 0.6s
-    -ms-transition: all 0.6s
     transition: all 0.6s
     display: block
     width: 100%
@@ -60,7 +56,6 @@
     clear: both
 
 
-
 @media screen and (max-width:768px) 
   .relatedPosts_item
     width: calc(100%/2 - 4px)

source/css/_layout/reward.styl

@@ -30,6 +30,7 @@
       left: 0
       transition: all 0.6s
       display: none
+      opacity: 1
   
       .reward-all
         margin: 0 auto

source/css/_layout/sidebar.styl

@@ -10,7 +10,6 @@
   background: $sidebar-background
   box-shadow: -0.25rem 0 0.25rem rgba(232, 237, 250, 0.6) inset
   opacity:  0.9
-  transition: all 0.2s
   
   .sidebar-toc
     ol,

source/css/_layout/z-other.styl

@@ -96,10 +96,7 @@ a.article-meta__categories
     -webkit-box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
     box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
 
-#page_site-info
+
-  padding: 10rem 1rem 7rem
-  #site-title
-    font-family: PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
 
 @media screen and (min-width: 900px) 
   if hexo-config("aside.position") == "left"
@@ -116,6 +113,9 @@ a.article-meta__categories
 
 
 @media screen and (max-width:768px)
+  #web_bg
+    display: none 
+    
   .recent-post-item
     height: auto !important
     border-radius: 8px
@@ -155,7 +155,6 @@ a.article-meta__categories
       -webkit-box-shadow: none
       box-shadow: none
       
-    
   .layout_page
     padding: 0 !important
   
@@ -165,8 +164,6 @@ a.article-meta__categories
   .category-lists
     padding: 0
   
-
-  
   .recent-post-info 
     padding: 20px 10px !important
     width: 100%
@@ -174,11 +171,15 @@ a.article-meta__categories
   #recent-posts #pagination
     margin-bottom: 0
 
-  #nav #site-social-icons
+  #nav 
+    #site-social-icons
       display: block
 
+    &.not_index_bg
+      height: 14rem
+
     #page_site-info
-    padding: 7rem 1rem 5rem
+      top: 7rem
   
   #top-container
     height: 14rem
@@ -195,11 +196,10 @@ a.article-meta__categories
     display: none !important
 
 
-
 .layout_page,
 .layout_post,
 footer
-  animation: main 1s;
+  animation: main 1s
 
 #nav,
 #top-container
@@ -208,82 +208,82 @@ footer
 #site-title
   animation: titlescale 1s
 
-.search-dialog
+canvas,#web_bg
-  transition: all .2s
+  animation: to_show 4s
+
+.card-announcement-animation
+  animation: announ_animation 1.5s infinite
 
 .scroll-down-effects
-  -webkit-animation: pulse 1.5s infinite
+  animation: scroll-down-effect 1.5s infinite
-  animation: pulse 1.5s infinite
-  // font-size: 28px
-  position: absolute
-  color: #fff
 
-.is_hidden
+if hexo-config("avatar_effect") == true
-  overflow: hidden
+  .avatar_img
-@keyframes pulse{
+    animation: avatar_turn_around 2s linear infinite
 
-  0%,to{
+.reward-main
-    opacity:.4
+  animation: donate_effcet .3s .1s ease both;
-    top:0}
+
-  50%{
+
+@keyframes scroll-down-effect
+  0%
+    opacity: 0.4
+    top: 0
+  50%
     opacity: 1
-    top:-16px}
+    top: -16px
-    }
+  100%
+    opacity: 0.4
+    top: 0
     
-@keyframes header {
+@keyframes header 
-  0% {
+  0% 
-  opacity: 0;
+    opacity: 0
     transform: translateY(-50px)
-}
+  100% 
-100% {
+    opacity: 1
-  opacity: 1;
     transform: translateY(0)
-}
 
-}
+@keyframes main
-
+  0% 
-
+    opacity: 0
-@keyframes main {
-  0% {
-  opacity: 0;
     transform: translateY(50px)
-}
+  100% 
-100% {
+    opacity: 1
-  opacity: 1;
     transform: translateY(0)
-}
-}
 
-@keyframes titlescale{
+@keyframes titlescale
-  
+  0%
-  0% {
+    opacity: 0
-    // opacity:0;
     transform: scale(0.7)
-}
+  100% 
-  100% {
+    opacity: 1
-    // opacity:1;
     transform: scale(1)
-}
 
-}
+@keyframes to_show
+  0%
+    opacity: 0
+  100%
+    opacity: 1
  
+@keyframes avatar_turn_around
+  from
+    transform: rotate(0deg)
+  to
+    transform: rotate(360deg)
 
-.article-container .code_full_page
+@keyframes sub_menus
-  position: fixed;
+  0%
-  top: 0;
+    opacity: 0
-  left: 0;
+    transform: translateY(10px)
-  width: 100%;
+  100%
-  height: 100%;
+    opacity: 1
-  min-width: 100%;
+    transform: translateY(0)
-  z-index: 9999;
-  margin: 0;
-  animation: code_full_page 1s;
 
-.code_body
+@keyframes donate_effcet
-  overflow: hidden
+  0%
-
+    opacity: 0
-@keyframes code_full_page{
+    transform: translateY(-20px)
-  0%{transform:scale(0)}
+  100%
-  50%{transform:scale(1)}
+    opacity: 1
-  80%{transform:scale(.98)}
+    transform: translateY(0)
-  100%{transform:scale(1)}}

source/css/var.styl

@@ -7,6 +7,7 @@ $theme-meta-color = #858585
 $theme-link-color = #99a9bf
 $theme-hr-color = #A4D8FA
 $theme-read-mode-bg-color = #FAF9DE
+$inline-code-color = #F47466
 $font-family= Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
 $code-font = consolas, Menlo, "PingFang SC", "Microsoft YaHei", monospace, Helvetica Neue For Number
 $site-name-font = "Titillium Web", Lato,PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
@@ -25,6 +26,7 @@ if hexo-config("theme_color") && hexo-config("theme_color.enable")
   $theme-meta-color = convert(hexo-config("theme_color.meta_color")) || #858585
   $theme-hr-color = convert(hexo-config("theme_color.hr_color")) || #A4D8FA
   $theme-read-mode-bg-color = convert(hexo-config("theme_color.read-mode-bg_color")) || #FAF9DE
+  $inline-code-color = convert(hexo-config("theme_color.inline-code-color")) || #F47466
 
 if hexo-config("font") && hexo-config("font.enable")
   $font-family = convert(hexo-config("font.font-family")) || 'Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif'
@@ -60,6 +62,7 @@ $sidebar-icon-left = $sidebar-icon-top - 4px
 $sidebar-icon-size = 16px
 $go-up-bottom = $sidebar-icon-top
 $go-up-right = -($sidebar-icon-left)
+$web-bg = convert(hexo-config("background"))
 // Global color & SVG
 $pale-blue = $theme-hr-color
 $light-blue = $theme-color
@@ -94,7 +97,7 @@ $selection = $theme-text-selection-color
 // code
 $code-font-size = $font-size
 $code-font-family = $font-family
-$code-foreground = $font-color
+$code-foreground = $inline-code-color
 $code-background = rgba(27, 31, 35, 0.05)
 $line-height-code-block = 20px
 $blockquote-color = #6a737d

source/js/main.js

@@ -9,11 +9,11 @@ $(function () {
             $('body').animate({
               paddingLeft: 300
             }, 200)
-            $('#sidebar').animate({}, function () {
+
-              $('#sidebar').css({
+            $('#sidebar').animate({
-                'transform': 'translateX(300px)'
+              left: 0
             }, 200)
-            })
+
             $('#toggle-sidebar').animate({}, function () {
               $('#toggle-sidebar').css({
                 'transform': 'rotateZ(180deg)',
@@ -45,11 +45,9 @@ $(function () {
           paddingLeft: 0
         }, 200)
 
-        $('#sidebar').animate({}, function () {
+        $('#sidebar').animate({
-          $('#sidebar').css({
+          left: -300
-            'transform': 'translateX(0px)'
+        }, 200)
-          })
-        })
 
         $('#toggle-sidebar').animate({}, function () {
           $('#toggle-sidebar').css({
@@ -63,11 +61,11 @@ $(function () {
         $('body').animate({
           paddingLeft: 300
         }, 200)
-        $('#sidebar').animate({}, function () {
+
-          $('#sidebar').css({
+        $('#sidebar').animate({
-            'transform': 'translateX(300px)'
+          left: 0
-          })
+        }, 200)
-        })
+
         $('#toggle-sidebar').animate({}, function () {
           $('#toggle-sidebar').css({
             'transform': 'rotateZ(180deg)',
@@ -82,7 +80,7 @@ $(function () {
   // 首页fullpage添加
   // 添加class 
   if (/Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent)) {} else {
-    $('.full_page').css('background-attachment', 'fixed');
+    $('.full_page .nav_bg').css('background-attachment', 'fixed');
     $('#to_comment').css("display", "block")
   }
 
@@ -152,10 +150,10 @@ $(function () {
   //-------------------------------------------------------------------------------------------------------
   //代码copy
   // Add copy icon
+  $('figure.highlight').wrap('<div class="code-area-wrap"></div>')
 
   var highlight_copy = GLOBAL_CONFIG.highlight_copy
   if (highlight_copy == 'true') {
-    $('figure.highlight').wrap('<div class="code-area-wrap"></div>')
     var $copyIcon = $('<i class="fa fa-clipboard" aria-hidden="true"></i>')
     var $notice = $('<div class="copy-notice"></div>')
     $('.code-area-wrap').prepend($copyIcon)
@@ -210,6 +208,47 @@ $(function () {
       selection.removeAllRanges()
     })
   }
+
+  //代碼框語言識別
+  var highlight_lang = GLOBAL_CONFIG.highlight_lang
+  if (highlight_lang == 'true') {
+    var $highlight_lang = $('<div class="code_lang"></div>')
+    $('figure').before($highlight_lang)
+    var lang_name_index
+    var lang_name
+    $('figure').each(function () {
+      lang_name_index = lang_name = $(this).attr('class').split(' ')[1];
+      if (lang_name_index == 'js')
+        lang_name = 'javascript'
+      if (lang_name_index == 'md')
+        lang_name = 'markdown'
+      if (lang_name_index == 'plain')
+        lang_name = 'code'
+      if (lang_name_index == 'py')
+        lang_name = 'python'
+
+      $(this).siblings(".code_lang").text(lang_name)
+
+    })
+  }
+  //代碼收縮
+  var highlight_shrink = GLOBAL_CONFIG.highlight_shrink
+  if (highlight_shrink == 'true') {
+    var $code_expand = $('<i class="fa fa-angle-down code-expand code-closed" aria-hidden="true"></i>')
+  } else {
+    var $code_expand = $('<i class="fa fa-angle-down code-expand" aria-hidden="true"></i>')
+  }
+  $('.code-area-wrap').prepend($code_expand)
+  $('.code-area-wrap .code-expand').on('click', function () {
+    if ($(this).hasClass('code-closed')) {
+      $(this).siblings('figure').find('table').show();
+      $(this).removeClass('code-closed');
+    } else {
+      $(this).siblings('figure').find('table').hide();
+      $(this).addClass('code-closed');
+    }
+  })
+
   //---------------------------------------------------------------------------------------------------
   //fancybox
   var imgList = $(".recent-post-info  img").not('.no-fancybox');
@@ -284,7 +323,10 @@ $(function () {
     $('.menus').animate({
       right: -250
     }, 300, function () {
-      {$('.menus').css({ 'display': ''})
+      {
+        $('.menus').css({
+          'display': ''
+        })
       }
     })
     $('.menu_mask').css("display", "")
@@ -309,6 +351,8 @@ $(function () {
   var initTop = 0
   $('.toc-child').hide()
 
+  var is_post_bottom = ($('#post_bottom').hasClass('no_comment_show')) && ($('#post_bottom').hasClass('no_toc_show'))
+
   // main of scroll
   $(window).scroll(throttle(function (event) {
     var currentTop = $(this).scrollTop()
@@ -317,6 +361,8 @@ $(function () {
       scrollPercent(currentTop)
       // head position
       findHeadPosition(currentTop)
+      auto_scroll_toc(currentTop)
+      
     }
     var isUp = scrollDirection(currentTop)
 
@@ -325,13 +371,17 @@ $(function () {
 
         if (isUp) {
           $('#page-header').hasClass('visible') ? $('#page-header').removeClass('visible') : console.log()
+          if (!is_post_bottom) {
             $('#post_bottom').removeClass('toc_mobile_show')
             $('#toc_mobile').hasClass('is_visible') ? $('#toc_mobile').removeClass('is_visible') : console.log()
+          }
 
         } else {
           $('#page-header').hasClass('visible') ? console.log() : $('#page-header').addClass('visible')
+          if (!is_post_bottom) {
             $('#post_bottom').addClass('toc_mobile_show')
             $('#toc_mobile').hasClass('is_visible') ? $('#toc_mobile').removeClass('is_visible') : console.log()
+          }
 
         }
         $('#page-header').addClass('fixed')
@@ -358,7 +408,9 @@ $(function () {
       } else {
         if (currentTop === 0) {
           $('#page-header').removeClass('fixed').removeClass('visible')
+          if (!is_post_bottom) {
             $('#post_bottom').removeClass('toc_mobile_show')
+          }
 
         }
 
@@ -379,6 +431,7 @@ $(function () {
       }
     }
 
+    if (!is_post_bottom) {
       if ($(window).width() <= 768 && $('#post_bottom').hasClass('toc_mobile_show')) {
         $('#rightside').css('bottom', '110px')
         $('#go-up').css('bottom', '70px')
@@ -387,6 +440,7 @@ $(function () {
         $('#rightside').css('bottom', '60px')
         $('#go-up').css('bottom', '20px')
       }
+    }
 
   }, 50, 100))
 
@@ -492,31 +546,23 @@ $(function () {
         .find('.toc-child').hide()
     }
 
+
+  }
+
+  function auto_scroll_toc(currentTop) {
     if ($('.toc-link').hasClass('active')) {
       var active_position = $(".active").offset().top;
       var sidebar_scrolltop = $("#sidebar").scrollTop();
-      if (active_position > (top + $(window).height() - 50)) {
+      if (active_position > (currentTop + $(window).height() - 50)) {
         $("#sidebar").scrollTop(sidebar_scrolltop + 100);
-      } else if (active_position < top + 50) {
+      } else if (active_position < currentTop + 50) {
         $("#sidebar").scrollTop(sidebar_scrolltop - 100);
       }
     }
-
   }
 
-  //代碼框雙擊全屏
-  $('figure').on('dblclick', function (e) {
-    if (e.target !== this)
-      return;
-    $(this).toggleClass('code_full_page');
-    $('body').toggleClass('code_body');
-  });
-
-
   //閲讀模式
   $("#readmode").click(function () {
-
-
     if (Cookies.get("night-mode") == "night") {
       $('body').toggleClass('night-mode');
       $('body').toggleClass('read-mode');
@@ -528,10 +574,8 @@ $(function () {
       $('#font_plus,#font_minus,#to_comment').toggleClass('is_visible');
       $('#to_comment').toggleClass('is_invisible');
     }
-
   });
 
-
   //閲讀模式下字體調整
   $("#font_plus").click(function () {
     var font_size_record = parseFloat($('body').css('font-size'))
@@ -551,26 +595,29 @@ $(function () {
     $('code').css('font-size', font_size_record - 1)
   });
 
-
+  // 手機顯示toc
   $('#mobile_toc').on('click', function () {
     $("#toc_mobile").toggleClass('is_visible')
   })
 
-  //代碼框語言識別
+  // sub-menus 位置調整
-  $('figure').each(function () {   
+  if ( $(window).width() > 768 ) {
-    var lang_name_index;
+    $('.menus_item_child').each(function () {
-    var lang_name;
+      var a_width= $(this).siblings('a').outerWidth(true);
-    lang_name_index = lang_name = $(this).attr('class').split(' ')[1];
+      var child_width = $(this).outerWidth(true);
-    if (lang_name_index == 'js')
+      $(this).css("margin-left", -(child_width/ 2 - a_width/ 2))
-      lang_name = 'javascript'
+    })
-    if (lang_name_index == 'md')
+  }
-      lang_name = 'markdown'
-    if (lang_name_index == 'plain')
-      lang_name = 'code' 
-    if (lang_name_index == 'py')
-      lang_name = 'python'
 
-    $('figure.' + lang_name_index + ' table').attr('data-content', lang_name);
+  // 手機端sub-menu 展開/收縮
+    $('.menus-expand').on('click', function () {
+      if ($(this).hasClass('menus-closed')) {
+        $(this).parents('.menus_item').find('.menus_item_child').show();
+        $(this).removeClass('menus-closed');
+      } else {
+        $(this).parents('.menus_item').find('.menus_item_child').hide();
+        $(this).addClass('menus-closed');
+      }
     })
   
 });

source/js/nightshift.js

@@ -11,6 +11,10 @@ $(function () {
   }
 
   function changeReadModel() {
+
+    if (Cookies.get("night-mode") == null)
+      return
+  
     if (Cookies.get("night-mode") == "night") {
       $("body").addClass("night-mode");
       $("#nightshift").removeClass("fa-moon-o").addClass("fa-sun-o");

source/js/search/algolia.js

@@ -7,7 +7,7 @@ $(function () {
       $('.search-dialog').css({
         'display': 'block',
         'animation': 'titlescale 0.5s'
-      })
+      }),300
     })
 
     $('.ais-search-box--input').focus()

source/js/search/local-search.js

@@ -7,7 +7,7 @@ $(function () {
       $('.search-dialog').css({
         'display': 'block',
         'animation': 'titlescale 0.5s'
-      })
+      }),300
     })
           $('#local-search-input input').focus()
   

source/js/third-party/canvas-nest.js

@@ -0,0 +1,11 @@
+!function(){
+	var userAgentInfo = navigator.userAgent;
+    var Agents = ["iPad", "iPhone", "Android", 
+          "SymbianOS", "Windows Phone",
+           "iPod", "webOS", "BlackBerry", "IEMobile"];
+    for (var v = 0; v < Agents.length; v++) {
+      if (userAgentInfo.indexOf(Agents[v]) > 0) {
+        return;
+      }
+    }
+	function o(w,v,i){return w.getAttribute(v)||i}function j(i){return document.getElementsByTagName(i)}function l(){var i=j("script"),w=i.length,v=i[w-1];return{l:w,z:o(v,"zIndex",-1),o:o(v,"opacity",0.5),c:o(v,"color","0,0,0"),n:o(v,"count",99)}}function k(){r=u.width=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,n=u.height=window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight}function b(){e.clearRect(0,0,r,n);var w=[f].concat(t);var x,v,A,B,z,y;t.forEach(function(i){i.x+=i.xa,i.y+=i.ya,i.xa*=i.x>r||i.x<0?-1:1,i.ya*=i.y>n||i.y<0?-1:1,e.fillRect(i.x-0.5,i.y-0.5,1,1);for(v=0;v<w.length;v++){x=w[v];if(i!==x&&null!==x.x&&null!==x.y){B=i.x-x.x,z=i.y-x.y,y=B*B+z*z;y<x.max&&(x===f&&y>=x.max/2&&(i.x-=0.03*B,i.y-=0.03*z),A=(x.max-y)/x.max,e.beginPath(),e.lineWidth=A/2,e.strokeStyle="rgba("+s.c+","+(A+0.2)+")",e.moveTo(i.x,i.y),e.lineTo(x.x,x.y),e.stroke())}}w.splice(w.indexOf(i),1)}),m(b)}var u=document.createElement("canvas"),s=l(),c="c_n"+s.l,e=u.getContext("2d"),r,n,m=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(i){window.setTimeout(i,1000/45)},a=Math.random,f={x:null,y:null,max:20000};u.id=c;u.style.cssText="position:fixed;top:0;left:0;z-index:"+s.z+";opacity:"+s.o;j("body")[0].appendChild(u);k(),window.onresize=k;window.onmousemove=function(i){i=i||window.event,f.x=i.clientX,f.y=i.clientY},window.onmouseout=function(){f.x=null,f.y=null};for(var t=[],p=0;s.n>p;p++){var h=a()*r,g=a()*n,q=2*a()-1,d=2*a()-1;t.push({x:h,y:g,xa:q,ya:d,max:6000})}setTimeout(function(){b()},100)}();