home

www/vue/src/App.vue

@@ -31,7 +31,7 @@
     top: 6%;
     left: 0;
     right: 0;
-    bottom: 10%;
+    bottom: 46px;
     background-color: #b0aa99;
   }
 </style>

www/vue/src/components/home.vue

@@ -50,6 +50,8 @@ export default {
 }
 .home-img-1 .home-nav div{
   width: 20%;
-  border: 1px solid;
+  color: rgba(0,0,0,0.5);
+  border: 1px solid rgba(0,0,0,0.5);
+  line-height: 54px;
 }
 </style>

www/vue/src/components/navigation.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="navigation">
-    <div class="r_l"><router-link to="/">首页</router-link></div>
-    <div class="r_l"><router-link to="/product">订单</router-link></div>
-    <div class="r_l"><router-link to="/mine">我的</router-link></div>
+    <div class="r_l"><router-link to="/"><img src="../assets/icons/icon-home.png">首页</router-link></div>
+    <div class="r_l"><router-link to="/product"><img src="../assets/icons/icon-order.png">订单</router-link></div>
+    <div class="r_l"><router-link to="/mine"><img src="../assets/icons/icon-mine.png">我的</router-link></div>
     <div class="clear"></div>
   </div>
 </template>
@@ -33,13 +33,20 @@ export default {
 .navigation div.r_l{
   width: 33.33%;
   background-color: #f7fff6;
-  border: 1px solid rgba(0, 0, 0, 0.3);
+  border: 1px solid rgba(0, 0, 0, 0.2);
 }
 .navigation div.r_l a{
   display: block;
   width: 100%;
-  line-height: 3rem;
+  /*line-height: 3rem;*/
   text-decoration: none;
-  color: #212121;
+  color: #707070;
+  font-size: 13px;
+}
+.navigation div.r_l a img{
+  width: 20px;
+  margin: 0 auto;
+  margin-top: 5px;
+  display: block;
 }
 </style>