1. fix algolia_search bug #1

2. add read mode

source/css/_global/index.styl

@@ -220,6 +220,22 @@ table
   opacity: 0
   transition: all .2s
 
+  #readmode,#font_plus,#font_minus
+    width: 30px
+    height: 30px
+    background-color: #49b1f5
+    color: #e3e8ee
+    text-align: center
+    line-height: 29px
+    font-size: 16px
+    display: block
+    margin-bottom: 2px
+    cursor: pointer
+    text-decoration: none
+  
+  #font_minus,#font_plus
+    display: none
+
   .translate_chn_to_cht
     width: 30px
     height: 30px
@@ -340,6 +356,5 @@ table
 .tright
   text-align: right 
 
-
-
-
+.is_visible
+  display: block !important

source/css/_layout/readmode.styl

@@ -0,0 +1,113 @@
+.read-mode
+  background: $pale-yellow
+  padding: 0 !important
+
+  #sidebar,
+  #toggle-sidebar
+    display: none
+
+  #top-container
+    background-image: none !important
+    height: 14rem
+    background-color: $pale-yellow
+
+    a
+      color: #4c4948
+
+
+    &:before
+      opacity: 0
+    
+    #site-name,
+    .site-page
+      text-shadow: none
+      color: #4c4948
+    
+    #post-info
+      text-align: center
+      padding: 0
+      color: #4c4948
+    
+    #post-title,
+    #post-meta
+      text-shadow: none
+    
+    #page-header
+      &.fixed
+        background: none
+        box-shadow: none
+
+        &.open-sidebar
+          .site-page
+            display: inline-block
+            opacity: 1
+      
+      .toggle-menu 
+        .menu-icon-first,
+        .menu-icon-second,
+        .menu-icon-third
+          background-color: #4c4948
+
+  .layout_post
+    box-shadow: none
+    background: $pale-yellow
+
+    &:hover
+      box-shadow: none
+    
+    .article-container 
+      pre,
+      .highlight
+        background: darken($pale-yellow,5);
+      
+      .highlight
+        &:after
+          background: darken($pale-yellow,10);
+        table 
+          &:after
+            background: darken($pale-yellow,10);
+  
+  
+  blockquote
+    border-left: 0.2rem solid #d6dbdf
+    background-color: rgba(102,128,153,.05)
+  
+  #rightside
+    #to_comment,#nightshift
+      display: none
+    
+  canvas
+    display: none !important
+  
+  footer,
+  #post-comment,
+  hr,
+  .relatedPosts,
+  #pagination,
+  .post-reward,
+  .tag_share,
+  .post-copyright
+    display: none
+  
+  &::-webkit-scrollbar-thumb
+    background: darken($pale-yellow,15)
+
+  *::-webkit-scrollbar-thumb
+    background: darken($pale-yellow,15)
+  
+
+
+
+
+
+
+
+
+
+
+
+  
+
+
+
+    

source/css/nightshift.styl

@@ -6,6 +6,9 @@
     background: #2d3035 !important
     box-shadow: -0.25rem 0 0.25rem #2d3035 !important
 
+    &::-webkit-scrollbar-thumb
+      background: lighten(#2d3035,5)
+
   if hexo-config("local_search") && hexo-config("local_search.enable")
     #local-search
       background: #2d3035  
@@ -96,6 +99,9 @@
           &:after,.copy-notice
               background: rgb(27, 38, 59) 
       
+      &::-webkit-scrollbar-thumb
+        background: lighten(#1B2631,10)
+      
   .copy-notice
       background: rgb(27, 38, 59) 
 
@@ -119,7 +125,8 @@
 
   .translate_chn_to_cht,
   .nightshift,
-  #to_comment
+  #to_comment,
+  #readmode
       background-color: #2d3035 !important
 
   img
@@ -188,10 +195,10 @@
       filter: brightness(0.6)
     img
       filter: brightness(1)
-
-      
+     
+  &::-webkit-scrollbar-thumb
+    background: lighten(#2d3035,5)
   
-
 @media screen and (max-width: 768px)
   .night-mode
     color: #99a9bf