Authored by 鲁尚清

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

@@ -4013,7 +4013,46 @@ blockquote:before { @@ -4013,7 +4013,46 @@ blockquote:before {
4013 .tech-introCon-sm{ 4013 .tech-introCon-sm{
4014 display: none; 4014 display: none;
4015 } 4015 }
  4016 +.section-item-sm-icon{
  4017 + display: none;
  4018 +}
4016 @media only screen and (max-width: 768px){ 4019 @media only screen and (max-width: 768px){
  4020 + .section-item-sm-icon{
  4021 + display: block;
  4022 + color: #333;
  4023 + }
  4024 + .compatible-section{
  4025 + padding:30px 0;
  4026 + }
  4027 + .principle-section,.principle,.route-about-section{
  4028 + padding-top:0;
  4029 + }
  4030 + .principle-section-item{
  4031 + padding-top:10px;
  4032 + }
  4033 + .principle-section-item .mb-35{
  4034 + margin-bottom: 0;
  4035 + }
  4036 + .section-item-sm{
  4037 + display: flex;
  4038 + flex: 1;
  4039 + justify-content: space-between;
  4040 + }
  4041 + .section-item-sm-icon.section-item-active{
  4042 + color:#e43730;
  4043 + }
  4044 + .team-item-left{
  4045 + padding:20px;
  4046 + }
  4047 + .compatible-item{
  4048 + padding:10px 0;
  4049 + }
  4050 + .title-icon{
  4051 + padding:0;
  4052 + }
  4053 + .section-item{
  4054 + display: none;
  4055 + }
4017 .tech-item{ 4056 .tech-item{
4018 max-width: 50%; 4057 max-width: 50%;
4019 } 4058 }
@@ -138,30 +138,35 @@ export function logoDatas(){ @@ -138,30 +138,35 @@ export function logoDatas(){
138 id:'1', 138 id:'1',
139 logoUrl:'logo-dong-default', 139 logoUrl:'logo-dong-default',
140 logoUrlTip:'logo-dong', 140 logoUrlTip:'logo-dong',
  141 + name:'东方通',
141 active:true 142 active:true
142 }, 143 },
143 { 144 {
144 id:'2', 145 id:'2',
145 logoUrl:'logo-da-default', 146 logoUrl:'logo-da-default',
146 logoUrlTip:'logo-da', 147 logoUrlTip:'logo-da',
  148 + name:'达梦数据库',
147 active:false 149 active:false
148 }, 150 },
149 { 151 {
150 id:'3', 152 id:'3',
151 logoUrl:'logo-nan-default', 153 logoUrl:'logo-nan-default',
152 logoUrlTip:'logo-nan', 154 logoUrlTip:'logo-nan',
  155 + name:'南大通用',
153 active:false 156 active:false
154 }, 157 },
155 { 158 {
156 id:'4', 159 id:'4',
157 logoUrl:'logo-ren-default', 160 logoUrl:'logo-ren-default',
158 logoUrlTip:'logo-ren', 161 logoUrlTip:'logo-ren',
  162 + name:'人大金仓',
159 active:false 163 active:false
160 }, 164 },
161 { 165 {
162 id:'5', 166 id:'5',
163 logoUrl:'logo-tong-default', 167 logoUrl:'logo-tong-default',
164 logoUrlTip:'logo-tong', 168 logoUrlTip:'logo-tong',
  169 + name:'统信UOS',
165 active:false 170 active:false
166 } 171 }
167 ] 172 ]
@@ -73,9 +73,9 @@ @@ -73,9 +73,9 @@
73 <img src="assets/img/shapes/shape1.png" alt="Shape"> 73 <img src="assets/img/shapes/shape1.png" alt="Shape">
74 </div> 74 </div>
75 </section> 75 </section>
76 -<section class="rel text-center pt-30 pb-30"> 76 +<section class="rel text-center pt-30 pb-30 principle-section">
77 <div class="container"> 77 <div class="container">
78 - <div class="row align-items-center pt-30"> 78 + <div class="row align-items-center pt-30 principle-section-item">
79 <div class="col-lg-12"> 79 <div class="col-lg-12">
80 <div class=" mr-20 rmr-0 rmb-50 text-center"> 80 <div class=" mr-20 rmr-0 rmb-50 text-center">
81 <div class="mb-35"> 81 <div class="mb-35">
@@ -117,7 +117,7 @@ @@ -117,7 +117,7 @@
117 117
118 </div> 118 </div>
119 </section> 119 </section>
120 -<section class="about-section rel pt-60"> 120 +<section class="about-section rel pt-60 route-about-section">
121 <div class="container"> 121 <div class="container">
122 <div class="row align-items-center"> 122 <div class="row align-items-center">
123 <div class="col-lg-12"> 123 <div class="col-lg-12">
@@ -151,7 +151,7 @@ @@ -151,7 +151,7 @@
151 </div> 151 </div>
152 152
153 </section> 153 </section>
154 -<section class="team-section rel pt-80 pb-80"> 154 +<section class="team-section rel pt-80 pb-80 compatible-section">
155 <div class="container"> 155 <div class="container">
156 <div class="mb-35 pr-65 align-items-center flex-column-center"> 156 <div class="mb-35 pr-65 align-items-center flex-column-center">
157 <div class="title-style">“魔镜智能”全面完成国产化兼容适配认证</div> 157 <div class="title-style">“魔镜智能”全面完成国产化兼容适配认证</div>
@@ -162,6 +162,9 @@ @@ -162,6 +162,9 @@
162 <img v-if="compatibleActive+1!=item.id" :src="'assets/img/index/'+item.logoUrl+'.png'" alt=""> 162 <img v-if="compatibleActive+1!=item.id" :src="'assets/img/index/'+item.logoUrl+'.png'" alt="">
163 <img v-if="compatibleActive+1==item.id" :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt=""> 163 <img v-if="compatibleActive+1==item.id" :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt="">
164 </div> 164 </div>
  165 + <div class="section-item-sm">
  166 + <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>
  167 + </div>
165 </div> 168 </div>
166 <!-- <div class="team-carousel owl-carousel text-center" ref="teamCarousel">--> 169 <!-- <div class="team-carousel owl-carousel text-center" ref="teamCarousel">-->
167 <div class="compatible-carousel text-center" > 170 <div class="compatible-carousel text-center" >