src/App.vue

@@ -1,6 +1,6 @@
<template>
   <div id="app" class="app"  >
      <router-view class="" ></router-view>
   <div id="app" class="app">
      <router-view class=""></router-view>
   </div>
</template>

@@ -14,8 +14,7 @@
      computed: {},
      created() {},
      watch: {},
      methods: {
      }
      methods: {}
   }
</script>

@@ -49,4 +48,41 @@
      margin-top: 20px;
      margin-bottom: 20px;
   }
	
   a {
      position: relative;
   }
	
   a:hover:after {
      left: 0;
      width: 100%;
      -webkit-transition: width 350ms;
      -moz-transition: width 350ms;
      -ms-transition: width 350ms;
      -o-transition: width 350ms;
      transition: width 350ms;
   }
	
   a:after {
      position: absolute;
      bottom: -0.0625rem;
      left: 100%;
      width: 0;
      border-bottom: 0.0625rem solid #30a9de;
      content: "";
      -webkit-transition: width 350ms, left 350ms;
      -moz-transition: width 350ms, left 350ms;
      -ms-transition: width 350ms, left 350ms;
      -o-transition: width 350ms, left 350ms;
      transition: width 350ms, left 350ms;
   }
   .fade-enter-active,
   .fade-leave-active {
      transition: opacity .5s;
   }
	
   .fade-enter,
   .fade-leave-to {
      opacity: 0;
   }
</style>