V2.0.0

Breaking change
1. 手機端界面卡片化，同時，手機端也可以顯示側邊欄的內容
2. 修復當menu過多時，header界面出現錯亂的bug。當menu過多時，會變為sidebar模式
3. 增加medium-zoom大圖查看模式
4. 增加鼠標點擊特效：文字和愛心 兩個點擊特效
5. 主頁subtitle可以調用第三方api(金山詞霸每日一句、一言網的一句話、一句網、今日詩詞)
6. 添加 snackbar 彈窗
7. 修改nightshift為darkmode，darkmode可隨系統設置而自動切換，可設置隨時間而切換darkmode
8. 修復hexo自帶的標籤外掛(Tag Plugins)顯示bug(Block Quote、Code Block With caption、Gist、Youtube、Vimeo)
9. 主題所需要的css和js可根據需要配置CDN
10. 更改darkmode的加載方式，網站設置dark mode後，現在進入網頁不會在'閃'一下
11. 背景特效和背景圖片在手機界面也會顯示
12. 增加justified-gallery圖片顯示(Tag Plugins)
Feature
1. 文章頁面，字數統計、閲讀時長和閲讀量前面添加icon
2. 更改懶加載js
3. 升級typed.js/instantpage.js到最新版
4. 搜索和右下角按鈕添加退出特效
Fixed
1. 修復在 Hexo 4.0.0下，一些按鈕點擊會跳出一個空白頁的bug
2. 修復在 Hexo 4.0.0下，分頁按鈕出現代碼的bug
3. 修復當沒有設置評論時，右下角依舊出現'直達評論'按鈕的bug
4. 優化sidebar的打開速度
5. 修復文章頁標題左右邊距不平等的bug
6. 修復keywords讀取的bug
7. 修復當post/page 內容為空時，footer位置錯亂的bug
8. 修復在手機safari，toc sidebar底部內容被遮擋的bug
9. 完善Dark mode,一些界面的配色
10. 修復 card-archives 查看更多 跳轉bug
Remove
1. 移除Gitment
2. 移除Gallery

source/css/_layout/post.styl

@@ -72,13 +72,17 @@ if hexo-config("post_beautify.enable")
     width: 100%
     color: $light-grey
     text-align: left
-    padding-left: 8%
+    padding: 0 8%
     position: absolute
     bottom: 1.5rem
 
   #post-title
     text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.15)
     font-size: 1.5rem
+    margin-bottom: 0.4rem
+
+    .posttitle
+      line-height: 1.5
 
   i.fa.fa-angle-right
     margin: 0 0.3rem 0 0.2rem
@@ -108,12 +112,8 @@ if hexo-config("post_beautify.enable")
       background: $light-blue
       color: $white
 
-.layout
-  margin: 0 auto
-  max-width: 1000px
 
 #post-content
-  margin-bottom: 1rem
 
   if hexo-config("post_beautify.enable")
     h1,
@@ -321,7 +321,7 @@ img
 
 .post-copyright
   position: relative
-  margin-bottom: 0.4rem
+  margin: 1rem 0 0.5rem 0
   padding: 0.5rem 0.8rem
   border: 1px solid $light-grey
   transition: box-shadow 0.3s ease-in-out
@@ -359,13 +359,7 @@ img
 
 
 @media screen and (max-width: $sm)
-  .layout
-    margin: 0 30px
-    width: auto
-
   #top-container
-    // background-attachment: local
-
     #post-title
       font-size: 1rem
 
@@ -374,7 +368,7 @@ img
 
 
 @media screen and (min-width: $md)
-  .layout
+  .layout_post
     width: $content-large-width
         
 .katex-wrap
@@ -394,10 +388,6 @@ img
   font-size: 1em
 
 
-@media screen and (max-width: 1024px)
-  .layout 
-    margin: 0 15px
-    width: auto
 
 .layout_post 
   padding: 50px
@@ -405,8 +395,8 @@ img
   border-radius: 8px
   transition: all 0.3s
   background: #fff
-  margin-top: 40px
-  margin-bottom: 40px
+  margin: 40px auto
+  max-width: 1000px
 
   &:hover 
     box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
@@ -444,15 +434,13 @@ img
       text-decoration: none
       color: $light-blue
     
-    h1
-      margin: 0.8rem 0
-    
+    h1,
     h2,
     h3,
     h4,
     h5,
     h6
-      margin: 1rem 0 0.5rem 0
+      margin: 1rem 0 0.8rem 0
     
     img
       margin: 0 auto 0.8rem 
@@ -460,17 +448,20 @@ img
     blockquote,
     p
       margin: 0 0 0.8rem 0
-      
 
-    table,.note
-      margin: 0.8rem 0
-    
-    figure
-      margin: 0.8rem 0
+    iframe,.note
+      margin: 0 0 0.8rem 0
 
-      table
-        margin: 0
-    
-    blockquote
-      p
-        margin: 0.5rem 0
+.layout_post,
+.layout_page
+  opacity: 1
+
+@media screen and (max-width: 1024px)
+  .layout_post
+    margin: 0 15px
+    width: auto
+
+@media screen and (max-width:768px)
+  .layout_post
+    padding: 1.8rem 1rem
+    margin: 30px 5px