【无】公司网站-样式修改,首页，移动端 #6

@@ -4013,7 +4013,46 @@ blockquote:before {
 .tech-introCon-sm{
     display: none;
 }
+.section-item-sm-icon{
+    display: none;
+}
 @media only screen and (max-width: 768px){
+    .section-item-sm-icon{
+        display: block;
+        color: #333;
+    }
+    .compatible-section{
+        padding:30px 0;
+    }
+    .principle-section,.principle,.route-about-section{
+        padding-top:0;
+    }
+    .principle-section-item{
+        padding-top:10px;
+    }
+    .principle-section-item .mb-35{
+        margin-bottom: 0;
+    }
+    .section-item-sm{
+        display: flex;
+        flex: 1;
+        justify-content: space-between;
+    }
+    .section-item-sm-icon.section-item-active{
+        color:#e43730;
+    }
+    .team-item-left{
+        padding:20px;
+    }
+    .compatible-item{
+        padding:10px 0;
+    }
+    .title-icon{
+        padding:0;
+    }
+    .section-item{
+        display: none;
+    }
     .tech-item{
         max-width: 50%;
     }

@@ -138,30 +138,35 @@ export  function logoDatas(){
             id:'1',
             logoUrl:'logo-dong-default',
             logoUrlTip:'logo-dong',
+            name:'东方通',
             active:true
         },
         {
             id:'2',
             logoUrl:'logo-da-default',
             logoUrlTip:'logo-da',
+            name:'达梦数据库',
             active:false
         },
         {
             id:'3',
             logoUrl:'logo-nan-default',
             logoUrlTip:'logo-nan',
+            name:'南大通用',
             active:false
         },
         {
             id:'4',
             logoUrl:'logo-ren-default',
             logoUrlTip:'logo-ren',
+            name:'人大金仓',
             active:false
         },
         {
             id:'5',
             logoUrl:'logo-tong-default',
             logoUrlTip:'logo-tong',
+            name:'统信UOS',
             active:false
         }
     ]

@@ -73,9 +73,9 @@
         <img src="assets/img/shapes/shape1.png" alt="Shape">
     </div>
 </section>
-<section class="rel text-center pt-30 pb-30">
+<section class="rel text-center pt-30 pb-30 principle-section">
     <div class="container">
-        <div class="row align-items-center pt-30">
+        <div class="row align-items-center pt-30 principle-section-item">
             <div class="col-lg-12">
                 <div class=" mr-20 rmr-0 rmb-50  text-center">
                     <div class="mb-35">
@@ -117,7 +117,7 @@
 
     </div>
 </section>
-<section class="about-section rel pt-60">
+<section class="about-section rel pt-60 route-about-section">
     <div class="container">
         <div class="row align-items-center">
             <div class="col-lg-12">
@@ -151,7 +151,7 @@
     </div>
 
 </section>
-<section class="team-section rel pt-80 pb-80">
+<section class="team-section rel pt-80 pb-80 compatible-section">
     <div class="container">
         <div class="mb-35 pr-65  align-items-center flex-column-center">
             <div class="title-style">“魔镜智能”全面完成国产化兼容适配认证</div>
@@ -162,6 +162,9 @@
                 <img v-if="compatibleActive+1!=item.id" :src="'assets/img/index/'+item.logoUrl+'.png'" alt="">
                 <img v-if="compatibleActive+1==item.id" :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt="">
             </div>
+            <div class="section-item-sm">
+                <div :class="['section-item-sm-icon',{'section-item-active':compatibleActive==index}]" @mouseenter="showHoverCompatible(index)" @mouseleave="hideHoverCompatible()"  v-for="(item,index) in logoData">{{item.name}}</div>
+            </div>
         </div>
 <!--        <div class="team-carousel owl-carousel text-center" ref="teamCarousel">-->
         <div class="compatible-carousel text-center" >