feats

src/layouts/UserLayout/index.vue

@@ -14,7 +14,9 @@
         <el-main>
           <PageHeader />
           <div class="container-wrapper">
-            <router-view></router-view>
+            <transition name="squish">
+              <router-view></router-view>
+            </transition>
           </div>
         </el-main>
         <el-footer><Footer /></el-footer>
@@ -107,4 +109,15 @@ export default {
   margin: 1em;
   position: relative;
 }
+
+.squish {
+  &-enter-active,&-leave-active {
+    transition: transform 0.25s  ease-in, opacity 0.25s  ease-in;
+  }
+
+  &-enter-from, &-leave-to {
+    transform: scale(0.95);
+    opacity: 0;
+  }
+}
 </style>

src/views/Dashboard/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>123</div>
+  <div style="background: #fff">123</div>
 </template>
 
 <script>