官网页面初步修改完成

src/views/home/homeView.vue

@@ -4,8 +4,10 @@ import s1 from '../../assets/images/lbt1.jpeg'
 import s2 from '../../assets/images/lbt2.jpeg'
 import s3 from '../../assets/images/lbt3.jpeg'
 import tb1 from '../../assets/images/tb1.png'
+import dt from '../../assets/images/dt.jpg'
 import { ref, onMounted } from 'vue'
 import FootView from '../../components/footView.vue'
+// import { subMenuProps } from 'element-plus'
 
 export default {
   components: {
@@ -14,16 +16,59 @@ export default {
   data() {
     return {
       imagePath: {
-        logo: logo,
+        logo,
-        tb1: tb1,
+        tb1,
-        s1: s1,
+        s1,
-        s2: s2,
+        s2,
-        s3: s3,
+        s3,
+        dt,
       },
       isDark: false,
     }
   },
   setup() {
+    const form = ref({
+      input1: '',
+      input2: '',
+      input3: '',
+    });
+
+    const input1 = ref(null);
+    const input2 = ref(null);
+    const input3 = ref(null);
+    const submitBtn = ref(null);
+
+
+    const focusNext = (refName) => {
+      switch (refName) {
+        case 'input2':
+          input2.value.focus();
+          break;
+        case 'input3':
+          input3.value.focus();
+          break;
+        case 'submitBtn':
+          submitBtn.value.focus();
+          break;
+      }
+    };
+    const resetForm = () => {
+      form.value = {
+        input1: '',
+        input2: '',
+        input3: ''
+      };
+    };
+    const submitForm = () => {
+      alert('提交成功！')
+      resetForm();
+      input1.value.focus();
+
+    };
+    onMounted(() => {
+      input1.value.focus();
+    });
+
     const slides = [{ image: s1 }, { image: s2 }, { image: s3 }]
 
     const currentIndex = ref(0)
@@ -62,9 +107,9 @@ export default {
     const yuanYuwoMen = (id) => {
       tiaoZhuan(id)
     }
-    const tij = () => {
+    // const tij = () => {
-      alert('提交成功！')
+    //   alert('提交成功！')
-    }
+    // }
     // 自动播放
     onMounted(() => {
       setInterval(nextSlide, 4000)
@@ -83,7 +128,14 @@ export default {
       keHuanLi,
       yuanYuwoMen,
       tiJiao,
-      tij,
+      resetForm,
+      form,
+      input1,
+      input2,
+      input3,
+      submitBtn,
+      focusNext,
+      submitForm,
     }
   },
 }
@@ -97,7 +149,7 @@ export default {
           <div class="dhl" id="dhl">
             <div class="left-box">
               <img class="img-1" :src="imagePath.logo" alt="Logo" />
-              <span class="sys-title">辉擎科技</span>
+              <span class="sys-title" title="辉擎科技">辉擎科技</span>
             </div>
             <div class="right-box">
               <div class="dhl-x">
@@ -105,7 +157,7 @@ export default {
                 <div><a class="dhl-yt" @click="canPingFangan('bk')">产品方案</a></div>
                 <div><a class="dhl-yt" @click="jieJuewenTi('fan-mk')">行业解决问题</a></div>
                 <div><a class="dhl-yt" @click="keHuanLi('bk-2')">客户案例</a></div>
-                <div><a class="dhl-yt" @click="yuanYuwoMen('lx-mk')">关于我们</a></div>
+                <div><a class="dhl-yt" @click="yuanYuwoMen('dt-mk')">关于我们</a></div>
               </div>
               <el-button @click="geet" class="an-3" type="primary">免费咨询</el-button>
             </div>
@@ -120,9 +172,7 @@ export default {
                   <div class="em-3">
                     辉擎成都科技有限公司致力于提供创新的软件开发解决方案，帮助企业实现数字化转型提升竞争力。
                   </div>
-                  <el-button class="an-1" type="primary" @click="yuanYuwoMen('lx-mk')"
+                  <el-button class="an-1" type="primary" @click="yuanYuwoMen('lx-mk')">联系我们</el-button>
-                    >联系我们</el-button
-                  >
                   <el-button class="an-2" @click="canPingFangan('bk')">了解服务</el-button>
                 </div>
                 <img :src="slide.image" alt="Slide Image" />
@@ -139,28 +189,28 @@ export default {
               </div>
             </div>
             <div class="fw">
-              <div class="fw-box">
+              <div class="fw-box" title="人工智能平台">
                 <img class="img-2" :src="imagePath.tb1" alt="tb1" />
                 <div class="rgzn">人工智能平台</div>
                 <div class="tgfw">
                   提供企业级AI能力，包括机器学习、深度学习、自然语言处理等核心技术支持
                 </div>
               </div>
-              <div class="fw-box">
+              <div class="fw-box" title="人工智能平台">
                 <img class="img-2" :src="imagePath.tb1" alt="tb1" />
                 <div class="rgzn">人工智能平台</div>
                 <div class="tgfw">
                   提供企业级AI能力，包括机器学习、深度学习、自然语言处理等核心技术支持
                 </div>
               </div>
-              <div class="fw-box">
+              <div class="fw-box" title="人工智能平台">
                 <img class="img-2" :src="imagePath.tb1" alt="tb1" />
                 <div class="rgzn">人工智能平台</div>
                 <div class="tgfw">
                   提供企业级AI能力，包括机器学习、深度学习、自然语言处理等核心技术支持
                 </div>
               </div>
-              <div class="fw-box">
+              <div class="fw-box" title="人工智能平台">
                 <img class="img-2" :src="imagePath.tb1" alt="tb1" />
                 <div class="rgzn">人工智能平台</div>
                 <div class="tgfw">
@@ -190,7 +240,7 @@ export default {
                   </div>
                   <div class="bteen-box">
                     <div style="color: #646262">部署时间:xxxx年</div>
-                    <el-link :underline="false" style="color: #3d8dce">查看详情</el-link>
+                    <el-link :underline="false" style="color: #3d8dce" title="查看详情">查看详情</el-link>
                   </div>
                 </div>
                 <div class="an-li">
@@ -206,7 +256,7 @@ export default {
                   </div>
                   <div class="bteen-box">
                     <div style="color: #646262">部署时间:xxxx年</div>
-                    <el-link :underline="false" style="color: #3d8dce">查看详情</el-link>
+                    <el-link :underline="false" style="color: #3d8dce" title="查看详情">查看详情</el-link>
                   </div>
                 </div>
                 <div class="an-li">
@@ -222,17 +272,17 @@ export default {
                   </div>
                   <div class="bteen-box">
                     <div style="color: #646262">部署时间:xxxx年</div>
-                    <el-link :underline="false" style="color: #3d8dce">查看详情</el-link>
+                    <el-link :underline="false" style="color: #3d8dce" title="查看详情">查看详情</el-link>
                   </div>
                 </div>
               </div>
             </div>
             <div class="an-nu">
-              <el-button class="an-nu-1">查看更多案例</el-button>
+              <el-button class="an-nu-1" title="查看案例">查看更多案例</el-button>
             </div>
           </div>
           <!--  -->
-          <div class="dt-mk" id="lx-mk">
+          <div class="dt-mk" id="dt-mk">
             <div>
               <div class="em-4">最新动态</div>
               <div class="em-5">了解公司最新资讯与行业洞察。</div>
@@ -250,9 +300,9 @@ export default {
                       本次峰会汇聚行业专家，深入探讨数字化转型趋势与实践经验，共同展望为了发展方向。
                     </div>
                     <div class="xq-1">
-                      <el-link :underline="false" style="color: #2d3fdd"
+                      <el-link :underline="false" style="color: #2d3fdd">查看详情<el-icon>
-                        >查看详情<el-icon><Right /></el-icon
+                          <Right />
-                      ></el-link>
+                        </el-icon></el-link>
                     </div>
                   </div>
                 </div>
@@ -269,9 +319,9 @@ export default {
                       本次峰会汇聚行业专家，深入探讨数字化转型趋势与实践经验，共同展望为了发展方向。
                     </div>
                     <div class="xq-1">
-                      <el-link :underline="false" style="color: #2d3fdd"
+                      <el-link :underline="false" style="color: #2d3fdd">查看详情<el-icon>
-                        >查看详情<el-icon><Right /></el-icon
+                          <Right />
-                      ></el-link>
+                        </el-icon></el-link>
                     </div>
                   </div>
                 </div>
@@ -288,9 +338,9 @@ export default {
                       本次峰会汇聚行业专家，深入探讨数字化转型趋势与实践经验，共同展望为了发展方向。
                     </div>
                     <div class="xq-1">
-                      <el-link :underline="false" style="color: #2d3fdd"
+                      <el-link :underline="false" style="color: #2d3fdd">查看详情<el-icon>
-                        >查看详情<el-icon><Right /></el-icon
+                          <Right />
-                      ></el-link>
+                        </el-icon></el-link>
                     </div>
                   </div>
                 </div>
@@ -308,13 +358,19 @@ export default {
                 </div>
                 <div>
                   <div class="fan-wb3">
-                    <el-icon class="tb"><CircleCheckFilled /></el-icon>智能风控系统
+                    <el-icon class="tb">
+                      <CircleCheckFilled />
+                    </el-icon>智能风控系统
                   </div>
                   <div class="fan-wb3">
-                    <el-icon class="tb"><CircleCheckFilled /></el-icon>数据分析平台
+                    <el-icon class="tb">
+                      <CircleCheckFilled />
+                    </el-icon>数据分析平台
                   </div>
                   <div class="fan-wb3">
-                    <el-icon class="tb"><CircleCheckFilled /></el-icon>客户画像系统
+                    <el-icon class="tb">
+                      <CircleCheckFilled />
+                    </el-icon>客户画像系统
                   </div>
                 </div>
               </div>
@@ -322,48 +378,57 @@ export default {
             </div>
           </div>
           <!--  -->
-          <div class="lx-mk">
+          <div class="lx-mk" id="lx-mk">
+            <form @submit.prevent="submitForm">
               <div class="lx-left">
-              <div class="lx-wb">联系我们</div>
+                <span class="lx-wb">联系我们</span>
-              <form @submit.prevent="handleSubmit">
+                <div class="inputBox">
-                <div>
                   <div class="lx-wb-1">姓名</div>
-                  <input type="text" placeholder="请输⼊您的姓名" class="align-placeholder" />
+                  <input type="text" placeholder="请输⼊您的姓名" v-model="form.input1"
+                    @keydown.enter.prevent="focusNext('input2')" ref="input1">
                 </div>
-                <div>
+                <div class="inputBox">
                   <div class="lx-wb-1">邮箱</div>
-                  <input type="text" placeholder="请输⼊您的邮箱" class="align-placeholder-1" />
+                  <input type="text" placeholder="请输⼊您的邮箱" v-model="form.input2"
+                    @keydown.enter.prevent="focusNext('input3')" ref="input2">
+                  <span></span>
                 </div>
-                <div>
+
+                <div class="inputBox">
                   <div class="lx-wb-1">需求描述</div>
-                  <textarea
+                  <textarea type="text" placeholder="请详细描述您的需求" class="align-placeholder" v-model="form.input3"
-                    type="text"
+                    @keydown.enter.prevent="focusNext('submitBtn')" ref="input3"></textarea>
-                    placeholder="请详细描述您的需求"
+
-                    class="align-placeholder"
+                </div>
-                  ></textarea>
+                <div><button type="submit" class="tij" ref="submitBtn" @keydown.enter.prevent="submitForm">提交</button>
+                </div>
               </div>
-                <button type="submit" class="tij" @click="tij">提交</button>
             </form>
-            </div>
             <div class="lx-right">
               <div class="lx-right-haed">
                 <div class="lx-wb-2">联系方式</div>
                 <div class="lx-wb-3">
-                  <el-icon class="lx-tb-1"><PhoneFilled /></el-icon>
+                  <el-icon class="lx-tb-1">
+                    <PhoneFilled />
+                  </el-icon>
                   <div>
                     <div>电话</div>
                     <div class="lx-dh">400-888-8888</div>
                   </div>
                 </div>
                 <div class="lx-wb-3">
-                  <el-icon class="lx-tb-1"><Message /></el-icon>
+                  <el-icon class="lx-tb-1">
+                    <Message />
+                  </el-icon>
                   <div>
                     <div>邮箱</div>
                     <div class="lx-dh">huiqing@huiqing-cd.com</div>
                   </div>
                 </div>
                 <div class="lx-wb-3">
-                  <el-icon class="lx-tb-1"><LocationInformation /></el-icon>
+                  <el-icon class="lx-tb-1">
+                    <LocationInformation />
+                  </el-icon>
                   <div>
                     <div>地址</div>
                     <div class="lx-dh">四川成都</div>
@@ -371,10 +436,15 @@ export default {
                 </div>
               </div>
               <div class="lx-right-foot">
-                <div class="fan-right"><img class="img-8" :src="imagePath.s1" alt="tb1" /></div>
+                <div class="fan-right"><img class="img-8" :src="imagePath.dt" alt="dt" title="点击查看详细位置" /></div>
               </div>
             </div>
           </div>
+          <el-backtop :right="100" :bottom="100" style="
+        height: 50px;
+        width: 50px;
+         color: #2d3fdd;
+         " />
         </el-main>
         <FootView></FootView>
       </el-container>
@@ -382,20 +452,60 @@ export default {
   </div>
 </template>
 <style scoped>
+.align-placeholder {
+  width: 100%;
+  padding: 10px;
+  border: 1px solid rgba(255, 255, 255, 0.25);
+  color: #0c0c0c;
+  font-size: 16px;
+  border-radius: 5px;
+  outline: none;
+  font-size: 15px;
+  min-height: 100px;
+}
+
+.inputBox {
+  position: relative;
+  width: 550px;
+
+}
+
+.inputBox input {
+  width: 100%;
+  padding: 10px;
+  border: 1px solid rgba(255, 255, 255, 0.25);
+  color: #0c0c0c;
+  font-size: 16px;
+  border-radius: 5px;
+  outline: none;
+  font-size: 18px;
+}
+
+
+.fw-box:hover {
+  background-color: #fff;
+  transform: scale(1.2);
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
 .tij {
-  min-width: 605px;
+  min-width: 570px;
   color: #fff;
   background-color: #2c4cdb;
   border: none;
   height: 40px;
   border-radius: 3px;
+  transition: transform 0.1s;
 }
-.align-placeholder-1::placeholder {
+
-  padding-left: 10px;
+.tij:hover {
-}
+  transform: scale(0.99)
-.align-placeholder::placeholder {
-  padding-left: 10px;
 }
+
+
+
+
+
 form textarea {
   width: 600px;
   height: 150px;
@@ -405,14 +515,8 @@ form textarea {
   border-radius: 3px;
   margin-bottom: 20px;
 }
-form input {
+
-  width: 600px;
+
-  border: none;
-  height: 25px;
-  outline: none;
-  border-radius: 3px;
-  margin-bottom: 20px;
-}
 .dhl-x a {
   text-decoration: none;
   color: inherit;
@@ -424,17 +528,25 @@ form input {
   justify-content: space-around;
   height: 700px;
 }
+
 .img-8 {
   min-width: 600px;
-  height: 300px;
+  height: 250px;
   border-radius: 10px;
+  transition: transform 0.4s ease
 }
+
+.img-8:hover {
+  transform: scale(1.05)
+}
+
 .lx-tb-1 {
   font-size: 25px;
   color: #2d3fdd;
 
   margin-right: 5px;
 }
+
 .lx-wb-3 {
   margin-left: 20px;
   display: flex;
@@ -443,11 +555,13 @@ form input {
 .lx-dh {
   font-weight: bold;
 }
+
 .lx-wb-2 {
   font-size: 20px;
   font-weight: bold;
   margin-left: 20px;
 }
+
 .lx-right-haed {
   display: flex;
   flex-direction: column;
@@ -459,9 +573,13 @@ form input {
 
   border-radius: 15px;
 }
+
 .lx-wb-1 {
-  margin-bottom: 10px;
+  margin-bottom: 5px;
+  margin-top: 10px;
+  font-size: 19px;
 }
+
 .lx-left {
   display: flex;
   flex-direction: column;
@@ -474,6 +592,7 @@ form input {
   font-size: 25px;
   font-weight: bold;
 }
+
 .lx-mk {
   display: flex;
   justify-content: space-around;
@@ -482,37 +601,49 @@ form input {
   background-color: #f7f6f6;
   flex-wrap: wrap;
 }
+
 .tb {
   color: #2d3fdd;
   margin-right: 15px;
 }
+
 .fan-bt {
   text-align: center;
   font-weight: bold;
   font-size: 30px;
 }
+
 .img-7 {
   min-width: 500px;
   height: 300px;
   box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
   border-radius: 10px;
+  transition: transform 0.3s ease
 }
+
+.img-7:hover {
+  transform: scale(1.1);
+}
+
 .fan-nr {
   display: flex;
   justify-content: space-around;
   flex-wrap: wrap;
 }
+
 .fan-left {
   display: flex;
   flex-direction: column;
   justify-content: space-around;
   height: 300px;
 }
+
 .fan-wb1 {
   font-size: 20px;
   font-weight: bold;
   margin-top: 20px;
 }
+
 .fan-wb2 {
   margin-top: 10px;
   font-weight: 100;
@@ -520,12 +651,14 @@ form input {
   letter-spacing: 1px;
   width: 600px;
 }
+
 .fan-wb3 {
   margin-top: 10px;
   font-weight: bold;
   line-height: 1.5;
   letter-spacing: 2px;
 }
+
 .fan-mk {
   display: flex;
   flex-direction: column;
@@ -533,22 +666,27 @@ form input {
   margin-top: 80px;
   min-height: 500px;
 }
+
 .dt-box {
   display: flex;
   justify-content: space-around;
   flex-wrap: wrap;
 }
+
 .fbt-2 {
   color: #272626;
 }
+
 .fbt-1 {
   font-size: 20px;
   font-weight: bold;
   margin-bottom: 15px;
 }
+
 .shij {
   color: #a19f9f;
 }
+
 .xq-1 {
   display: flex;
 }
@@ -563,15 +701,18 @@ form input {
   line-height: 1.5;
   letter-spacing: 2px;
 }
+
 .img {
   display: flex;
   align-items: center;
   justify-content: center;
 }
+
 .bt-nr {
   display: flex;
   flex-direction: column;
 }
+
 .dt-bj {
   display: flex;
   width: 450px;
@@ -586,37 +727,49 @@ form input {
   flex-direction: column;
   min-height: 700px;
 }
+
 .img-4 {
   margin-top: 20px;
   height: 250px;
   border-radius: 10px;
+  transition: transform 0.3s ease;
 }
+
+.img-4:hover {
+  transform: scale(1.05)
+}
+
 .an-nu-1 {
   width: 200px;
   height: 50px;
 }
+
 .an-nu {
   display: flex;
   justify-content: center;
   padding: 10px 0px;
 }
+
 .an-ls-body {
   display: flex;
   justify-content: space-around;
 
   flex-wrap: wrap;
 }
+
 .em-5 {
   text-align: center;
   margin-top: 20px;
   font-weight: 100;
 }
+
 .em-4 {
   text-align: center;
   font-weight: bold;
   font-size: 30px;
   margin-top: 50px;
 }
+
 .bk-2 {
   min-height: 700px;
   background-color: #f7f6f6;
@@ -624,11 +777,13 @@ form input {
   flex-direction: column;
   justify-content: space-around;
 }
+
 .bteen-box {
   display: flex;
   justify-content: space-between;
   margin-left: 20px;
 }
+
 .chenter-box {
   margin-left: 20px;
   margin-right: 30px;
@@ -636,6 +791,7 @@ form input {
   font-weight: 100;
   letter-spacing: 2px;
 }
+
 .sys {
   margin-left: 10px;
   display: flex;
@@ -649,6 +805,7 @@ form input {
   height: 55px;
   margin-top: 20px;
 }
+
 .an-li {
   display: flex;
   flex-direction: column;
@@ -659,13 +816,22 @@ form input {
   border-radius: 8px;
   box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
   background-color: #fff;
+  transition: all 0.3s ease;
 }
+
+.an-li:hover {
+  background-color: #fff;
+  transform: scale(1.1);
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
 .rgzn {
   margin-left: 20px;
   margin-top: 30px;
   font-size: 20px;
   font-weight: bold;
 }
+
 .tgfw {
   margin-left: 20px;
   margin-top: 25px;
@@ -675,11 +841,13 @@ form input {
   font-weight: 100;
   margin-right: 10px;
 }
+
 .fw {
   display: flex;
   justify-content: space-around;
   flex-wrap: wrap;
 }
+
 .fw-box {
   width: 330px;
   height: 280px;
@@ -689,26 +857,32 @@ form input {
   letter-spacing: 2px;
   margin-top: 40px;
   margin-bottom: 40px;
+  transition: all 0.3s ease;
 }
+
 .img-2 {
   width: 55px;
   height: 55px;
   margin-left: 20px;
 }
+
 .an-5 {
   margin-left: -20px;
   margin-top: 20px;
   width: 100px;
 }
+
 .sj-2 {
   margin-top: 15px;
 }
+
 .em-8 {
   margin-top: 30px;
   width: 390px;
   line-height: 1.5;
   font-size: 15px;
 }
+
 .bt-3 {
   margin-top: 15px;
   font-weight: bold;
@@ -721,17 +895,21 @@ form input {
   margin-left: 115px;
   box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.2);
 }
+
 .bk-3 {
   margin-top: 100px;
 }
+
 .sj-1 {
   margin-top: 20px;
   margin-left: 30px;
 }
+
 .img-3 {
   margin-top: 25px;
   margin-left: 30px;
 }
+
 .em-7 {
   margin-left: 30px;
   margin-top: 35px;
@@ -739,10 +917,12 @@ form input {
   line-height: 1.7;
   width: 350px;
 }
+
 .wb-1 {
   margin-left: 110px;
   margin-top: 8px;
 }
+
 .bk-2-2 {
   height: 230px;
   margin-top: 80px;
@@ -751,6 +931,7 @@ form input {
   padding: 20px;
   background-color: #f0f0f0;
 }
+
 .bt-2 {
   font-weight: bold;
   margin-top: -80px;
@@ -761,11 +942,13 @@ form input {
   width: 60px;
   height: 60px;
 }
+
 .bt-1 {
   margin-top: -70px;
   margin-left: 30px;
   font-size: 25px;
 }
+
 .em-6 {
   margin-top: 40px;
   margin-left: 30px;
@@ -773,28 +956,33 @@ form input {
   width: 260px;
   line-height: 1.5;
 }
+
 .bk-1-1 {
   background-color: #dad3d3;
 
   height: 300px;
   margin-top: 80px;
   margin-left: 62px;
-  border-radius: 15px; /* 设置圆角 */
+  border-radius: 15px;
+  /* 设置圆角 */
   padding: 20px;
   background-color: #f0f0f0;
   box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
 }
+
 .bk-1 {
   background-color: #d1cfcf;
 
   height: 300px;
   margin-top: 70px;
   margin-left: 62px;
-  border-radius: 15px; /* 设置圆角 */
+  border-radius: 15px;
+  /* 设置圆角 */
   padding: 20px;
   background-color: #f0f0f0;
   box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
 }
+
 .bk {
   display: flex;
   flex-direction: column;
@@ -807,12 +995,15 @@ form input {
   position: absolute;
   top: 300px;
   left: 145px;
+
 }
+
 .an-2 {
   position: absolute;
   top: 300px;
   left: 280px;
 }
+
 .an-4 {
   margin-top: 90px;
   margin-left: -440px;
@@ -829,6 +1020,7 @@ form input {
   line-height: 1.2;
   letter-spacing: 2.5px;
 }
+
 .em-2 {
   position: absolute;
   width: 250px;
@@ -837,6 +1029,7 @@ form input {
   font-size: 40px;
   color: #fff;
 }
+
 .em-1 {
   margin-left: 5px;
   position: absolute;
@@ -845,6 +1038,7 @@ form input {
   font-size: 25px;
   font-weight: bold;
 }
+
 .dhl {
   width: 100%;
   height: 60px;
@@ -852,27 +1046,32 @@ form input {
   justify-content: space-around;
   align-items: center;
   background-color: #fff;
-  position: fixed;
+
-  z-index: 1;
+
 }
+
 .el-link {
   margin-right: 25px;
   float: right;
   color: #000;
 }
+
 .dhl-x {
   display: flex;
   gap: 20px;
   margin-right: 100px;
 }
+
 .dhl-yt {
   color: black;
   transition: color 0.3s;
 }
+
 .dhl-yt:hover {
   color: rgb(56, 84, 195);
   cursor: pointer;
 }
+
 .carousel {
   position: relative;
   width: 100%;
@@ -926,6 +1125,7 @@ form input {
 .sys-title {
   font-size: 30px;
   font-weight: 600;
+  cursor: default;
 }
 
 .right-box {