侧边栏收缩

 .side-nav {
 .side-nav {
-    // display: none;
     background: #fff;
     background: #fff;
     position: fixed;
     position: fixed;
     top: 0;
     top: 0;
-    right: 100rem / $pxConvertRem;
+    right: 640rem / $pxConvertRem;
     bottom: 0;
     bottom: 0;
     left: 0;
     left: 0;
-    z-index: 1;
+    z-index: -1;
     overflow: hidden;
     overflow: hidden;
-    @include transform(translateX(-540rem / $pxConvertRem));
-    @include transition(all .3s ease-out);
+    @include transition(right .3s);
 
 
     ul {
     ul {
         background: #f0f0f0;
         background: #f0f0f0;
@@ -107,8 +105,8 @@
 }
 }
 
 
 .side-nav.on {
 .side-nav.on {
-    // display: block;
-    @include transform(translateX(0rem / $pxConvertRem));
+    right: 100rem / $pxConvertRem;
+    z-index: 3;
 }
 }
 
 
 .sub-nav {
 .sub-nav {
@@ -117,10 +115,8 @@
     bottom: 0;
     bottom: 0;
     top: 0;
     top: 0;
     left: 0;
     left: 0;
-    // right: 100rem / $pxConvertRem;
     width: 100%;
     width: 100%;
     background: #fff !important;
     background: #fff !important;
-    // z-index: 2;
 
 
     @include transform(translateX(540rem / $pxConvertRem));
     @include transform(translateX(540rem / $pxConvertRem));
     @include transition(transform 0.3s);
     @include transition(transform 0.3s);