首页样式修改

assets/scss/cus-client/cus-client-page.scss

@@ -165,8 +165,12 @@
             @include setFontStyle(-6);
             h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);text-align: center;margin-bottom: 16px;}
             p{line-height: 22px;color: rgba(0,0,0,0.65);margin-bottom: 70px;text-align: justify;@include multi-line-ellipsis(6);}
+            .products-btn-box{display: flex;width: 100%;justify-content: center;}
             a,div,span{width: 120px;height: 32px;display:inline-block;line-height: 32px;opacity:0;margin-right: 24px}
-            span{background: transparent;color: #2B5CFD;margin-right: 0}
+            span{
+              width:auto;background: transparent;color: #2B5CFD;margin-right: 0;
+              i{width: 8px;height: 8px;display:inline-block;margin-left: 8px; background-image: url("~static/images/client/index/index-products-icon.svg");}
+            }
           }
         }
         li:nth-child(1){
@@ -213,6 +217,7 @@
             box-shadow: 0 4px 8px 0 rgba(214,214,214,0.76);
             border-radius: 8px;
             a,div,span{opacity: 1;}
+            span{color: #2249C9;cursor: pointer}
           }
         }
     }
@@ -295,27 +300,6 @@
         img{width: 48px;height: 48px;border-radius: 4px;display: block;margin: 0 auto}
         span{@include setFontStyle(-6);color: rgba(255,255,255,0.65);margin-top: 8px;}
       }
-      // 行业ul
-      /*.industry-box{
-        margin-top: 10px;
-        li{
-          width: 25%;display: inline-block;margin-top: 38px;height: 112px;overflow: hidden;
-          img{margin: 0 auto;display: block;transition: all .2s linear;}
-          div{transition: all .25s linear;text-align: center;}
-          h5{@include setFontStyle(-2);color: rgba(0,0,0,0.85);text-align: center;margin: 18px 0 10px;}
-          p{@include setFontStyle(-6);color: rgba(0,0,0,0.65);line-height: 22px;margin: 0 8px 8px;min-height: 48px;@include multi-line-ellipsis(2);max-height: 48px;}
-          a{@include setFontStyle(-6);display: block;color: #2B5CFD;margin: 0 auto;transition: .3s all linear;}
-        }
-        a:hover{cursor: pointer;color: #2249C9;}
-        li:hover:not(:last-child) {
-          img{opacity: 0;transform: translateY(10px);}
-          div{margin-top: -147px}
-          h5{@include setFontStyle(-2);margin-top: 90px;}
-        }
-        li:last-child:hover{
-          cursor: pointer;
-        }
-      }*/
     }
 
     /* 超过10万家客户的信任之选 */

pages/index.vue

@@ -64,7 +64,7 @@
             <div class="products-services-content">
               <h5>考试系统</h5>
               <p>麦塔考试平台满足不同行业考试考核需求：教育机构出题判卷、课后练习布置；企事业单位企业文化、业务水平提升</p>
-              <a class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=1" target="_blank">免费试用</a><span @click="goExamPage">了解详情<i></i></span>
+              <div class="products-btn-box"><a class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=1" target="_blank">免费试用</a><span @click="goExamPage">了解详情<i></i></span></div>
             </div>
           </li>
           <li>
@@ -72,7 +72,7 @@
             <div class="products-services-content">
               <h5>培训系统</h5>
               <p>麦塔培训平台满足企业全流程培训场景，支持移动web端、PC端、APP端答题和学习，多种学习模式保障学习效果，结果及时反馈</p>
-              <a class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">免费试用</a><span @click="goPeixunPage">了解详情<i></i></span>
+              <div class="products-btn-box"><a class="client-default-Btn" href="https://cdnks.mtavip.com/a/register?flug=2" target="_blank">免费试用</a><span @click="goPeixunPage">了解详情<i></i></span></div>
             </div>
           </li>
           <li>
@@ -80,7 +80,7 @@
             <div class="products-services-content">
               <h5>课件制作</h5>
               <p>麦塔能够快速搭建企业单位、教育机构学习资源库，满足学习平台需求，针对目标对象的学习习惯和学习方式个性化开发课程</p>
-              <div class="client-default-Btn" @click="applyFun">申请方案</div><span @click="goKechengPage">了解详情<i></i></span>
+              <div class="products-btn-box"><div class="client-default-Btn" @click="applyFun">申请方案</div><span @click="goKechengPage">了解详情<i></i></span></div>
             </div>
           </li>
         </ul>

static/images/client/index/index-products-icon.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8">
+  <g fill="#2B5CFD" opacity=".8">
+    <path d="M3.8611022,7.13508541 C3.9785763,7.26047141 4.02633893,7.44784825 3.98581816,7.62435666 C3.94529739,7.80086507 3.82288751,7.93865151 3.66618616,7.98413934 C3.50948481,8.02962718 3.34321992,7.97563831 3.23204162,7.84316565 L0.131038778,4.34934871 C0.0471731967,4.25563126 0,4.1280591 0,3.99497585 C0,3.8618926 0.0471731967,3.73432043 0.131038778,3.64060299 L3.23204162,0.14678604 C3.40575191,-0.0489286821 3.68739192,-0.0489286797 3.8611022,0.146786045 C4.03481248,0.342500771 4.03481248,0.659817035 3.8611022,0.855531763 L1.07019964,3.99530859 L3.8611022,7.13441993 L3.8611022,7.13508541 Z" transform="matrix(-1 0 0 1 4 0)"/>
+    <path d="M7.8611022,7.13508541 C7.9785763,7.26047141 8.02633893,7.44784825 7.98581816,7.62435666 C7.94529739,7.80086507 7.82288751,7.93865151 7.66618616,7.98413934 C7.50948481,8.02962718 7.34321992,7.97563831 7.23204162,7.84316565 L4.13103878,4.34934871 C4.0471732,4.25563126 4,4.1280591 4,3.99497585 C4,3.8618926 4.0471732,3.73432043 4.13103878,3.64060299 L7.23204162,0.14678604 C7.40575191,-0.0489286821 7.68739192,-0.0489286797 7.8611022,0.146786045 C8.03481248,0.342500771 8.03481248,0.659817035 7.8611022,0.855531763 L5.07019964,3.99530859 L7.8611022,7.13441993 L7.8611022,7.13508541 Z" transform="matrix(-1 0 0 1 12 0)"/>
+  </g>
+</svg>