hookehuyr

fix 关于海格相关页面标题大小样式调整

1 <!-- 1 <!--
2 * @Date: 2024-09-29 10:07:11 2 * @Date: 2024-09-29 10:07:11
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-16 11:57:09 4 + * @LastEditTime: 2024-10-22 11:38:03
5 * @FilePath: /hager/src/components/common/hagerH1.vue 5 * @FilePath: /hager/src/components/common/hagerH1.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
8 <template> 8 <template>
9 - <div :class="['hagerH1']"> 9 + <div class="hagerH1">
10 - <p class="h1">{{ title }}</p> 10 + <p :class="['h1', is_xs ? 'xs' : '']">{{ title }}</p>
11 - <p class="sub">{{ sub }}</p> 11 + <p :class="['sub', , is_xs ? 'xs' : '']">{{ sub }}</p>
12 </div> 12 </div>
13 </template> 13 </template>
14 14
...@@ -52,18 +52,23 @@ export default { ...@@ -52,18 +52,23 @@ export default {
52 52
53 <style lang="less" scoped> 53 <style lang="less" scoped>
54 .hagerH1 { 54 .hagerH1 {
55 - // &.xs {
56 - // padding: 0 1rem;
57 - // }
58 .h1 { 55 .h1 {
59 color: @secondary-color; 56 color: @secondary-color;
60 font-size: 1.9rem; 57 font-size: 1.9rem;
61 font-weight: bold; 58 font-weight: bold;
59 +
60 + &.xs {
61 + font-size: 1.5rem;
62 + }
62 } 63 }
63 .sub { 64 .sub {
64 color: @primary-color; 65 color: @primary-color;
65 font-size: 1.7rem; 66 font-size: 1.7rem;
66 font-weight: bold; 67 font-weight: bold;
68 +
69 + &.xs {
70 + font-size: 1rem;
71 + }
67 } 72 }
68 } 73 }
69 </style> 74 </style>
......
1 <!-- 1 <!--
2 * @Date: 2024-10-17 11:13:44 2 * @Date: 2024-10-17 11:13:44
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-21 17:17:55 4 + * @LastEditTime: 2024-10-22 11:35:17
5 * @FilePath: /hager/src/views/about/china.vue 5 * @FilePath: /hager/src/views/about/china.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -45,8 +45,8 @@ ...@@ -45,8 +45,8 @@
45 <div class="about-box-wrapper xs"> 45 <div class="about-box-wrapper xs">
46 <div class="about-box xs"> 46 <div class="about-box xs">
47 <div class="title"> 47 <div class="title">
48 - <p class="c">海格电气在中国</p> 48 + <p class="c xs">海格电气在中国</p>
49 - <p class="e">Hager in China</p> 49 + <p class="e xs">Hager in China</p>
50 </div> 50 </div>
51 <div class="introduce" v-clamp="3"> 51 <div class="introduce" v-clamp="3">
52 <p>唯有匠心,不负初心。<br/>专注为你,彼此成就!</p> 52 <p>唯有匠心,不负初心。<br/>专注为你,彼此成就!</p>
...@@ -121,10 +121,16 @@ export default { ...@@ -121,10 +121,16 @@ export default {
121 .c { 121 .c {
122 font-size: 2rem; 122 font-size: 2rem;
123 color: @secondary-color; 123 color: @secondary-color;
124 + &.xs {
125 + font-size: 1.5rem;
126 + }
124 } 127 }
125 .e { 128 .e {
126 font-size: 1.5rem; 129 font-size: 1.5rem;
127 color: @primary-color; 130 color: @primary-color;
131 + &.xs {
132 + font-size: 1.1rem;
133 + }
128 } 134 }
129 } 135 }
130 .introduce { 136 .introduce {
......
1 <!-- 1 <!--
2 * @Date: 2024-10-17 11:13:44 2 * @Date: 2024-10-17 11:13:44
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-22 10:05:52 4 + * @LastEditTime: 2024-10-22 11:38:36
5 * @FilePath: /hager/src/views/about/design.vue 5 * @FilePath: /hager/src/views/about/design.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -39,10 +39,10 @@ ...@@ -39,10 +39,10 @@
39 <div class="about-img"></div> 39 <div class="about-img"></div>
40 <div class="about-box xs"> 40 <div class="about-box xs">
41 <div> 41 <div>
42 - <div class="title"> 42 + <!-- <div class="title">
43 <p class="c">创新设计</p> 43 <p class="c">创新设计</p>
44 <p class="e">Innovative Design</p> 44 <p class="e">Innovative Design</p>
45 - </div> 45 + </div> -->
46 <div class="introduce" v-clamp="3"> 46 <div class="introduce" v-clamp="3">
47 <p>海格电气一直致力于创新,<br/>我们与客户共同着手面向未来的主题。</p> 47 <p>海格电气一直致力于创新,<br/>我们与客户共同着手面向未来的主题。</p>
48 </div> 48 </div>
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
50 </div> 50 </div>
51 </div> 51 </div>
52 <hager-box class="box-2n"> 52 <hager-box class="box-2n">
53 - <hager-h1 title="从产品到解决方案" sub="From Products to Solutions" style="margin: 2rem 0;"></hager-h1> 53 + <hager-h1 title="从产品到解决方案" sub="From Products to Solutions" style="margin: 1rem 0;"></hager-h1>
54 <div> 54 <div>
55 <swiper ref="myDesignSwiper" class="swiper" :options="swiperOption" @slideChange="onDesignSlideChange"> 55 <swiper ref="myDesignSwiper" class="swiper" :options="swiperOption" @slideChange="onDesignSlideChange">
56 <swiper-slide v-for="(item, index) in design_list" :key="index"> 56 <swiper-slide v-for="(item, index) in design_list" :key="index">
...@@ -158,7 +158,7 @@ export default { ...@@ -158,7 +158,7 @@ export default {
158 spaceBetween: 20 158 spaceBetween: 20
159 }, 159 },
160 640: { 160 640: {
161 - slidesPerView: 1, 161 + slidesPerView: 2,
162 spaceBetween: 20 162 spaceBetween: 20
163 }, 163 },
164 320: { 164 320: {
......
1 <!-- 1 <!--
2 * @Date: 2024-10-17 11:13:44 2 * @Date: 2024-10-17 11:13:44
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-21 17:16:51 4 + * @LastEditTime: 2024-10-22 11:33:06
5 * @FilePath: /hager/src/views/about/global.vue 5 * @FilePath: /hager/src/views/about/global.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -43,8 +43,8 @@ ...@@ -43,8 +43,8 @@
43 <div class="about-box-wrapper xs"> 43 <div class="about-box-wrapper xs">
44 <div class="about-box xs"> 44 <div class="about-box xs">
45 <div class="title"> 45 <div class="title">
46 - <p class="c">海格全球</p> 46 + <p class="c xs">海格全球</p>
47 - <p class="e">Hager Group</p> 47 + <p class="e xs">Hager Group</p>
48 </div> 48 </div>
49 <div class="introduce" v-clamp="3">海格集团是全球领先的电气及智能化解决方案和服务提供商,应用领域涵盖住宅、商业建筑、公共建筑和工业。</div> 49 <div class="introduce" v-clamp="3">海格集团是全球领先的电气及智能化解决方案和服务提供商,应用领域涵盖住宅、商业建筑、公共建筑和工业。</div>
50 </div> 50 </div>
...@@ -116,10 +116,16 @@ export default { ...@@ -116,10 +116,16 @@ export default {
116 .c { 116 .c {
117 font-size: 2rem; 117 font-size: 2rem;
118 color: @secondary-color; 118 color: @secondary-color;
119 + &.xs {
120 + font-size: 1.5rem;
121 + }
119 } 122 }
120 .e { 123 .e {
121 font-size: 1.5rem; 124 font-size: 1.5rem;
122 color: @primary-color; 125 color: @primary-color;
126 + &.xs {
127 + font-size: 1.1rem;
128 + }
123 } 129 }
124 } 130 }
125 .introduce { 131 .introduce {
......
...@@ -52,8 +52,8 @@ ...@@ -52,8 +52,8 @@
52 <div class="about-img xs" :style="{ 'background-image': 'url('+ item.img +')' }"></div> 52 <div class="about-img xs" :style="{ 'background-image': 'url('+ item.img +')' }"></div>
53 <div class="about-box"> 53 <div class="about-box">
54 <div class="title"> 54 <div class="title">
55 - <p class="c">{{ item.c_title }}</p> 55 + <p class="c xs">{{ item.c_title }}</p>
56 - <p class="e">{{ item.e_title }}</p> 56 + <p class="e xs">{{ item.e_title }}</p>
57 </div> 57 </div>
58 <div class="introduce" v-clamp="3">{{ item.content }}</div> 58 <div class="introduce" v-clamp="3">{{ item.content }}</div>
59 <div class="more"> 59 <div class="more">
...@@ -161,10 +161,16 @@ export default { ...@@ -161,10 +161,16 @@ export default {
161 .c { 161 .c {
162 font-size: 2rem; 162 font-size: 2rem;
163 color: @secondary-color; 163 color: @secondary-color;
164 + &.xs {
165 + font-size: 1.5rem;
166 + }
164 } 167 }
165 .e { 168 .e {
166 font-size: 1.5rem; 169 font-size: 1.5rem;
167 color: @primary-color; 170 color: @primary-color;
171 + &.xs {
172 + font-size: 1.1rem;
173 + }
168 } 174 }
169 } 175 }
170 .introduce { 176 .introduce {
......
1 <!-- 1 <!--
2 * @Date: 2024-10-17 11:13:44 2 * @Date: 2024-10-17 11:13:44
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-10-22 11:26:47 4 + * @LastEditTime: 2024-10-22 11:32:04
5 * @FilePath: /hager/src/views/about/product.vue 5 * @FilePath: /hager/src/views/about/product.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
......