首页、导航栏、底部兰、车型列表样式调整

assets/main.css

@@ -141,7 +141,7 @@ h2{
   box-shadow: 0 0 5px #ccc;
 }
 .total-div{
-  margin-bottom: 20px;
+  margin: 20px 0;
   background: #fff;
   padding: 10px;
 }
@@ -159,10 +159,18 @@ h2{
   -webkit-box-orient: vertical;
 }
 
+.color-ccc{
+  color: #ccc;
+}
+
 .ft-40{
   font-size: 40px;
 }
 
+.ft-30{
+  font-size: 30px;
+}
+
 .ft-20{
   font-size: 20px;
 }

components/banner.vue

@@ -129,12 +129,13 @@
     }
     .name-t{
         display:inline-block;
-        height:40px;
-        width:100px;
+        height:34px;
+        line-height: 34px;
+        width:102px;
         font-size: 14px;
         margin:0 5px;
-        background:#ccc;
-        color:#333;
+        background:#eee;
+        color:#666;
         cursor:pointer;
     }
     span.active{

components/footer.vue

@@ -6,28 +6,28 @@
         <div class="flex-aic">
           <div class="footer-scan">
             <img src="../assets/images/1566894441.png" alt="欣新房车，让生活更美好"/>
-            <p class="ft-12 tc">欣新房车微信公众号</p>
+            <p class="ft-12 tc color-ccc">欣新房车微信公众号</p>
           </div>
           <div class="footer-scan">
             <img src="../assets/images/xxfczs.jpg" alt="欣新房车，让生活更美好"/>
-            <p class="ft-12 tc">欣新房车助手小程序</p>
+            <p class="ft-12 tc color-ccc">欣新房车助手小程序</p>
           </div>
           <div class="footer-scan">
             <img src="../assets/images/1566894441.png" alt="欣新房车，让生活更美好"/>
-            <p class="ft-12 tc">滴房车App(欣新旗下)</p>
+            <p class="ft-12 tc color-ccc">滴房车App(欣新旗下)</p>
           </div>
         </div>
         <div class="r-contant">
-          <div class="ft-20 flex-aic r-contant-i"><img src="https://xxfc.upyuns.com/upload/1/app/c76776783ea54d0c09f9fd2c646404e.jpg" alt="欣新房车，让生活更美好"/>400-0369-369</div>
-          <div class="ft-12 flex-aic r-contant-i"><img src="https://xxfc.upyuns.com/upload/1/app/c76776783ea54d0c09f9fd2c646404e.jpg" alt="欣新房车，让生活更美好"/>广东省东莞市松山湖工业西路12号</div>
-          <div class="ft-12 flex-aic r-contant-i"><img src="https://xxfc.upyuns.com/upload/1/app/c76776783ea54d0c09f9fd2c646404e.jpg" alt="欣新房车，让生活更美好"/>欣新房车控股集团（东莞）股份有限公司</div>
-          <div class="contact">在线咨询</div>
+          <div class="ft-30 flex-aic r-contant-i"><img src="../assets/images/tel.png" style="width: 30px;" alt="欣新房车，让生活更美好"/>400-0369-369</div>
+          <div class="ft-16 flex-aic r-contant-i"><img src="../assets/images/local.png" alt="欣新房车，让生活更美好"/>广东省东莞市松山湖工业西路12号</div>
+          <div class="ft-16 flex-aic r-contant-i"><img src="../assets/images/com.png" alt="欣新房车，让生活更美好"/>欣新房车控股集团（东莞）股份有限公司</div>
+          <!--<div class="contact">在线咨询</div>-->
         </div>
       </div>
     </div>
     <div class="link-f flex-aic-jcc">
       ©欣新房车控股集团（东莞）股份有限公司2019 保留一切权利。
-      <a href="http://beian.miit.gov.cn" rel="nofollow" target="_blank">备案号：粤ICP备19072339号-2</a>
+      <span>备案号：</span><a href="http://beian.miit.gov.cn" rel="nofollow" target="_blank">粤ICP备19072339号-2</a>
     </div>
   </div>
 </template>
@@ -66,13 +66,13 @@
     display: flex;
     flex-direction: column;
     justify-content: center;
-    padding: 0px 20px;
-    border-right: 1px solid #a2a2a2;
+    padding: 0px 42px;
+    border-right: 1px solid #323737;
   }
 
   .footer-scan img{
-    width: 110px;
-    height: 110px;
+    width: 100px;
+    height: 100px;
     padding: 5px;
   }
   .footer-scan:last-child{
@@ -92,15 +92,18 @@
   }
   .r-contant img{
     width:20px;
-    height: 20px;
     margin-right: 10px;
   }
   .link-f{
     padding: 20px;
-    border-top: 1px solid #a2a2a2;
-    font-size: 14px;
+    border-top: 1px solid #323737;
+    font-size: 12px;
+    color: #999;
   }
   .link-f a{
+    color: #999;
+  }
+  .link-f a:hover{
     color: #1bbb9f;
   }
 </style>

components/menu.vue

@@ -76,6 +76,8 @@
   .users {
     list-style-type: none;
     display: flex;
+    width: 100%;
+    justify-content: space-between;
   }
   .users li a {
     display: inline-block;
@@ -87,7 +89,7 @@
     color: #222;
     text-decoration: none;
     border-bottom: 3px solid #fff;
-    font-size: 20px;
+    font-size: 16px;
   }
   .users li a:hover, .active{
     color: #1bbb9f !important;

pages/vehicle.vue

@@ -23,11 +23,11 @@
         <ul class="campsiteDetail clearfix">
           <li v-for="item in dataDetail" :key="item.id" class="vehicle-item">
             <img :src="item.coverPic" alt="房车租赁" style="width:30%;height:100%;" />
-            <div style="margin-left: 20px;">
+            <div style="margin-left: 20px;width: 50%;">
               <h2 style="font-size: 18px;margin:10px 0">{{ item.name }}</h2>
               <div>{{item.keyword}}</div>
             </div>
-            <nuxt-link :to="item.link">
+            <nuxt-link :to="item.link" class="flex-aic">
               <button class="buttonDetails">租车详情</button>
             </nuxt-link>
           </li>