headline 7px question

src/components/CaseShow.vue

@@ -32,6 +32,8 @@ import HeadLine from 'cpns/HeadLine'
     grid-template-columns: repeat(2, 1fr);
     grid-template-rows: repeat(5, 1fr);
     column-gap: 7px;
+    padding: 0 7px;
+    box-sizing: border-box;
     row-gap: 7px;
     .card {
       height: 132px;

src/components/HeadLine.vue

@@ -4,8 +4,10 @@
       <span class="theme">{{ themeTitle }}</span
       >{{ title }}
     </h2>
-    <p class="line1" v-if="line1">{{ line1 }}</p>
-    <p class="line2" v-if="line2">{{ line2 }}</p>
+    <div class="scale">
+      <p class="line1" v-if="line1">{{ line1 }}</p>
+      <p class="line2" v-if="line2">{{ line2 }}</p>
+    </div>
   </div>
 </template>
 
@@ -46,22 +48,25 @@ const props = defineProps({
   .theme {
     color: #f94622;
   }
-  .line1 {
-    font-size: 7px;
-    font-family: Source Han Sans CN;
-    font-weight: 300;
-    color: #595959;
-    line-height: 16px;
-    text-align: center;
-  }
-  .line2 {
-    font-size: 7px;
-    font-family: Alibaba PuHuiTi;
-    font-weight: 300;
-    color: #595959;
-    text-align: center;
-    line-height: 9px;
-    margin-top: 4px;
+  .scale {
+    font-size: 14px;
+    transform: scale(0.5);
+    width: 200%;
+    .line1 {
+      font-family: Source Han Sans CN;
+      font-weight: 300;
+      color: #595959;
+      line-height: 16px;
+      text-align: center;
+    }
+    .line2 {
+      font-family: Alibaba PuHuiTi;
+      font-weight: 300;
+      color: #595959;
+      text-align: center;
+      line-height: 9px;
+      margin-top: 4px;
+    }
   }
 }
 </style>

src/components/MechanicalDrive.vue

@@ -49,6 +49,7 @@ import HeadLine from 'cpns/HeadLine'
       flex: 1;
       height: 107px;
       background: #ffffff;
+      border-radius: 3px;
     }
   }
 }

src/components/OneStop.vue

@@ -2,9 +2,10 @@
   <div class="one_stop_container">
     <div class="header_wrap">
       <HeadLine
-        title="一站式设计+制造的产业链模式"
-        line1="旗下开设独资机箱壳子批量加工中心，消除了客户从概念导入到产品实现全程无障碍之忧"
-        line2="助力产品设计方案快速落地，以最快速度截获市场先机"
+        themeTitle="一站式设计+制造"
+        title="的产业链模式"
+        line1="产品梦工厂一家公司全部帮您搞定，减少供应商数量就能有效防止供应商扯皮/推诿"
+        line2="不仅帮您省心、省力，还能帮您节约30%的资金投入"
       />
     </div>
     <div class="design_cards">
@@ -20,7 +21,7 @@ import HeadLine from 'cpns/HeadLine'
 <style lang="scss" scoped>
 .one_stop_container {
   .header_wrap {
-    padding: 56px 31px 47px 31px;
+    padding: 0 10px 0 10px;
   }
   .design_cards {
     display: grid;

src/pages/index.vue

@@ -4,9 +4,9 @@
     <Summarize />
     <CaseShow />
     <MechanicalDrive />
+    <OneStop />
     <AboutUs />
     <Track />
-    <OneStop />
     <News />
     <Cooperation />
     <Awards />
@@ -31,5 +31,6 @@ import Bottom from 'cpns/Bottom'
 <style lang="scss" scoped>
 .home_container {
   margin-bottom: $bottom-height;
+  background: #f5f5f5;
 }
 </style>