【无】公司网站-样式修改,首页,移动端 #6
Showing
3 changed files
with
51 additions
and
4 deletions
@@ -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" > |
-
Please register or login to post a comment