From 593bad09eae9b23f5cbb40b22e9ea0450124fb89 Mon Sep 17 00:00:00 2001
From: maochaoying <925670706@qq.com>
Date: Fri, 8 Dec 2023 18:13:11 +0800
Subject: [PATCH] three card

---
 src/components/NewBottom.vue      | 34 ++++++++++++++++++++++++++--------
 src/components/NewBottomWhite.vue | 34 ++++++++++++++++++++++++++--------
 2 files changed, 52 insertions(+), 16 deletions(-)

diff --git a/src/components/NewBottom.vue b/src/components/NewBottom.vue
index 49f9c85..1c53f47 100644
--- a/src/components/NewBottom.vue
+++ b/src/components/NewBottom.vue
@@ -5,10 +5,22 @@
         <div class="first_wrap">
           <div class="title">更多服务 ｜ More</div>
           <div class="links">
-            <p class="link" @click="toPage('/')">整机开发</p>
-            <p class="link" @click="toPage('/pc/design')">工业设计</p>
-            <p class="link" @click="toPage('/pc/hardware')">软硬件开发</p>
-            <p class="link" @click="toPage('/pc/metal')">加工生产</p>
+            <div class="link" @click="toPage('/')">
+              <span>整机开发</span>
+              <p>></p>
+            </div>
+            <div class="link" @click="toPage('/pc/design')">
+              <span>工业设计</span>
+              <p>></p>
+            </div>
+            <div class="link" @click="toPage('/pc/hardware')">
+              <span>软硬件开发</span>
+              <p>></p>
+            </div>
+            <div class="link" @click="toPage('/pc/metal')">
+              <span>加工生产</span>
+              <p>></p>
+            </div>
             <!-- <p class="link" @click="toPage('/medical')">医疗健康</p> -->
           </div>
         </div>
@@ -156,9 +168,15 @@ onMounted(() => {
             color: #000000;
             margin-bottom: 17px;
             cursor: pointer;
-            &:hover {
-              text-decoration: underline;
-            }
+            border-bottom: solid 1px #ddd;
+            width: 270px;
+            padding-bottom: 6px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            // &:hover {
+            //   text-decoration: underline;
+            // }
           }
         }
       }
@@ -167,7 +185,7 @@ onMounted(() => {
         width: 1px;
         background: #d8d8d8;
         margin-right: 101px;
-        margin-left: 145px;
+        margin-left: 45px;
       }
       .second_wrap {
         display: flex;
diff --git a/src/components/NewBottomWhite.vue b/src/components/NewBottomWhite.vue
index 111060e..a7a8d67 100644
--- a/src/components/NewBottomWhite.vue
+++ b/src/components/NewBottomWhite.vue
@@ -5,10 +5,22 @@
         <div class="first_wrap">
           <div class="title">更多服务 ｜ More</div>
           <div class="links">
-            <p class="link" @click="toPage('/')">整机开发</p>
-            <p class="link" @click="toPage('/pc/design')">工业设计</p>
-            <p class="link" @click="toPage('/pc/hardware')">软硬件开发</p>
-            <p class="link" @click="toPage('/pc/metal')">加工生产</p>
+            <div class="link" @click="toPage('/')">
+              <span>整机开发</span>
+              <p>></p>
+            </div>
+            <div class="link" @click="toPage('/pc/design')">
+              <span>工业设计</span>
+              <p>></p>
+            </div>
+            <div class="link" @click="toPage('/pc/hardware')">
+              <span>软硬件开发</span>
+              <p>></p>
+            </div>
+            <div class="link" @click="toPage('/pc/metal')">
+              <span>加工生产</span>
+              <p>></p>
+            </div>
             <!-- <p class="link" @click="toPage('/medical')">医疗健康</p> -->
           </div>
         </div>
@@ -156,9 +168,15 @@ onMounted(() => {
             color: #000000;
             margin-bottom: 17px;
             cursor: pointer;
-            &:hover {
-              text-decoration: underline;
-            }
+            border-bottom: solid 1px #ddd;
+            width: 270px;
+            padding-bottom: 6px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            // &:hover {
+            //   text-decoration: underline;
+            // }
           }
         }
       }
@@ -167,7 +185,7 @@ onMounted(() => {
         width: 1px;
         background: #d8d8d8;
         margin-right: 101px;
-        margin-left: 145px;
+        margin-left: 45px;
       }
       .second_wrap {
         display: flex;