From d64742d7fc46404af4a07060136a3c9017c15bb3 Mon Sep 17 00:00:00 2001
From: maochaoying <925670706@qq.com>
Date: Sat, 20 May 2023 15:43:59 +0800
Subject: [PATCH] =?UTF-8?q?=E8=81=94=E7=B3=BB=E6=88=91=E4=BB=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Contact.vue | 92 +++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 91 insertions(+), 1 deletion(-)

diff --git a/src/components/Contact.vue b/src/components/Contact.vue
index 0d7213a..3aa756b 100644
--- a/src/components/Contact.vue
+++ b/src/components/Contact.vue
@@ -24,6 +24,37 @@
     </div>
     <div class="contact_form">
       <p class="title">联系我们</p>
+      <div class="input_container mb">
+        <input type="text" class="input" />
+        <div class="label_container">
+          <span>姓名</span>
+          <p class="line"></p>
+        </div>
+      </div>
+      <div class="input_container mb">
+        <input type="text" class="input" />
+        <div class="label_container">
+          <span>电话</span>
+          <p class="line"></p>
+        </div>
+      </div>
+      <div class="input_container mb">
+        <input type="text" class="input" />
+        <div class="label_container">
+          <span>公司</span>
+          <p class="line"></p>
+        </div>
+      </div>
+      <div class="input_container mb">
+        <input type="text" class="input" />
+        <div class="label_container">
+          <span>需求</span>
+          <p class="line"></p>
+        </div>
+      </div>
+      <div class="btn_con">
+        <div class="send">发送</div>
+      </div>
     </div>
   </div>
 </template>
@@ -96,7 +127,6 @@ import Email from '@/static/img/10.png'
   .contact_form {
     flex: 1;
     margin-left: 191px;
-    height: 546px;
     background: #ffffff;
     border-radius: 8px;
     border-top: 4px solid #f95926;
@@ -105,6 +135,66 @@ import Email from '@/static/img/10.png'
       font-size: 26px;
       font-weight: bold;
       color: #000000;
+      margin-bottom: 44px;
+      margin-left: 8px;
+    }
+    .input_container {
+      width: 100%;
+      position: relative;
+      .input {
+        width: 100%;
+        height: 50px;
+        border: 1px solid #dcdfe6;
+        border-radius: 25px;
+        padding-left: 112px;
+        padding-right: 20px;
+        box-sizing: border-box;
+        font-size: 20px;
+        font-family: Alibaba PuHuiTi;
+        font-weight: 400;
+        color: #dcdfe6;
+        line-height: 38px;
+        outline: none;
+      }
+      .label_container {
+        display: flex;
+        align-items: center;
+        font-size: 20px;
+        font-family: Alibaba PuHuiTi;
+        font-weight: 400;
+        color: #dcdfe6;
+        position: absolute;
+        left: 0;
+        top: 0;
+        height: 50px;
+        padding-left: 27px;
+        .line {
+          width: 1px;
+          height: 17px;
+          background: #dcdfe6;
+          margin-left: 27px;
+        }
+      }
+    }
+    .mb {
+      margin-bottom: 36px;
+    }
+    .btn_con {
+      display: flex;
+      justify-content: flex-end;
+      width: 100%;
+      .send {
+        width: 102px;
+        height: 43px;
+        background: linear-gradient(90deg, #facc22, #f83600);
+        border-radius: 22px;
+        font-size: 18px;
+        font-weight: 300;
+        color: #fafafa;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
     }
   }
 }