diff --git a/_config.yml b/_config.yml
index f3253fa..78da736 100644
--- a/_config.yml
+++ b/_config.yml
@@ -435,4 +435,10 @@ note:
 #圖片懶加載
 lazyload:
   enable: true
-  script: https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js
\ No newline at end of file
+  script: https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js
+
+# 美化post頁顯示
+post_beautify:
+  enable: false
+  title-prefix-icon: '\f0c1'
+  title-prefix-icon-color: "#F47466"
\ No newline at end of file
diff --git a/languages/default.yml b/languages/default.yml
index 63845a8..223beff 100644
--- a/languages/default.yml
+++ b/languages/default.yml
@@ -20,7 +20,6 @@ page:
 sticky: Sticky
 no_title: No title
 archives: Archives
-read_more: Read more
 
 post:
   created: Created
diff --git a/languages/en.yml b/languages/en.yml
index 03bc9f4..0940c4e 100644
--- a/languages/en.yml
+++ b/languages/en.yml
@@ -20,7 +20,6 @@ page:
 sticky: Sticky
 no_title: No title
 archives: Archives
-read_more: Read more
 
 post:
   created: Created
diff --git a/languages/zh-CN.yml b/languages/zh-CN.yml
index c623001..65019f8 100644
--- a/languages/zh-CN.yml
+++ b/languages/zh-CN.yml
@@ -20,7 +20,6 @@ page:
 sticky: 置顶
 no_title: 无题
 archives: 时间轴
-read_more: 阅读更多
 
 post:
   created: 发表于
diff --git a/languages/zh-TW.yml b/languages/zh-TW.yml
index 283e9bd..7eab355 100644
--- a/languages/zh-TW.yml
+++ b/languages/zh-TW.yml
@@ -20,7 +20,6 @@ page:
 sticky: 置頂
 no_title: 無題
 archives: 時間軸
-read_more: 閲讀更多
 
 post:
   created: 發表於
diff --git a/layout/includes/comments/valine.pug b/layout/includes/comments/valine.pug
index dfbbcc5..80d2747 100644
--- a/layout/includes/comments/valine.pug
+++ b/layout/includes/comments/valine.pug
@@ -2,8 +2,8 @@ if theme.valine && theme.valine.enable
   #vcomment.vcomment
   script(src='https://cdn.jsdelivr.net/npm/valine/dist/Valine.min.js')
   script.
-    var notify = '#{ theme.valine.notify }' == true ? true : false;
-    var verify = '#{ theme.valine.verify }' == true ? true : false;
+    var notify = #{ theme.valine.notify } == true ? true : false;
+    var verify = #{ theme.valine.verify } == true ? true : false;
     var GUEST_INFO = ['nick','mail','link'];
     var guest_info = '#{ theme.valine.guest_info }'.split(',').filter(function(item){
       return GUEST_INFO.indexOf(item) > -1
diff --git a/layout/includes/header.pug b/layout/includes/header.pug
index bc88f99..2c53deb 100644
--- a/layout/includes/header.pug
+++ b/layout/includes/header.pug
@@ -6,11 +6,34 @@
     .menu-icon-first
     .menu-icon-second
     .menu-icon-third
-    
+  
+  .menu_mask
+  
   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}'`)
-      .mobile_author-info__description= config.description
+    .mobile_post_data
+      if site.posts.length
+        .mobile_data_item.text-center
+          .mobile_data_link
+            a(href=url_for(config.archive_dir) + '/')
+              .headline= _p('aside.articles') 
+              .length_num= site.posts.length
+
+      if site.tags.length
+        .mobile_data_item.text-center       
+          .mobile_data_link
+            a(href=url_for(config.tag_dir) + '/' )
+              .headline= _p('aside.tags')
+              .length_num= site.tags.length
+
+      if site.categories.length
+        .mobile_data_item.text-center      
+          .mobile_data_link
+            a(href=url_for(config.category_dir) + '/')
+              .headline= _p('aside.categories') 
+              .length_num= site.categories.length
+
     hr
     .menus_item
       each value, label in theme.menu
diff --git a/layout/includes/post-bottom.pug b/layout/includes/post-bottom.pug
index 6d8427b..dd4047d 100644
--- a/layout/includes/post-bottom.pug
+++ b/layout/includes/post-bottom.pug
@@ -1,7 +1,7 @@
 #post_bottom
   #post_bottom_items
-    a#to_comment(href="#post-comment")
-      i.scroll_to_comment.fa.fa-comments
+    a#mobile_to_comment(href="#post-comment")
+      i.mobile_scroll_to_comment.fa.fa-comments
     i#mobile_toc.fa.fa-list
     #toc_mobile
       .toc_mobile_headline= _p('sidebar.catalog')
diff --git a/layout/includes/recent-posts.pug b/layout/includes/recent-posts.pug
index 77d66fb..75a7ef3 100644
--- a/layout/includes/recent-posts.pug
+++ b/layout/includes/recent-posts.pug
@@ -62,8 +62,6 @@ each article , index in page.posts.data
         - let expert = content.substring(0, theme.auto_excerpt.length) 
         - content.length > theme.auto_excerpt.length ? expert += ' ...' : ''
         .content!= expert
-        .more_setting
-          a.more.more--border.more--primary.more--animated(href=url_for(link) + '#more' style="margin-top: 14px")= _p('read_more')
       else
         .content!= article.description
 
diff --git a/layout/includes/rightside.pug b/layout/includes/rightside.pug
index 92bbb86..264cbf1 100644
--- a/layout/includes/rightside.pug
+++ b/layout/includes/rightside.pug
@@ -1,4 +1,7 @@
 section#rightside.rightside
+  if is_post()
+    a#to_comment(href="#post-comment")
+      i.scroll_to_comment.fa.fa-comments
   if theme.readmode.enable && is_post()
     i#readmode.fa.fa-book(title=_p('rightside.readmode_title')) 
   i#font_plus.fa.fa-plus(title=_p('rightside.font_plus_title'))
diff --git a/layout/post.pug b/layout/post.pug
index 848302a..93bdc68 100644
--- a/layout/post.pug
+++ b/layout/post.pug
@@ -45,7 +45,7 @@ block top_img
 block content
   article#post(class="")
     #post-content.article-container!= page.content
-  if (theme.post_copyright && theme.post_copyright.enable)
+  if (theme.post_copyright && theme.post_copyright.enable && page.copyright != false)
     .post-copyright
       .post-copyright__author
         span.post-copyright-meta= _p('post.copyright.author') + ": "
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..41ca9e1
--- /dev/null
+++ b/package.json
@@ -0,0 +1,6 @@
+{
+  "name": "hexo-theme-melody",
+  "version": "1.0.0",
+  "description": "A Hexo Theme: Butterfly"
+
+}
\ No newline at end of file
diff --git a/source/css/_global/index.styl b/source/css/_global/index.styl
index e68988f..096ab8a 100644
--- a/source/css/_global/index.styl
+++ b/source/css/_global/index.styl
@@ -160,6 +160,10 @@ table
     color: #fff
     border-color: #fff
 
+    &:hover
+      background-color: darken($light-blue, 40)
+
+
   textarea 
     font-size: 0.7rem
     background: url(/img/comment_bg.png) 100% 100% no-repeat
@@ -181,11 +185,8 @@ table
   .vnum 
     font-size: 1.1rem
 
-  .vnick
-    font-size: 100%
-
   .vsys
-    font-size: 70%
+    font-size: 80%
   
   .vtime
     font-size: .65rem
@@ -194,12 +195,18 @@ table
     font-size: 100%
   
   .vat
-    font-size: .7125rem;
-    color: $cyan;
-    border: 1px solid $cyan;
-    padding: 0 .8rem;
-    border-radius: 5px;
+    font-size: .7125rem
+    color: $cyan
+    border: 1px solid $cyan
+    padding: 0 .8rem
+    border-radius: 5px
+
+    &:hover
+      background-color: alpha($cyan,0.5)
   
+  code, pre
+    font-size: 98%
+    font-family: $code-font
 
 #site-title, #site-sub-title, 
 #site-name,
@@ -216,7 +223,8 @@ table
   opacity: 0
   transition: all .2s
 
-  #readmode,#font_plus,#font_minus
+
+  #readmode,#font_plus,#font_minus,#to_comment
     width: 30px
     height: 30px
     background-color: $light-blue
@@ -228,6 +236,9 @@ table
     margin-bottom: 2px
     cursor: pointer
     text-decoration: none
+
+  #to_comment
+    display: none
   
   #font_minus,#font_plus
     display: none
@@ -344,6 +355,9 @@ table
 .is_visible
   display: block !important
 
+.is_invisible
+  display: none !important
+
 .fireworks
   position: fixed
   z-index: -1
diff --git a/source/css/_layout/aside.styl b/source/css/_layout/aside.styl
index a213a73..68dbdf9 100644
--- a/source/css/_layout/aside.styl
+++ b/source/css/_layout/aside.styl
@@ -54,7 +54,7 @@
       .headline 
         display: block
         font-size: 0.7rem
-        letter-spacing: 1px
+        // letter-spacing: 1px
         margin-bottom: -21px
         text-transform: uppercase
         color:#4c4948
diff --git a/source/css/_layout/footer.styl b/source/css/_layout/footer.styl
index d6dfb6f..79dab39 100644
--- a/source/css/_layout/footer.styl
+++ b/source/css/_layout/footer.styl
@@ -2,11 +2,8 @@ footer
   margin-top: 1rem
   background: $light-blue
   background-attachment: local
-
-  &.footer-bg
-    background-position: bottom
-    background-size: cover
-
+  background-position: bottom
+  background-size: cover
 
 #footer
   padding: 1.2rem 1rem 1rem
diff --git a/source/css/_layout/head.styl b/source/css/_layout/head.styl
index 1ef97fe..ca46d65 100644
--- a/source/css/_layout/head.styl
+++ b/source/css/_layout/head.styl
@@ -103,11 +103,23 @@
         -webkit-transform: rotate(-45deg) translate(4px, -4px)
         transform: rotate(-45deg) translate(4px, -4px)
   
+  .menu_mask
+    position: fixed
+    top: 0
+    bottom: 0
+    width: 100%
+    height: 110vh
+    left: 0
+    right: 0
+    background: alpha($black,0.7)
+    display: none
+  
   .menus  
     .mobile_author_icon
       display: none
-      padding: 3rem 1.5rem 0
+      padding: 1.3rem 1.5rem 0
       text-align: center
+
   
       img
         height: 120px
@@ -115,24 +127,35 @@
         display: inline-block
         vertical-align: top
         border-radius: 70px
-        -webkit-transition: all .3s
-        -moz-transition: all .3s
-        -o-transition: all .3s
-        -ms-transition: all .3s
         transition: all .3s
 
+    .mobile_post_data
+      display: flex
+      justify-content: center
+      padding: .6rem .5rem 0
+      display: none
+
+      .mobile_data_item
+        flex: 1
+
+      .mobile_data_link 
+        a
+          text-decoration: none
+
+        .length_num 
+          font-size: .9rem
+          color: #000
+
+        .headline 
+          display: block
+          font-size: 0.7rem
+          // letter-spacing: .5px
+          text-transform: uppercase
+          color:#4c4948
+      
     hr         
       margin: 1rem auto
       display: none
-    
-    &.menu_open
-      display: block
-      animation: menu_open .3s
-
-    &.menu_close
-      animation: menu_close .3s
-      display: block
-
 
   a
     color: $light-grey
@@ -210,7 +233,6 @@
     font-size: 1.2rem
 
 @media screen and (max-width: $sm)
-
   #page-header
     padding: 10px 0.8rem
 
@@ -220,41 +242,49 @@
     .menus
       position: fixed
       top: 0
-      right: 0
-      width: 100%
+      right: -250px
+      width: 250px
       height 101vh
       background: $white
       cursor: pointer
       box-shadow: 0 0 4px rgba(0, 0, 0, 0.27)
-      z-index: -1
-      overflow: auto
+      z-index: 1
+      overflow-y: scroll
       display: none
+          
+      .mobile_post_data
+        display: flex
 
-      a
-        display: inline-block !important
-        opacity: 1 !important
-        // margin-left: 0
-        // padding-top: 0.3rem
-        // padding-bottom: 0.3rem
-        // padding-left: 0.6rem
-        margin: 0
-        padding: .5rem 1rem
-        color: $font-black
-        text-shadow: none
-        font-size: 0.8rem
-        z-index: 0
+      .menus_item
+        a
+          display: block !important
+          opacity: 1 !important
+          margin: 0
+          padding: .3rem 1.5rem
+          color: $font-black
+          text-shadow: none
+          font-size: 0.8rem
+          z-index: 0
+          text-overflow: ellipsis
+          overflow: hidden
+          white-space: nowrap  
+          
+        i
+          width: 30%
+          text-align: left 
 
+        span
+          width 70%
 
-        &:hover
-          color: $light-blue
-      
+          &:hover
+            color: $light-blue
+        
       .mobile_author_icon
         display: block
      
       .menus_item 
           padding: 0 .5rem
-          margin-bottom: 4rem
-          text-align: center 
+          margin-bottom: 5rem                              
               
       hr
         display: block 
@@ -267,5 +297,5 @@
     
     &.fixed.open-sidebar 
       .search
-        display: inline-block;
-        opacity: 1;
+        display: inline-block
+        opacity: 1
\ No newline at end of file
diff --git a/source/css/_layout/nightshift.styl b/source/css/_layout/nightshift.styl
index 9ccdb5e..4aa7de2 100644
--- a/source/css/_layout/nightshift.styl
+++ b/source/css/_layout/nightshift.styl
@@ -39,7 +39,7 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
 
     // 評論
     #vcomment
-      * 
+      p,a,textarea,.vemoji-btn,.vpreview-btn,input,path,.vcount,.vnum,.vtime,.vsys,.vsys,.vnick
         color: #99a9bf !important
       
       .vsys
@@ -48,6 +48,26 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
       .vbtn
         background: rgb(45, 48, 53) !important      
         color: #99a9bf !important
+        border: 1px solid #99a9bf
+      
+      .vwrap
+        border: 1px solid #99a9bf
+      
+      input
+        border-bottom: 1px dashed #616a6b
+      
+      .vh
+        border-bottom: 1px dashed  #616a6b
+      
+      pre
+        background-color: #2d3035
+        border: 1px solid #99a9bf
+      
+      .vcontent.expand:before
+        background: linear-gradient(180deg,hsla(0, 0%, 0%, 0),hsl(218, 8%, 19%))
+
+      .vcontent.expand:after
+        background: hsla(204, 5%, 22%, 1)
           
     .recent-post-item .article-title
         color: #99a9bf
@@ -126,7 +146,8 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
 
     .translate_chn_to_cht,
     .nightshift,
-    #readmode
+    #readmode,
+    #to_comment
         background-color: #2d3035 !important
 
     img
@@ -199,8 +220,6 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
     &::-webkit-scrollbar-thumb
       background: lighten(#2d3035,5)
 
-    .more
-      background-color: #616a6b
 
     #post_bottom
       background: #2d3035
@@ -223,6 +242,12 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
       #page-header
         .menus
           background: #2d3035
+
+          .headline
+            color: #99a9bf !important
+          
+          .length_num
+            color: darken(#99a9bf,10) !important
         a
           color: #99a9bf !important        
         .menu-icon-first,
diff --git a/source/css/_layout/page.styl b/source/css/_layout/page.styl
index b23536c..26d8e7b 100644
--- a/source/css/_layout/page.styl
+++ b/source/css/_layout/page.styl
@@ -104,24 +104,6 @@ galleryItemStyle(w, h)
 
   time
     color: $grey
-  
-  .more_setting
-    display: none
-
-  .more
-    display: inline-block
-    padding: 0 1rem
-    height: h = 1.6rem
-    // background: $light-blue
-    // color: $white
-    text-align: center
-    text-decoration: none
-    line-height: h
-    cursor: pointer
-    // transition: all 0.2s ease-in-out
-
-    // &:hover
-    //   background: $ruby
 
   .article-title
     margin-bottom: 0.3rem
diff --git a/source/css/_layout/post.styl b/source/css/_layout/post.styl
index 1835e81..6a6f87c 100644
--- a/source/css/_layout/post.styl
+++ b/source/css/_layout/post.styl
@@ -1,3 +1,18 @@
+if hexo-config("post_beautify.enable")
+  headStyle(fontsize)
+    padding-left: unit(fontsize + 0.3, "rem")
+  
+    code 
+      font-size: unit(fontsize, "rem")
+
+    &:before
+      top: calc(50% - unit(fontsize / 2 - 0.05, "rem"))
+      font-size: unit(fontsize, "rem")
+
+    &:hover
+      padding-left: unit(fontsize + 0.2, "rem")
+
+
 #post-title
   font-size: 1.4rem
 
@@ -100,22 +115,130 @@
 #post-content
   margin-bottom: 1rem
 
-  ol,
-  ul
-    margin-top: 0.4rem
-    counter-reset: li
+  if hexo-config("post_beautify.enable")
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6
+      cursor: pointer
+      transition: all 0.2s ease-out
 
-    p
-      margin: 0
+      &:before
+        position: absolute
+        top: calc(50% - 0.35rem)
+        left: 0
+        color: $title-prefix-icon-color
+        content: $title-prefix-icon
+        font: normal normal normal 14px / 1 FontAwesome
+        font-size: 0.8rem
+        transition: all 0.2s ease-out
+
+      &:hover
+        padding-left: 1.1rem
+
+        &:before
+          color: $light-blue
+
+    h1
+      headStyle(1)
+
+    h2
+      headStyle(0.9)
+
+    h3
+      headStyle(0.8)
+
+    h4
+      headStyle(0.7)
+
+    h5
+      headStyle(0.6)
+
+    h6
+      headStyle(0.6)
 
     ol,
     ul
-      padding-left: 0.5rem
+      margin-top: 0.4rem
+      padding: 0 0 0 0.8rem
+      list-style: none
+      counter-reset: li
 
-    li
-      position: relative
-      margin: 0.3rem 0
-      padding-left: 0.3rem
+      p
+        margin: 0
+
+      ol,
+      ul
+        padding-left: 0.5rem
+
+      li
+        position: relative
+        margin: 0.2rem 0
+        padding: 0.1rem 0.5rem 0.1rem 1.5rem
+
+        &:hover
+          &:before
+            transform: rotate(360deg)
+
+        &:before
+          position: absolute
+          top: 0
+          left: 0
+          background: $light-blue
+          color: $white
+          cursor: pointer
+          transition: all 0.3s ease-out
+
+    ol
+      > li
+        &:before
+          margin-top: 0.2rem
+          width: w = 1.2rem
+          height: h = w
+          border-radius: 0.5 * w
+          content: counter(li)
+          counter-increment: li
+          text-align: center
+          font-size: 0.6rem
+          line-height: h
+
+    ul
+      > li
+        &:hover
+          &:before
+            border-color: $ruby
+
+        &:before
+          $w = 0.3rem
+          top: 10px
+          margin-left: 0.45rem
+          width: w = $w
+          height: h = w
+          border: 0.5 * w solid $light-blue
+          border-radius: w
+          background: $white
+          content: ""
+          line-height: h
+
+  else
+    ol,
+    ul
+      margin-top: 0.4rem
+      counter-reset: li
+
+      p
+        margin: 0
+
+      ol,
+      ul
+        padding-left: 0.5rem
+
+      li
+        position: relative
+        margin: 0.3rem 0
+        padding-left: 0.3rem
 
 a
   color: $a-link-color
diff --git a/source/css/_layout/post_bottom.styl b/source/css/_layout/post_bottom.styl
index b0ae7d4..fea6de0 100644
--- a/source/css/_layout/post_bottom.styl
+++ b/source/css/_layout/post_bottom.styl
@@ -12,7 +12,7 @@
   &.toc_mobile_show
     bottom: 0
 
-  #to_comment,#mobile_toc
+  #mobile_to_comment,#mobile_toc
     width: 50%
     text-align: center
     font-size: 18px
diff --git a/source/css/_layout/z-other.styl b/source/css/_layout/z-other.styl
index 93b211a..febc6b5 100644
--- a/source/css/_layout/z-other.styl
+++ b/source/css/_layout/z-other.styl
@@ -71,53 +71,6 @@ a.article-meta__categories
   overflow: hidden
   height: 90px
 
-.more {
-  position: relative
-  letter-spacing: 1.2px
-  text-transform: uppercase
-  overflow: hidden
-  z-index: 1
-  background-color: $light-blue
-
-  &:focus {
-    outline: none
-  }
-}
-
-.more--primary {
-  color: $white
-}
-
-.more--animated {
-  transition-property: color
-  transition-duration: 0.5s
-
-  &:before {
-    content: ""
-    position: absolute
-    top: 0
-    left: 0
-    right: 0
-    bottom: 0
-    background: $ruby
-    transform: scaleX(0)
-    transform-origin: 0 50%
-    transition-property: transform
-    transition-duration: 0.5s
-    transition-timing-function: ease-out
-    z-index: -1
-  }
-
-  &:hover {
-    color: white
-
-    &:before {
-      transform: scaleX(1)
-      transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66)
-    }
-  }
-}
-
 .layout_page
   display: flex 
   margin: 0 auto
@@ -221,9 +174,6 @@ a.article-meta__categories
   #recent-posts #pagination
     margin-bottom: 0
 
-  .more_setting
-    display: block !important
-
   #nav #site-social-icons
     display: block
 
@@ -337,25 +287,3 @@ footer
   50%{transform:scale(1)}
   80%{transform:scale(.98)}
   100%{transform:scale(1)}}
-
-
-
-@keyframes menu_open{
-  0% {
-    transform: scale(0)
-  }
-  100% {
-    transform: scale(1)
-  }  
-  }
-
-@keyframes menu_close{
-0% {
-  transform: scale(1)
-  display: block
-}
-100% {
-  transform: scale(0)
-  display: none
-}
-}
diff --git a/source/css/var.styl b/source/css/var.styl
index ebfbea1..acba1df 100644
--- a/source/css/var.styl
+++ b/source/css/var.styl
@@ -13,6 +13,8 @@ $site-name-font = "Titillium Web", Lato,PingFang SC, Hiragino Sans GB, "Microsof
 //hr icon
 $hr-icon = '\f0c4'
 $hr-icon-top = -10px
+$title-prefix-icon = '\f0c1'
+$title-prefix-icon-color = #F47466
 
 if hexo-config("theme_color") && hexo-config("theme_color.enable")
   $theme-color = convert(hexo-config("theme_color.main")) || #49B1F5
@@ -36,6 +38,10 @@ if hexo-config("hr") && hexo-config("hr.enable")
   $hr-icon = hexo-config("hr.icon") || '\f0c4'
   $hr-icon-top = convert(hexo-config("hr.icon-top")) || -10px
 
+if hexo-config("post_beautify.enable")
+  $title-prefix-icon = hexo-config("post_beautify.title-prefix-icon") || '\f0c1'
+  $title-prefix-icon-color= convert(hexo-config("post_beautify.title-prefix-icon-color")) || #F47466
+
 
 // Global Variables
 $font-size = 14px
diff --git a/source/js/main.js b/source/js/main.js
index 89883ec..78697ef 100644
--- a/source/js/main.js
+++ b/source/js/main.js
@@ -82,7 +82,8 @@ $(function () {
   // 首页fullpage添加
   // 添加class 
   if (/Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent)) { } else {
-    $('.full_page').css('background-attachment', 'fixed')
+    $('.full_page').css('background-attachment', 'fixed');
+    $('#to_comment').css("display", "block")
   }
 
   //---------------------------------------------------------------------------------------------------------
@@ -267,80 +268,41 @@ $(function () {
   //---------------------------------------------------------------------------------------------------------
   /** head点击*/
   $('.toggle-menu').on('click', function () {
-
     if ($(".toggle-menu").hasClass("open")) {
       $(".toggle-menu").removeClass("open").addClass("close");
-      $("#page-header #site-name,#page-header .search").css({ 'color': '#3b3a3a', 'text-shadow': 'none' })
-      $(".toggle-menu *").css({ 'background-color': '#3b3a3a', 'text-shadow': 'none' });
       $('body').addClass("is_hidden");
-      $('.menus').addClass("menu_open");
-      fixbg_menu();
-    } else {
-      $(".toggle-menu").removeClass("close").addClass("open");
-      $("#page-header #site-name,#page-header .search").css({ 'color': '', 'text-shadow': '' });
-      $(".toggle-menu *").css({ 'background-color': '', 'text-shadow': '' });
-      $('body').removeClass("is_hidden");
-      $('.menus').removeClass("menu_open").addClass('menu_close');
-      setTimeout(function () {
-        $('.menus').removeClass("menu_close")
-        
-      }, 300)
+      $('.menus').animate({
+        right: 0
+      }, 300 )
+      $('.menu_mask,.menus').css("display","block")
     }
   })
 
-  function fixbg_menu() {
-    const fixScroll = (scrollEl) => {
-      let startY
-      scrollEl.addEventListener('touchstart', function (event) {
-        // 如果多於1根手指點擊屏幕,則不處理
-        if (event.targetTouches.length > 1) {
-          return
-        }
-        // 儲存手指的初始位置
-        startY = event.targetTouches[0].clientY
-      }, false)
-      scrollEl.addEventListener('touchmove', function (event) {
-        if (event.targetTouches.length > 1) {
-          return
-        }
-        // 判斷手指滑動方向, y大於0時向下滑動, 小於0時向上滑動
-        const y = event.targetTouches[0].clientY - startY
-        // 如果到頂時繼續向下拉
-        if (scrollEl.scrollTop <= 0 && y > 0) {
-          // 重置滾動距離為最小值
-          scrollEl.scrollTop = 0
-          // 阻止滾動
-          event.preventDefault()
-        }
-        // 如果到底時繼續上滑  
-        const maxScrollTop = scrollEl.scrollHeight - scrollEl.clientHeight
-        if (maxScrollTop - scrollEl.scrollTop <= 0 && y < 0) {
-          scrollEl.scrollTop = maxScrollTop
-          event.preventDefault()
-        }
-      }, {
-          passive: false
-        })
+  $('.menu_mask ').on('click touchstart', function () {
+    $(".toggle-menu").removeClass("close").addClass("open");
+    $('body').removeClass("is_hidden");
+    $('.menus').animate({
+      right: -250
+    }, 300,function () {
+      {$('.menus').css({ 'display': ''})
     }
-    const scrollEl = document.querySelector(".menus");
-    fixScroll(scrollEl)
-  }
-
-  
+  })
+    $('.menu_mask').css("display","")
+  })
 
   $(window).on('resize', function (e) {
     if (!$('.toggle-menu').is(':visible')) {
       if ($(".toggle-menu").hasClass("close")) {
         $(".toggle-menu").removeClass("close").addClass("open");
-        $("#page-header #site-name,#page-header .search").css({ 'color': '', 'text-shadow': '' });
-        $(".toggle-menu *").css({ 'background-color': '', 'text-shadow': '' });
         $('body').removeClass("is_hidden");
-        $('.menus').removeClass("menu_open");
-      }
+        $('.menus').animate({
+          right: -250
+        }, 300)
+        $('.menu_mask').css("display","")
+          }
     }
   } )   
 
- 
 
   //---------------------------------------------------------------------------------------------------------
   /** scroll 滚动 toc*/
@@ -554,14 +516,17 @@ $(function () {
   //閲讀模式
   $("#readmode").click(function () {
 
+
     if (Cookies.get("night-mode") == "night") {
       $('body').toggleClass('night-mode');
       $('body').toggleClass('read-mode');
-      $('#font_plus,#font_minus').toggleClass('is_visible');
+      $('#font_plus,#font_minus,#to_comment').toggleClass('is_visible');
+      $('#to_comment').toggleClass('is_invisible');
 
     } else {
       $('body').toggleClass('read-mode');
-      $('#font_plus,#font_minus').toggleClass('is_visible');
+      $('#font_plus,#font_minus,#to_comment').toggleClass('is_visible');
+      $('#to_comment').toggleClass('is_invisible');
     }
 
   });
@@ -570,12 +535,20 @@ $(function () {
   //閲讀模式下字體調整
   $("#font_plus").click(function () {
     var font_size_record = parseFloat($('body').css('font-size'))
+    var code_size_record = parseFloat($('pre').css('font-size'))
+    var code_size_record = parseFloat($('code').css('font-size'))
     $('body').css('font-size', font_size_record + 1)
+    $('pre').css('font-size', font_size_record + 1)
+    $('code').css('font-size', font_size_record + 1)
   });
 
   $("#font_minus").click(function () {
     var font_size_record = parseFloat($('body').css('font-size'))
+    var code_size_record = parseFloat($('pre').css('font-size'))
+    var code_size_record = parseFloat($('code').css('font-size'))
     $('body').css('font-size', font_size_record - 1)
+    $('pre').css('font-size', font_size_record - 1)
+    $('code').css('font-size', font_size_record - 1)
   });