hookehuyr

产品页面banner样式调整

1 <!-- 1 <!--
2 * @Date: 2024-09-27 16:53:09 2 * @Date: 2024-09-27 16:53:09
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-11-11 09:28:03 4 + * @LastEditTime: 2024-11-11 13:11:45
5 * @FilePath: /hager/src/views/product/index.vue 5 * @FilePath: /hager/src/views/product/index.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
20 </div> 20 </div>
21 </hager-box> 21 </hager-box>
22 <hager-box v-if="!is_xs && !is_search" :class="['top-img', is_xs ? 'xs' : '']" :style="{ backgroundImage: `url('https://cdn.ipadbiz.cn/hager/img/product/banner-l@2x.png'), url(${banner})`, marginTop: '1rem' }"> 22 <hager-box v-if="!is_xs && !is_search" :class="['top-img', is_xs ? 'xs' : '']" :style="{ backgroundImage: `url('https://cdn.ipadbiz.cn/hager/img/product/banner-l@2x.png'), url(${banner})`, marginTop: '1rem' }">
23 - <div class="banner-text-wrapper" style="margin-top: 5%;"> 23 + <div class="banner-text-wrapper" style="margin-top: 4%;">
24 <div class="text"> 24 <div class="text">
25 <p class="title" style="margin-bottom: 0; color: white; font-size: 2.2vw;">{{ category_name }}</p> 25 <p class="title" style="margin-bottom: 0; color: white; font-size: 2.2vw;">{{ category_name }}</p>
26 <p class="sub" style="color: white; font-size: 2.2vw;">{{ category_name_en }}</p> 26 <p class="sub" style="color: white; font-size: 2.2vw;">{{ category_name_en }}</p>
...@@ -161,7 +161,7 @@ export default { ...@@ -161,7 +161,7 @@ export default {
161 let img_width = $('.product-item-img img').outerWidth(); 161 let img_width = $('.product-item-img img').outerWidth();
162 $('.product-item-img img').css('height', img_width * 1 + 'px'); 162 $('.product-item-img img').css('height', img_width * 1 + 'px');
163 let banner_width = $('.top-img').outerWidth(); 163 let banner_width = $('.top-img').outerWidth();
164 - $('.top-img').css('height', banner_width * 0.21 + 'px'); 164 + $('.top-img').css('height', banner_width * 0.19 + 'px');
165 }) 165 })
166 }, 166 },
167 handleChange(val) { 167 handleChange(val) {
......