工具栏弹出隐藏效果优化

themes/yilia/source-src/css/core/_animation.scss

@@ -255,13 +255,25 @@
 }
 
 @keyframes leftIn {
-  from {transform: translate3d(0, 0, 0);}
-  to {transform: translate3d(333px, 0, 0);}
+  from {
+    transform: translate3d(0, 0, 0);
+    background:$colorBodyBg;
+  }
+  to {
+    transform: translate3d(333px, 0, 0);
+    background: none;
+  }
 }
 
 @keyframes leftOut {
-  from {transform: translate3d(333px, 0, 0);}
-  to {transform: translate3d(0, 0, 0);}
+  from {
+    transform: translate3d(333px, 0, 0);
+    background: none;
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+    background:$colorBodyBg;
+  }
 }
 
 %anmLeftIn {
@@ -275,13 +287,25 @@
 }
 
 @keyframes smallLeftIn {
-  from {transform: translate3d(0, 0, 0);}
-  to {transform: translate3d(300px, 0, 0);}
+  from {
+    transform: translate3d(0, 0, 0);
+    opacity: 0;
+  }
+  to {
+    transform: translate3d(300px, 0, 0);
+    opacity: 1;
+  }
 }
 
 @keyframes smallleftOut {
-  from {transform: translate3d(300px, 0, 0);}
-  to {transform: translate3d(0, 0, 0);}
+  from {
+    transform: translate3d(300px, 0, 0);
+    opacity: 1;
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+    opacity: 0;
+  }
 }
 
 %anmSmallLeftIn {

themes/yilia/source-src/css/grid.scss

@@ -43,12 +43,11 @@ html, body, #container {
   width: auto;
 	@extend %trans;
 	&.show {
-		background: none;
-		opacity: .9;
 		@extend %anmLeftIn;
 		.article {
       transition: opacity .5s ease-in, background-color .2s ease-in;
       opacity: 0.6;
+      pointer-events: none;
 		}
 	}
 	&.hide {

themes/yilia/source-src/css/tools.scss

@@ -11,12 +11,10 @@
   overflow-scrolling: touch;
   @extend %trans;
   &.show {
-    opacity: 1;
     @extend %anmSmallLeftIn;
   }
   &.hide {
     @extend %anmSmallLeftOut;
-    z-index: 0;
   }
   .tools-nav {
     display: none;