diff --git a/layout/_partial/side.ejs b/layout/_partial/side.ejs
index 64a39f7..21c00c4 100755
--- a/layout/_partial/side.ejs
+++ b/layout/_partial/side.ejs
@@ -8,13 +8,13 @@
     <% if (config.widgets.tagcloud){ %>
         <%- partial('../_widget/tagcloud') %>
     <% } %>
+    <% if (config.widgets.toc){ %>
+        <%- partial('../_widget/toc') %>
+    <% } %>
     <% if (config.widgets.musicid){ %>
         <%- partial('../_widget/music') %>
     <% } %>
     <% if (config.widgets.links){ %>
         <%- partial('../_widget/links') %>
     <% } %>
-    <% if (config.widgets.toc){ %>
-        <%- partial('../_widget/toc') %>
-    <% } %>
 <% } %>
diff --git a/layout/_widget/author.ejs b/layout/_widget/author.ejs
index 38015f1..6c7b43a 100755
--- a/layout/_widget/author.ejs
+++ b/layout/_widget/author.ejs
@@ -2,7 +2,7 @@
     <section class='m_widget author'>
         <% if(config.widgets.author.avatar || config.avatar) { %>
             <div class='header'>
-                <img class='avatar' src='<%= url_for(config.widgets.author.avatar || config.avatar) %>' />
+                <img class='avatar' src='<%= url_for(config.widgets.author.avatar || config.avatar) %>'/>
             </div>
         <%} %>
         <% if (config.widgets.author.title || config.widgets.author.motto){ %>
@@ -11,10 +11,7 @@
                     <h2><%= config.widgets.author.title %></h2>
                 <% } %>
                 <% if (config.widgets.author.motto){ %>
-                    <div>
-                        <i class="fas fa-quote-left fa-3x fa-pull-left" aria-hidden="true"></i>
-                        <%= config.widgets.author.motto %>
-                    </div>
+                    <p><%= config.widgets.author.motto %></p>
                 <% } %>
             </div>
         <% } %>
diff --git a/layout/_widget/categories.ejs b/layout/_widget/categories.ejs
index aa8355d..1b11fe0 100755
--- a/layout/_widget/categories.ejs
+++ b/layout/_widget/categories.ejs
@@ -1,5 +1,7 @@
 <section class='m_widget categories'>
-    <div class='header'><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;分类</div>
+    <header class='header'>
+        <div><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;分类</div>
+    </header>
     <div class='content'>
         <% if (site.categories.length){ %>
             <ul class="entry">
diff --git a/layout/_widget/links.ejs b/layout/_widget/links.ejs
index 4ea4a3c..bc94ba6 100755
--- a/layout/_widget/links.ejs
+++ b/layout/_widget/links.ejs
@@ -1,9 +1,10 @@
 <section class='m_widget links'>
-    <div class='header'><div><i class="fas fa-handshake fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;友链</div>
-    <% if(config.email) { %>
-        <a class="addlink" title="联系博主添加友链" target="_blank" rel="external nofollow noopener noreferrer" href="mailto:<%= config.email %>?subject=交换友链&body=你好，我想和你交换友链，我已经将【<%= config.title %>】添加到我的博客的友链中。我的博客链接是："><i class="fas fa-plus fa-fw"></i></a>
-    <%} %>
-    </div>
+    <header class='header'>
+        <div><i class="fas fa-handshake fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;友链</div>
+        <% if(config.email) { %>
+            <a class="rightBtn" title="联系博主添加友链" target="_blank" rel="external nofollow noopener noreferrer" href="mailto:<%= config.email %>?subject=交换友链&body=你好，我想和你交换友链，我已经将【<%= config.title %>】添加到我的博客的友链中。我的博客链接是："><i class="fas fa-plus fa-fw"></i></a>
+        <%} %>
+    </header>
     <div class='content'>
         <ul class="entry" id="links">
             <% (config.widgets.links||[]).forEach(function(item){ %>
diff --git a/layout/_widget/music.ejs b/layout/_widget/music.ejs
index dcb9dbd..730dd34 100755
--- a/layout/_widget/music.ejs
+++ b/layout/_widget/music.ejs
@@ -1,5 +1,8 @@
 <section class='m_widget music'>
-    <div class='header'><i class="fas fa-headphones-alt fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;音乐</div>
+    <header class='header'>
+        <div><i class="fas fa-headphones-alt fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;音乐</div>
+        <a class="rightBtn" title="打开博主的网易云音乐主页" target="_blank" rel="external nofollow noopener noreferrer" href="https://music.163.com/#/playlist?id=<%= config.widgets.musicid %>"><i class="fas fa-external-link-square-alt fa-fw"></i></a>
+    </header>
     <div class='content'>
         <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=100% height=450 src="//music.163.com/outchain/player?type=0&id=<%= config.widgets.musicid %>&auto=0&height=450"></iframe>
     </div>
diff --git a/layout/_widget/tagcloud.ejs b/layout/_widget/tagcloud.ejs
index 4cfbb17..b941c33 100755
--- a/layout/_widget/tagcloud.ejs
+++ b/layout/_widget/tagcloud.ejs
@@ -1,6 +1,8 @@
 <% if (site.tags.length){ %>
     <section class='m_widget tagcloud'>
-        <div class="header"><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;标签</div>
+        <header class="header">
+            <div><i class="fas fa-tags fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;标签</div>
+        </header>
         <div class='content'>
             <%- tagcloud(site.tags, {
                 min_font: 14,
diff --git a/layout/_widget/toc.ejs b/layout/_widget/toc.ejs
index 2a9fcc1..f8d4b2e 100755
--- a/layout/_widget/toc.ejs
+++ b/layout/_widget/toc.ejs
@@ -1,6 +1,9 @@
 <% if(page.content && page.toc!==false && toc(page.content).length > 0){ %>
     <section class='m_widget toc-wrapper'>
-        <div class="header"><i class="fas fa-list fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;目录</div>
+        <header class="header">
+            <div><i class="fas fa-list fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;目录</div>
+            <div class='wrapper'><a class="s-toc rightBtn" title="固定到顶部" target="_blank" rel="external nofollow noopener noreferrer" href="javascript:void(0)"><i class="fas fa-thumbtack fa-fw"></i></a></div>
+        </header>
         <div class='content'>
             <%- toc(page.content, {list_number: false}) %>
         </div>
diff --git a/source/less/_main.less b/source/less/_main.less
index 21e0b94..5cf4015 100755
--- a/source/less/_main.less
+++ b/source/less/_main.less
@@ -276,8 +276,8 @@
                     }
                 }
                 .categories {
-                    // font-weight: bold;
-                    color: fade(@theme_text_main, 50%);
+                    font-weight: normal;
+                    color: fade(@theme_text_main, 70%);
                     // color: @theme_text_link;
                 }
                 .tag{
diff --git a/source/less/_toc.less b/source/less/_toc.less
index 394beef..d8090c9 100755
--- a/source/less/_toc.less
+++ b/source/less/_toc.less
@@ -1,25 +1,50 @@
 .m_widget.toc-wrapper{
+    z-index: 1;
     overflow: auto;
     border-radius: @border_radius;
     position: sticky;
     top: @height_navbar + 1*@gap;
+    // bottom: @gap;
+    // max-height: ~"calc(100% - 2 * @{gap} - @{height_navbar})";
+    // max-height: 600px;
     .enable-trans();
+    .header{
+        position: sticky;
+        width: 100%;
+        top: 0;
+    }
     .content{
         padding: @gap/2 0;
+        padding-top: 0; // 适合白色导航栏背景
+        a {
+            border-left: 4px solid transparent;
+            &:hover{
+                color: fade(@theme_text_main, 100%);
+                border-left: 4px solid @theme_bg_quote;
+            }
+            &:active{
+                border-left: 8px solid @theme_bg_quote;
+            }
+            &.active{
+                color: fade(@theme_text_main, 100%);
+                border-left: 4px solid @theme_bg_quote;
+                background: fade(@theme_bg_quote, 10%);
+            }
+        }
     }
     &.active{
         position: fixed;
         box-shadow: @boxshadow_card_raised;
+        .header{
+            .s-toc{
+              display: none;
+            }
+        }
     }
 
-    .header{
-        position: sticky;
-        width: 100%;
-        top: 0;
-    }
     @media(max-width: @on_phone){
         position: fixed;
-        width: 100% - 0.5 * @gap;
+        width: ~"calc(100% - 2 * @{gap})";
         top: @height_navbar + @gap;
         left: @gap;
         box-shadow: @boxshadow_card_raised;
@@ -35,20 +60,6 @@
         color: fade(@theme_text_main, 60%);
         font-size: @fontsize_small;
         display: inline-block;
-        border-left: 4px solid transparent;
-        &:hover{
-            color: fade(@theme_text_main, 100%);
-            border-left: 4px solid @theme_bg_quote;
-        }
-        &:active{
-            border-left: 8px solid @theme_bg_quote;
-        }
-        &.active{
-            color: fade(@theme_text_main, 100%);
-            border-left: 4px solid @theme_bg_quote;
-            background: fade(@theme_bg_quote, 10%);
-        }
-
     }
     ol{
         .toc-item.toc-level-1 {
diff --git a/source/less/_widget.less b/source/less/_widget.less
index 04ae810..01bf816 100755
--- a/source/less/_widget.less
+++ b/source/less/_widget.less
@@ -1,4 +1,5 @@
 .m_widget{
+    z-index: 0;
     &:extend(.z-depth-main);
     background: @theme_bg_card;
     margin-top: @gap;
@@ -27,6 +28,8 @@
     width: @width_sidebar;
     max-height: ~"calc(100% - @{height_navbar} - 4 * @{gap})";
     .header{
+        display: flex;
+        justify-content: space-between;
         border-top-left-radius: @border_radius;
         border-top-right-radius: @border_radius;
         @media(max-width: @on_phone) {
@@ -36,44 +39,51 @@
         color: @theme_text_in_header;
         font-weight: bold;
         line-height: 1.5em;
-        // padding: 8px @gap; // 适合深色导航栏背景
-        padding: 14px @gap 2px @gap; // 适合白色导航栏背景
-      	// letter-spacing: .08em;
-
+        padding: 8px @gap;
+        padding-top: 14px; // 适合白色导航栏背景
+        padding-bottom: 14px; // 适合白色导航栏背景
+        .rightBtn{
+          color: @theme_text_in_header;
+          &:hover {
+              color: darken(@theme_text_highlight, 25%);
+          }
+        }
     }
     .content{
         text-align: justify;
         padding: @gap/2;
-        max-height: ~"calc(100% - @{height_navbar} - 2.5 * @{gap})";
+        // padding-top: 0; // 适合白色导航栏背景
+        max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})";
+        ul.entry > li > a{
+           padding: 0 @gap;
+           line-height:@height_cell;
+           height: @height_cell;
+           display: flex;
+           justify-content: space-between;
+           align-content: center;
+           border-left: 2px solid transparent;
+           .enable-trans();
+           .name{
+               flex:auto;
+               &:extend(.txt-ellipsis);
+               color: fade(@theme_text_main,70%);
+           }
+           .badge{
+               flex:none;
+               font-size: @fontsize_small;
+               color: fade(@theme_text_main, 50%);
+           }
+           &:hover{
+               border-left: 4px solid @theme_bg_quote;
+               background: fade(@theme_bg_quote, 10%);
+           }
+           &:active{
+               border-left: 8px solid @theme_bg_quote;
+           }
+       }
     }
 
-     ul.entry > li > a{
-        padding: 0 @gap;
-        line-height:@height_cell;
-        height: @height_cell;
-        display: flex;
-        justify-content: space-between;
-        align-content: center;
-        border-left: 2px solid transparent;
-        .enable-trans();
-        .name{
-            flex:auto;
-            &:extend(.txt-ellipsis);
-            color: fade(@theme_text_main,70%);
-        }
-        .badge{
-            flex:none;
-            font-size: @fontsize_small;
-            color: fade(@theme_text_main, 50%);
-        }
-        &:hover{
-            border-left: 4px solid @theme_bg_quote;
-            background: fade(@theme_bg_quote, 10%);
-        }
-        &:active{
-            border-left: 8px solid @theme_bg_quote;
-        }
-    }
+
 }
 .m_widget.author{
     .enable-trans();
@@ -104,8 +114,14 @@
         border-top-right-radius: @border_radius;
     }
     .content{
+      p{
+        font-size: @fontsize_base;
+        text-align: center;
+      }
+        text-align: center;
         font-weight: bold;
         padding-bottom: 0;
+        padding: @gap/2 @gap 0 @gap;
         @media(max-width: @on_phone){
             padding: @gap/2 @gap;
         }
@@ -141,6 +157,7 @@
 .m_widget.categories{
     .content{
         padding: @gap/2 0;
+        padding-top: 0; // 适合白色导航栏背景
     }
 }
 
@@ -148,6 +165,7 @@
     .content{
         text-align: justify;
         padding: @gap/2 @gap;
+        padding-top: 0; // 适合白色导航栏背景
         a{
             display:inline-block;
             .enable-trans(.1s);
@@ -162,26 +180,22 @@
 .m_widget.contacts{
     .content{
         padding: @gap/2 0;
+        padding-top: 0; // 适合白色导航栏背景
     }
 }
 .m_widget.music{
+    .header{
+        padding-bottom: @gap/4; // 适合白色导航栏背景
+    }
     .content{
         padding: @gap/2;
+        padding-top: 0; // 适合白色导航栏背景
     }
 }
 .m_widget.links{
-    .header{
-      display: flex;
-      justify-content: space-between;
-        .addlink{
-          color: @theme_text_in_header;
-          &:hover {
-              color: darken(@theme_text_highlight, 25%);
-          }
-        }
-    }
     .content{
         padding: @gap/2 0;
+        padding-top: 0; // 适合白色导航栏背景
         .name{
           img{
             display: inline;