diff --git a/themes/yilia/source-src/css/archive.scss b/themes/yilia/source-src/css/archive.scss
index c87aa60..e84cc81 100644
--- a/themes/yilia/source-src/css/archive.scss
+++ b/themes/yilia/source-src/css/archive.scss
@@ -101,7 +101,7 @@
       font-size: 14px;
     }
     .archive-article-date{
-    cursor: default;
+      cursor: default;
       font-size: 12px;
       margin-bottom: 5px;
       margin-top: -10px;
diff --git a/themes/yilia/source-src/css/article-inner.scss b/themes/yilia/source-src/css/article-inner.scss
index cb6194f..2b0b843 100644
--- a/themes/yilia/source-src/css/article-inner.scss
+++ b/themes/yilia/source-src/css/article-inner.scss
@@ -1,77 +1,56 @@
 .article-inner {
+  border-color: #d1d1d1;
 	p {
 	  margin: 0 0 1.75em;
-	}
+  }
+  // 目录标题
+  h1,h2,h3,h4,h5,h6 {
+    font-weight: 900;
+    &:first-child {
+      margin-top: 0;
+    }
+  }
+  h1 {
+    font-size: 28px;
+    font-size: 1.75rem;
+    line-height: 1.25;
+    margin-top: 2em;
+    margin-bottom: 1em;
+    &:first-child {
+      display: inline;
+    }
+  }
+  h2 {
+    font-size: 23px;
+    font-size: 1.4375rem;
+    line-height: 1.2173913043;
+    margin-top: 2.4347826087em;
+    margin-bottom: 1.2173913043em;
+  }
+  h3 {
+    font-size: 19px;
+    font-size: 1.1875rem;
+    line-height: 1.1052631579;
+    margin-top: 2.9473684211em;
+    margin-bottom: 1.4736842105em;
+  }
+  h4,h5,h6{
+    font-size: 16px;
+    font-size: 1rem;
+    line-height: 1.3125;
+    margin-top: 3.5em;
+    margin-bottom: 1.75em;
+  }
+  h6 {
+    font-style: italic;
+  }
 }
 
-.article-inner {
-	border-color: #d1d1d1;
-}
-
-.article-inner h1 {
-	font-size: 28px;
-	font-size: 1.75rem;
-	line-height: 1.25;
-	margin-top: 2em;
-	margin-bottom: 1em;
-}
-
-.article-inner h2 {
-	font-size: 23px;
-	font-size: 1.4375rem;
-	line-height: 1.2173913043;
-	margin-top: 2.4347826087em;
-	margin-bottom: 1.2173913043em;
-}
-
-.article-inner h3 {
-	font-size: 19px;
-	font-size: 1.1875rem;
-	line-height: 1.1052631579;
-	margin-top: 2.9473684211em;
-	margin-bottom: 1.4736842105em;
-}
-
-.article-inner h4,
-.article-inner h5,
-.article-inner h6 {
-	font-size: 16px;
-	font-size: 1rem;
-	line-height: 1.3125;
-	margin-top: 3.5em;
-	margin-bottom: 1.75em;
-}
-
-.article-inner h6 {
-	font-style: italic;
-}
-
-.article-inner h1,
-.article-inner h2,
-.article-inner h3,
-.article-inner h4,
-.article-inner h5,
-.article-inner h6 {
-	font-weight: 900;
-}
-
-.article-inner h1:first-child,
-.article-inner h2:first-child,
-.article-inner h3:first-child,
-.article-inner h4:first-child,
-.article-inner h5:first-child,
-.article-inner h6:first-child {
-	margin-top: 0;
-}
-
-.article-inner h1:first-child{
-  display: inline;
-}
 .article-entry{
   line-height: 1.8em;
   padding-right: 7.6923%;
   padding-left: 7.6923%;
-  .post-count {
+  .post-count { // 字数统计
     color: rgb(185, 185, 185);
     font-size: 14px;
     .count-item {
@@ -81,6 +60,14 @@
       }
     }
   }
+  img {
+    transition: transform 0.2s ease-out,box-shadow 0.5s ease;
+    cursor: zoom-in;
+    &:hover {
+      transform: scale(1.05,1.05);
+      box-shadow: 0px 0px 10px 2px #87afea;
+    }
+  }
   p{
     margin-top: 10px;
   }
@@ -200,31 +187,23 @@
     tr,td{
       height:35px;
     }
-    thead{
-      tr {
-        background: #f8f8f8;
-      }
+    thead tr{
+      background: #f8f8f8;
     }
-    tbody{
-      tr:hover{
-        background: #efefef;
-      }
+    tbody tr:hover{
+      background: #efefef;
     }
     td,th{
       border: 1px solid #dedede;
       padding: 0 10px;
     }
   }
-  figure{
-    table {
-      border: none;
-      width: auto;
-      margin: 0;
-      tbody{
-        tr:hover{
-          background: none;
-        }
-      }
+  figure table{
+    border: none;
+    width: auto;
+    margin: 0;
+    tbody tr:hover{
+      background: none;
     }
   }
 }
diff --git a/themes/yilia/source-src/css/article-main.scss b/themes/yilia/source-src/css/article-main.scss
index 7231a36..d4ae3dc 100644
--- a/themes/yilia/source-src/css/article-main.scss
+++ b/themes/yilia/source-src/css/article-main.scss
@@ -62,15 +62,6 @@
   border-bottom: 1px solid #fff;
   background: #fff;
   transition: all 0.2s ease-in;
-/*   &.show{
-    visibility: visible;
-    -webkit-animation: cd-bounce-1 0.6s;
-    -moz-animation: cd-bounce-1 0.6s;
-    animation: cd-bounce-1 0.6s;
-  }
-  &.hidden{
-    visibility: hidden;
-  } */
   img{
     max-width: 100%;
   }
diff --git a/themes/yilia/source-src/css/left.scss b/themes/yilia/source-src/css/left.scss
index ed22bdb..d8b4edc 100644
--- a/themes/yilia/source-src/css/left.scss
+++ b/themes/yilia/source-src/css/left.scss
@@ -11,23 +11,23 @@
 	}
 	.overlay{
 		width: 100%;
-		height: 180px;
+		height: 150px;
 		position: absolute;
 	}
 
 	.intrude-less {
 		width: 76%;
 		text-align: center;
-		margin: 112px auto 0;
+		margin: 82px auto 0;
 	}
 
 	#header{
 		width:100%;
 		height: 300px;
 		position: relative;
-		border-bottom: 1px solid color-border;
 		a {
 			color: #696969;
+			transition: color 0.3s;
 			&:hover {
 				color: #B0A0AA;
 			}
@@ -67,7 +67,7 @@
 			}
 		}
 		.header-smart-menu {
-			font-size: 12px;
+			font-size: 16px;
 			margin-bottom: 20px;
 			a {
 				&:after {
diff --git a/themes/yilia/source-src/css/mobile-slider.scss b/themes/yilia/source-src/css/mobile-slider.scss
index 1bb5902..f6aa2aa 100644
--- a/themes/yilia/source-src/css/mobile-slider.scss
+++ b/themes/yilia/source-src/css/mobile-slider.scss
@@ -10,6 +10,7 @@
     overflow: hidden;
     background: #88acdb;
     -webkit-transition: all 0.2s ease-in;
+    transition: all 0.2s ease-in;
     display: -webkit-box;
     -webkit-box-orient: horizontal;
     -webkit-box-pack: center;
diff --git a/themes/yilia/source-src/css/mobile.scss b/themes/yilia/source-src/css/mobile.scss
index da6026e..133a7c3 100644
--- a/themes/yilia/source-src/css/mobile.scss
+++ b/themes/yilia/source-src/css/mobile.scss
@@ -1,315 +1,315 @@
 html, body, #container {
-    height: auto;
-    overflow-x: hidden;
-    overflow-y: auto;
+  height: auto;
+  overflow-x: hidden;
+  overflow-y: auto;
 }
 #mobile-nav {
 	display: block;
 }
 .body-wrap {
-    margin-bottom: 0;
+  margin-bottom: 0;
 }
 .left-col {
-    display: none;
+  display: none;
 }
 .mid-col {
-    left: 0;
-    position: relative;
+  left: 0;
+  position: relative;
 }
 #header{
-    .header-nav{
-        position: relative;
-    }
+  .header-nav{
+    position: relative;
+  }
 }
 .wrap-side-operation {
-    display: none;
+  display: none;
 }
 .cloud-tie-wrapper {
 	padding: 0;
 	min-height: 20px;
 }
 .tools-col {
-    left: -300px;
+  left: -300px;
+  width: 300px;
+  .tools-wrap {
+    padding-top: 48px;
+  }
+  .tools-wrap, .tools-section {
     width: 300px;
-    .tools-wrap {
-        padding-top: 48px;
+    .search-wrap {
+      width: 280px;
     }
-    .tools-wrap, .tools-section {
-        width: 300px;
-        .search-wrap {
-            width: 280px;
-        }
-        .search-tag.tagcloud {
-            margin-right: -30px;
-        }
-        .search-ul .search-li {
-            padding: 5px 20px;
-        }
+    .search-tag.tagcloud {
+      margin-right: -30px;
     }
-    &.show {
-        .header-menu{
-            &.tools-nav {
-                display: block;
-            }
-        }
+    .search-ul .search-li {
+      padding: 5px 20px;
     }
+  }
+  &.show {
+    .header-menu{
+      &.tools-nav {
+        display: block;
+      }
+    }
+  }
 }
 
 #container .header-author.fixed {
-    position: fixed;
-    top: -29px;
-    width: 100%;
-    color: #ddd;
+  position: fixed;
+  top: -29px;
+  width: 100%;
+  color: #ddd;
 }
 .mobile-mask {
-    width: 100%;
-    height: 100%;
-    position: fixed;
-    top: 0;
-    left: 0;
-    background: rgba(0, 0, 0, .85);
-    z-index: 999;
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  background: rgba(0, 0, 0, .85);
+  z-index: 999;
 }
 .btnctn{
-    position: fixed;
-    width: 50px;
-    height: 50px;
-    z-index: 4;
-    .slider-trigger{
-        position: absolute;
-        z-index: 101;
-        width: 42px;
-        height: 42px;
-        text-align: center;
-        line-height: 50px;
-        &.back {
-            top: 0;
-            left: 0;
-        }
-        &.list {
-            background-color: rgba(100,100,100,0.7)
-        }
-        &:hover{
-            background: #444;
-        }
-        .icon{
-            font-size: 24px;
-            color: #fff;
-        }
+  position: fixed;
+  width: 50px;
+  height: 50px;
+  z-index: 4;
+  .slider-trigger{
+    position: absolute;
+    z-index: 101;
+    width: 42px;
+    height: 42px;
+    text-align: center;
+    line-height: 50px;
+    &.back {
+      top: 0;
+      left: 0;
     }
+    &.list {
+      background-color: rgba(100,100,100,0.7)
+    }
+    &:hover{
+      background: #444;
+    }
+    .icon{
+      font-size: 24px;
+      color: #fff;
+    }
+  }
 }
 .article-header{
-    border-left: none;
-    padding: 0;
-    border-bottom: 1px dotted #ddd;
-    h1{
-        margin-bottom: 10px;
-    }
-    .archive-article-date{
-        float: initial;
-    }
+  border-left: none;
+  padding: 0;
+  border-bottom: 1px dotted #ddd;
+  h1{
+    margin-bottom: 10px;
+  }
+  .archive-article-date{
+    float: initial;
+  }
 }
 .header-subtitle{
-    padding: 0 24px;
-    .icon {
-        margin: 0 10px;
-        color: #d0d0d0;
-    }
+  padding: 0 24px;
+  .icon {
+    margin: 0 10px;
+    color: #d0d0d0;
+  }
 }
 
 .article-info-index.article-info{
-    min-height: 40px;
-    padding-top: 10px;
-    margin: 0;
-    border-top: 1px solid #ddd;
+  min-height: 40px;
+  padding-top: 10px;
+  margin: 0;
+  border-top: 1px solid #ddd;
 }
 .article-info-post.article-info{
-    margin: 0;
-    padding-top: 10px;
-    border: none;
+  margin: 0;
+  padding-top: 10px;
+  border: none;
 }
 #viewer-box .viewer-box-l{
-    font-size: 14px;
+  font-size: 14px;
 }
 .article-nav-link-wrap{
-    margin: 5px 0;
-    display: block;
-    clear: both;
-    .icon-circle-right {
-        float: left;
-        margin: 6px 4px 0 0;
-    }
+  margin: 5px 0;
+  display: block;
+  clear: both;
+  .icon-circle-right {
+    float: left;
+    margin: 6px 4px 0 0;
+  }
 }
 .article{
-    padding: 10px;
-    margin: 10px 0;
-    border: 0;
-    font-size: 16px;
-    color: #555;
-    .article-more-link {
-        margin: 0;
-    }
-    .article-entry{
-        padding: 10px 0 30px 0;
-    }
-    .article-inner h1.article-title, .article-title{
-        font-size: 18px;
-        font-weight: 300;
-        display: block;
-        margin: 0;
-    }
-    .article-meta{
+  padding: 10px;
+  margin: 10px 0;
+  border: 0;
+  font-size: 16px;
+  color: #555;
+  .article-more-link {
+    margin: 0;
+  }
+  .article-entry{
+    padding: 10px 0 30px 0;
+  }
+  .article-inner h1.article-title, .article-title{
+    font-size: 18px;
+    font-weight: 300;
+    display: block;
+    margin: 0;
+  }
+  .article-meta{
+    width: auto;
+    height: 30px;
+    margin-top: -5px;
+    position: ralative;
+    .article-date{
+      font-size: 12px;
+      border-radius: 0;
+      color: #666;
+      background: none;
+      height: auto;
+      padding: 0;
+      margin: 0;
+      width: 100%;
+      text-align: left;
+      margin-left: 10px;
+      time{
         width: auto;
-        height: 30px;
-        margin-top: -5px;
-        position: ralative;
-        .article-date{
-            font-size: 12px;
-            border-radius: 0;
-            color: #666;
-            background: none;
-            height: auto;
-            padding: 0;
-            margin: 0;
-            width: 100%;
-            text-align: left;
-            margin-left: 10px;
-            time{
-                width: auto;
-                float: right;
-                margin-right: 10px;
-            }
-        }
-        .article-tag-list{
-            margin-top: 7px;
-            position: absolute;
-            right: 10px;
-            top: 0;
-            &:before{
-                float: left;
-                margin-top: 1px;
-                left: 0;
-            }
-            .article-tag-list-item{
-                float: left;
-                padding-left: 0;
-                width: auto;
-                max-width: 83px;
-            }
-        }
-        .article-category{
-            margin-top: 7px;
-            position: absolute;
-            right: 10px;
-            top: -30px;
-            &:before{
-                float: left;
-                margin-top: 1px;
-                left: 15px;
-            }
-            .article-category-link{
-                max-width: 83px;
-                width: auto;
-                padding-left:10px;
-            }
-        }
+        float: right;
+        margin-right: 10px;
+      }
     }
-    
-    #article-nav-older{
-        float: none;
-        display: block;
+    .article-tag-list{
+      margin-top: 7px;
+      position: absolute;
+      right: 10px;
+      top: 0;
+      &:before{
+        float: left;
+        margin-top: 1px;
+        left: 0;
+      }
+      .article-tag-list-item{
+        float: left;
+        padding-left: 0;
+        width: auto;
+        max-width: 83px;
+      }
     }
+    .article-category{
+      margin-top: 7px;
+      position: absolute;
+      right: 10px;
+      top: -30px;
+      &:before{
+        float: left;
+        margin-top: 1px;
+        left: 15px;
+      }
+      .article-category-link{
+        max-width: 83px;
+        width: auto;
+        padding-left:10px;
+      }
+    }
+  }
+  
+  #article-nav-older{
+    float: none;
+    display: block;
+  }
 }
 #comments {
-    margin: 0;
+  margin: 0;
 }
 .share{
-    padding: 3px 10px;
+  padding: 3px 10px;
 }
 .duoshuo {
-    padding: 0 13px;
+  padding: 0 13px;
 }
 #disqus_thread {
-    padding: 0 13px;
+  padding: 0 13px;
 }
 #article-nav {
-    margin: 0;
-    padding: 5px 10px 10px;
+  margin: 0;
+  padding: 5px 10px 10px;
 }
 #article-nav #article-nav-older {
-    float: none;
+  float: none;
 }
 #article-nav .article-nav-link-wrap .article-nav-title {
-    font-size: 16px;
+  font-size: 16px;
 }
 
 #page-nav .extend{
-    opacity: 1;
+  opacity: 1;
 }
 
 .instagram .open-ins{
-    left: 2px;
-    top: -30px;
-    color: #aaa;
+  left: 2px;
+  top: -30px;
+  color: #aaa;
 }
 .info-on-right{
-    float: initial;
+  float: initial;
 }
 .archives-wrap{
-    margin: 10px 10px 0px;
-    padding: 10px;
-    .archive-article-title{
-        font-size: 16px;
+  margin: 10px 10px 0px;
+  padding: 10px;
+  .archive-article-title{
+    font-size: 16px;
+  }
+  .archive-year-wrap{
+    position: relative;
+    padding: 0 0 0 0;
+    a{
+      padding: 0 0 0 0;
     }
-    .archive-year-wrap{
-        position: relative;
-        padding: 0 0 0 0;
-        a{
-            padding: 0 0 0 0;
-        }
+  }
+  .article-meta{
+    .archive-article-date{
+      font-size: 12px;
+      margin-right: 10px;
+      margin-top: -5px;
     }
-    .article-meta{
-        .archive-article-date{
-            font-size: 12px;
-            margin-right: 10px;
-            margin-top: -5px;
-        }
-        .article-tag-list-link{
-            font-size: 12px;
-        }
+    .article-tag-list-link{
+      font-size: 12px;
     }
+  }
 }
 .archives{
-    .archive-article{
-        padding: 10px 0;
-        margin-left: 0;
-    }
+  .archive-article{
+    padding: 10px 0;
+    margin-left: 0;
+  }
 }
 
 #footer {
-    position: relative;
-    bottom: 0;
-    .footer-left{
-        float: initial;
-        margin-bottom: 10px;
-    }
-    .footer-right{
-        float: initial;
-    }
+  position: relative;
+  bottom: 0;
+  .footer-left{
+    float: initial;
+    margin-bottom: 10px;
+  }
+  .footer-right{
+    float: initial;
+  }
 }
 
 #mobile-nav{
-    .header-author{
-        margin: 0;
-        position: relative;
-        z-index: 2;
-        color: #424242;
-    }
+  .header-author{
+    margin: 0;
+    position: relative;
+    z-index: 2;
+    color: #424242;
+  }
 	.overlay{
 		height: 110px;
 		position: absolute;
 		width: 100%;
-        z-index: 2;
+    z-index: 2;
 		background: #4d4d4d;
 	}
 	#header{
@@ -323,58 +323,58 @@ html, body, #container {
 }
 
 .header-menu{
-    height: auto;
-    margin: 10px 0 20px;
-    &.tools-nav {
-        display: none;
-        position: fixed;
-        left: 0;
-        width: 100%;
-        z-index: 9999;
-        ul {
-            margin-right: 28px;
-        }
-        ul, li {
-            border-color: #fff;
-            a {
-                color: #fff;
-                &.active {
-                    background: #81b5cc;
-                }
-            }
-        }
+  height: auto;
+  margin: 10px 0 20px;
+  &.tools-nav {
+    display: none;
+    position: fixed;
+    left: 0;
+    width: 100%;
+    z-index: 9999;
+    ul {
+      margin-right: 28px;
     }
-    ul{
-        text-align: center;
-        cursor: default;
-        display: flex;
-        margin: 0 auto;
-        align-items: center;
-        justify-content: space-around;
-        position: relative;
-        z-index: 1;
-        border: 1px solid #a0a0a0;
-        border-radius: 3px;
+    ul, li {
+      border-color: #fff;
+      a {
+        color: #fff;
+        &.active {
+          background: #81b5cc;
+        }
+      }
     }
-    li{
-        border-left: 1px solid #a0a0a0;
-        &:first-child {
-            border-left: 0;
-        }
-        &:last-child {
-            border-right: 0;
-        }
-        a {
-            font-size: 14px;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            display: block;
-            color: #a0a0a0;
-            &.active {
-                color: #eaeaea;
-                background: #a0a0a0;
-            }
-        }
+  }
+  ul{
+    text-align: center;
+    cursor: default;
+    display: flex;
+    margin: 0 auto;
+    align-items: center;
+    justify-content: space-around;
+    position: relative;
+    z-index: 1;
+    border: 1px solid #a0a0a0;
+    border-radius: 3px;
+  }
+  li{
+    border-left: 1px solid #a0a0a0;
+    &:first-child {
+      border-left: 0;
     }
+    &:last-child {
+      border-right: 0;
+    }
+    a {
+      font-size: 14px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      display: block;
+      color: #a0a0a0;
+      &.active {
+        color: #eaeaea;
+        background: #a0a0a0;
+      }
+    }
+  }
 }
\ No newline at end of file
diff --git a/themes/yilia/source-src/css/tags.scss b/themes/yilia/source-src/css/tags.scss
index 80dfd8c..7e18c7d 100644
--- a/themes/yilia/source-src/css/tags.scss
+++ b/themes/yilia/source-src/css/tags.scss
@@ -1,112 +1,115 @@
 #header .tagcloud a{
-    color:#fff; 
+  color:#fff; 
 }
 .tagcloud{
-    a.js-tag{
-        display:inline-block;  
-        text-decoration:none;  
-        font-weight: normal;
-        font-size:10px;  
-        color:#fff;   
-        height:18px;  
-        line-height:18px;  
-        float: left;
-        padding:0 5px 0px 10px;  
-        position:relative;  
-        border-radius:0 5px 5px 0; 
-        margin: 5px 9px 5px 8px;
-        font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
-        &:hover{
-            opacity: 0.8;
-        }
-        &:before{
-            content: " ";
-            width: 0px;
-            height: 0px;
-            position: absolute;
-            top: 0;
-            left: -18px;
-            border: 9px solid transparent;
-        }
-        &:after{  
-            content:" ";  
-            width:4px;  
-            height:4px;  
-            background-color:#fff;  
-            border-radius:4px;  
-            box-shadow:0px 0px 0px 1px rgba(0,0,0,.3);  
-            position:absolute;  
-            top: 7px;
-            left: 2px;
-        }  
+  a.js-tag{
+    display:inline-block;  
+    text-decoration:none;  
+    font-weight: normal;
+    font-size:10px;  
+    color:#fff;   
+    height:18px;  
+    line-height:18px;  
+    padding:0 5px 0px 10px;  
+    position:relative;  
+    border-radius:0 5px 5px 0; 
+    margin: 5px 9px 5px 8px;
+    font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
+    &:hover{
+      opacity: 0.8;
     }
-    a.color1{
-        background:  #FF945C;
-        &:before{
-            border-right-color: #FF945C;  
-        }
+    &::before{
+      content: " ";
+      width: 0px;
+      height: 0px;
+      position: absolute;
+      top: 0;
+      left: -18px;
+      border: 9px solid transparent;
     }
-    a.color2{
-        background:  #cc8167;
-        &:before{
-            border-right-color: #cc8167;  
-        }
+    &::after{  
+      content:" ";  
+      width:4px;  
+      height:4px;  
+      background-color:#fff;  
+      border-radius:4px;  
+      box-shadow:0px 0px 0px 1px rgba(0,0,0,.3);  
+      position:absolute;  
+      top: 7px;
+      left: 2px;
+    }  
+  }
+  a.color1{
+    background:  #FF945C;
+    &::before{
+      border-right-color: #FF945C;  
     }
-    a.color3{
-        background:  #BA8F6C;
-        &:before{
-            border-right-color: #BA8F6C;  
-        }
+  }
+  a.color2{
+    background:  #cc8167;
+    &::before{
+      border-right-color: #cc8167;  
     }
-    a.color4{
-        background: #94635c;
-        &:before{
-            border-right-color:#94635c;  
-        }
+  }
+  a.color3{
+    background:  #BA8F6C;
+    &::before{
+      border-right-color: #BA8F6C;  
     }
-    a.color5{
-        background: #7B5D5F;
-        &:before{
-            border-right-color:#7B5D5F;  
-        }
+  }
+  a.color4{
+    background: #94635c;
+    &::before{
+      border-right-color:#94635c;  
     }
+  }
+  a.color5{
+    background: #7B5D5F;
+    &::before{
+      border-right-color:#7B5D5F;  
+    }
+  }
 }
 
 .article-tag-list{
-    .article-tag-list-item{
-        float: left;
-    }
+  .article-tag-list-item{
+    float: left;
+  }
 }
 .article-pop-out{
+  float: left;
+  .icon-tuding {
+    color: #999;
     float: left;
-    .icon-tuding {
-        color: #999;
-        float: left;
-        margin-right: 10px;
-        margin-top: 6px;
-    }
+    margin-right: 10px;
+    margin-top: 6px;
+  }
 }
 .article-tag, .article-category{
+  float: left;
+  .article-tag-list{
     float: left;
-    .article-tag-list{
-        float: left;
-    }
-    .icon {
-        color: #999;
-        float: left;
-        margin-right: 10px;
-        margin-top: 6px;
-    }
+  }
+  .icon {
+    color: #999;
+    float: left;
+    margin-right: 10px;
+    margin-top: 6px;
+  }
 }
 .article-pop-out {
-    float: left;
+  float: left;
 }
 
 .archive-article-date {
-    color: #999;
-    margin-right: 7.6923%;
-    float: right;
-    .icon {
-        margin: 5px 5px 5px 0;
-    }
+  color: #999;
+  margin-right: 7.6923%;
+  float: right;
+  transition: color 0.3s;
+  &:hover {
+    color: #b5b5b5;
+  }
+  .icon {
+    margin: 5px 5px 5px 0;
+  }
 }
\ No newline at end of file
diff --git a/themes/yilia/source-src/css/tooltip.scss b/themes/yilia/source-src/css/tooltip.scss
index cdf30dd..44005ee 100644
--- a/themes/yilia/source-src/css/tooltip.scss
+++ b/themes/yilia/source-src/css/tooltip.scss
@@ -189,7 +189,7 @@
         padding: 40px;
         -webkit-transform: translate3d(0,100%,0);
         transform: translate3d(0,100%,0);
-        webkit-transition: -webkit-transform 0.3s;
+        -webkit-transition: -webkit-transform 0.3s;
         transition: transform 0.3s;
     }