修改动画

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

@@ -251,101 +251,51 @@
 
 /*弹性动画*/
 @keyframes leftIn {
-  from, 60%, 75%, 90%, to {
+  from {transform: translate3d(0, 0, 0);}
-  animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
+  to {transform: translate3d(333px, 0, 0);}
-  }
+}
 
-  0% {
+%anmCommon {
-  transform: translate3d(0, 0, 0);
+  animation-duration: .3s;
-  }
+  animation-fill-mode: both;
-
+  animation-timing-function: ease-in-out;
-  60% {
-  transform: translate3d(358px, 0, 0);
-  }
-
-  75% {
-  transform: translate3d(323px, 0, 0);
-  }
-
-  90% {
-  transform: translate3d(338px, 0, 0);
-  }
-
-  to {
-  transform: translate3d(333px, 0, 0);
-  }
 }
 
 %anmLeftIn {
-  animation-duration: .8s;
+  @extend %anmCommon;
-  animation-fill-mode: both;
   animation-name: leftIn;
 }
 
 @keyframes leftOut {
-  from, 60%, 75%, 90%, to {
+  from {transform: translate3d(333px, 0, 0);}
-  animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
+  to {transform: translate3d(0, 0, 0);}
-  }
-
-  0% {
-  transform: translate3d(333px, 0, 0);
-  }
-
-  60% {
-  transform: translate3d(-25px, 0, 0);
-  }
-
-  75% {
-  transform: translate3d(10px, 0, 0);
-  }
-
-  90% {
-  transform: translate3d(-5px, 0, 0);
-  }
-
-  to {
-  transform: translate3d(0, 0, 0);
-  }
 }
 
 %anmLeftOut {
-  animation-duration: .8s;
+  @extend %anmCommon;
   animation-name: leftOut;
 }
 
 @keyframes smallLeftIn {
-  from, 60%, 75%, 90%, to {
+  from {transform: translate3d(0, 0, 0);}
-    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-  }
-  0% {transform: translate3d(0, 0, 0);}
-  60% {transform: translate3d(325px, 0, 0);}
-  75% {transform: translate3d(290px, 0, 0);}
-  90% {transform: translate3d(305px, 0, 0);}
   to {transform: translate3d(300px, 0, 0);}
 }
 
 %anmSmallLeftIn {
-  animation-duration: .8s;
+  @extend %anmCommon;
-  animation-fill-mode: both;
   animation-name: smallLeftIn;
 }
 
 @keyframes smallleftOut {
-  from, 60%, 75%, 90%, to {
+  from {transform: translate3d(300px, 0, 0);}
-    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-  }
-  0% {transform: translate3d(333px, 0, 0);}
-  60% {transform: translate3d(-25px, 0, 0);}
-  75% {transform: translate3d(10px, 0, 0);}
-  90% {transform: translate3d(-5px, 0, 0);}
   to {transform: translate3d(0, 0, 0);}
 }
 
 %anmSmallLeftOut {
-  animation-duration: .8s;
+  @extend %anmCommon;
-  animation-fill-mode: both;
   animation-name: smallleftOut;
 }
+
 // 头像旋转动画
 @keyframes profilepic {
   0% {

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

@@ -24,7 +24,7 @@ html, body, #container {
 		display: none;
 	}
 	&.show {
-		background: linear-gradient(200deg,#a0cfe4,#e8c37e);
+		background: linear-gradient(200deg,#5aa5c6,#a4854b);
 		.anm-canvas {
 			display: block;
 			position: fixed;