feat: 只支持 hexo 5.0.0 及以上版本

feat: toc改為aside顯示,去掉sidebar
feat: 手機toc ui 修改
feat: 去掉 toc auto_open 配置
feat: 文章標題改為居中
improvement: 完善note標籤在readmode上的顯示
improvement: 精簡css 和 js
improvement： pjax 優化
fix: 修復當文章頁top_img設為false時，閲讀模式下文章內容不顯示的bugs

source/css/_global/function.styl

@@ -68,26 +68,6 @@ if hexo-config('enter_transitions')
   #ribbon-canvas
     animation: ribbon_to_show 4s
 
-  .tocOpenPc
-    .sidebar-toc__title
-      animation: tocsidebarLtoR .5s
-
-    .sidebar-toc__progress
-      animation: tocsidebarLtoR .7s
-
-    .sidebar-toc__content
-      animation: tocsidebarLtoR .9s
-
-  .tocOpenMobile
-    .sidebar-toc__title
-      animation: tocsidebarRtoL .4s
-
-    .sidebar-toc__progress
-      animation: tocsidebarRtoL .6s
-
-    .sidebar-toc__content
-      animation: tocsidebarRtoL .7s
-
   #mobile-sidebar-menus
     &.open
       for i in 1 2 3 4
@@ -215,19 +195,5 @@ if hexo-config('avatar.effect') == true
   0%
     transform: translateX(200px)
 
-  100%
-    transform: translateX(0)
-
-@keyframes tocsidebarRtoL
-  0%
-    transform: translateX(200px)
-
-  100%
-    transform: translateX(0)
-
-@keyframes tocsidebarLtoR
-  0%
-    transform: translateX(-200px)
-
   100%
     transform: translateX(0)

source/css/_global/index.styl

@@ -26,6 +26,7 @@
   --blockquote-bg: $blockquote-background-color
   --reward-pop: $reward-pop-up-bg
   --sidebar-icon-color: $sidebar-icon-color
+  --toc-link-color: $toc-link-color
 
 html
   height: 100%
@@ -140,6 +141,16 @@ button
   background: none
   cursor: pointer
 
+a
+  color: $a-link-color
+  text-decoration: none
+  word-wrap: break-word
+  transition: all .2s
+  overflow-wrap: break-word
+
+  &:hover
+    color: $light-blue
+
 // font
 #site-title,
 #site-subtitle,
@@ -183,6 +194,10 @@ button
       transition-timing-function: cubic-bezier(.45, 1.64, .47, .66)
       transform: scaleX(1)
 
+img
+  max-width: 100%
+  transition: all .2s
+
 img[src=''],
 img:not([src])
   opacity: 0

source/css/_layout/aside.styl

@@ -1,10 +1,27 @@
 #aside_content
   width: 25%
 
+  +minWidth900()
+    if hexo-config('aside.position') == 'right'
+      padding-left: 15px
+    else
+      padding-right: 15px
+
+  +maxWidth900()
+    width: 100%
+
+  if hexo-config('aside.mobile') == false
+    +maxWidth768()
+      display: none
+
   > .card-widget:first-child
     margin-top: 0
 
+    +maxWidth900()
+      margin-top: 1rem
+
   .card-widget
+    position: relative
     overflow: hidden
     margin-top: 1rem
     border-radius: 8px
@@ -82,15 +99,12 @@
     padding: 1rem 1.2rem
 
   .item-headline
+    padding-bottom: .3rem
     font-size: 1.2em
 
     span
       margin-left: .5rem
 
-    & + div,
-    & + ul
-      padding: .3rem 0 0
-
   .sticky_layout
     +minWidth900()
       position: sticky
@@ -171,6 +185,7 @@
   .card-archives ul.card-archive-list,
   .card-categories ul.card-category-list
     margin: 0
+    padding: 0
     list-style: none
 
   .card-archives ul.card-archive-list > .card-archive-list-item,
@@ -248,23 +263,71 @@
             flex: 1
             padding-right: 1rem
 
-+maxWidth900()
-  #aside_content
-    width: 100% !important
+  // toc
+  #card-toc
+    +maxWidth900()
+      position: fixed
+      right: 45px
+      bottom: 30px
+      z-index: 9999
+      display: none
+      width: 300px
+      transform-origin: right bottom
+      animation: toc-close .3s
 
-  #aside_content
-    .card-widget:first-child
-      margin-top: 1rem
+      &.open
+        display: block
+        animation: toc-open .3s
 
-+minWidth900()
-  #aside_content
-    .card-widget
-      if hexo-config('aside.position') == 'right'
-        margin-left: 15px
-      else
-        margin-right: 15px
+      .toc-child
+        display: block !important
 
-if hexo-config('aside.mobile') == false
-  +maxWidth768()
-    #aside_content
-      display: none
+    .toc-content
+      overflow-y: auto
+      max-height: calc(100vh - 120px)
+
+      ol,
+      li
+        list-style: none
+
+      > ol
+        padding: 0 !important
+
+      ol
+        margin: 0
+        padding-left: .4rem
+
+      .toc-link
+        display: block
+        padding-left: .3rem
+        border-left: 3px solid transparent
+        color: var(--toc-link-color)
+        transition: all .2s ease-in-out
+
+        &.active
+          border-left-color: darken($theme-toc-color, 20%)
+          background: $theme-toc-color
+          color: $sidebar-active-color
+
+      &:before
+        position: absolute
+        top: .6rem
+        right: 1.2rem
+        color: #a9a9a9
+        content: attr(progress-percentage)
+        font-style: italic
+        font-size: 1.2rem
+
+@keyframes toc-open
+  0%
+    transform: scale(.7)
+
+  100%
+    transform: scale(1)
+
+@keyframes toc-close
+  0%
+    transform: scale(.7)
+
+  100%
+    transform: scale(1)