fix: 首页图片替换

src/styles/index.scss

@@ -2,7 +2,7 @@
 @import './common.scss';
 
 :root {
-  --primary-color: #e28e39;
+  --primary-color: #1E93B4;
   --header-height: 70px;
 }
 

src/views/Home/IndexPage.vue

@@ -47,15 +47,18 @@
         <h3 class="services-intro-title underline-title">让时尚更普惠</h3>
         <h4 class="services-intro-sub-title">让中国制造覆盖更多国家与地区</h4>
         <div class="services-intro-content">
-          晶闪科技经营业务涉及种类繁多，以服装，鞋子为主，根据目标客群的特质，立足于欧美市场的快时尚女装品牌，以欧美度假风、休闲棉麻风等为主开发方向，为用户提供多种选择；严格把控产品整体风格和质量，为其挑选性价比高、个性化的产品，让中国制造覆盖更多国家与地区。
+          公司目前主要业务涵盖时装、美体、鞋装、泳衣等，并有自己的工厂和上百家合作的供应商。公司运营及客服部门设在西安市高新区，工厂和仓库设在广州番禺，涉及的外贸平台有速卖通，亚马逊，Facebook
+          以及自建站等多个平台，公司秉承“上善若水，德以佑人”的经营理念，坚持“客户至上、诚实守信、团队协作、拼搏进取”的价值观，坚持“传递真诚”的服务理念，为客户提供优质的产品批发及生产服务。
         </div>
       </div>
       <div class="right-image">
         <img src="~@/assets/index/shoes.jpg" alt="Shoes" />
       </div>
     </div>
+    <div class="image-wrapper-1"></div>
+    <div class="image-wrapper-2"></div>
 
-    <div class="news-report">
+    <!-- <div class="news-report">
       <h2 class="underline-title news-report-title">新闻报道</h2>
       <div class="news-wrapper">
         <div v-for="(n, i) in news" :key="i" class="news-item">
@@ -67,18 +70,18 @@
                 <h4 class="news-title">{{ n.title }}</h4>
                 <div class="news-brief hover-hl-hidden">{{ n.brief }}</div>
 
-                <!-- <router-link
+                <router-link
                   class="news-link hover-hl-hidden"
                   href="javascript:;"
                   :to="`/article/123?from=IndexPage`"
                   >查看全文 +</router-link
-                > -->
+                >
               </div>
             </div>
           </div>
         </div>
       </div>
-    </div>
+    </div> -->
   </div>
 </template>
 <script>
@@ -179,7 +182,8 @@ export default {
 
 .intro-video-wrapper {
   background-image: url(~@/assets/index/second-bg.jpg);
-  padding-top: 46.87%;
+  background-size: 100%;
+  padding-top: 47.69%;
   position: relative;
 }
 
@@ -190,7 +194,7 @@ export default {
   bottom: 0;
   left: 0;
   color: #fff;
-  padding: 0 12%;
+  padding: 0 10%;
   display: flex;
   align-items: center;
 }
@@ -210,9 +214,9 @@ export default {
 }
 
 .intro-content {
-  width: 400px;
+  width: 60%;
   font-size: 16px;
-  color: #999;
+  color: #fff;
   line-height: 30px;
   margin-top: 10px;
 }
@@ -233,6 +237,18 @@ export default {
   }
 }
 
+.image-wrapper-1 {
+  background-image: url(~@/assets/index/image-wrapper-1.jpg);
+  background-size: 100%;
+  padding-top: 47.8%;
+}
+
+.image-wrapper-2 {
+  background-image: url(~@/assets/index/image-wrapper-2.jpg);
+  background-size: 100%;
+  padding-top: 47.8%;
+}
+
 .services-intro-text {
   background-color: var(--primary-color);
   color: #fff;
@@ -359,28 +375,6 @@ export default {
     width: unset;
   }
 
-  .services-intro {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    grid-template-rows: auto auto;
-
-    .left-image {
-      grid-row: 1 / 2;
-      grid-column: 1 / 2;
-    }
-
-    .services-intro-text {
-      grid-row: 2 / 3;
-      grid-column: 1 / 3;
-      padding: 30px 5%;
-    }
-
-    .right-image {
-      grid-row: 1 / 2;
-      grid-column: 2 / 3;
-    }
-  }
-
   .news-report {
     padding: 30px 5%;
     align-items: stretch;
@@ -415,4 +409,28 @@ export default {
     display: none;
   }
 }
+
+@media screen and (max-width: 1400px) {
+  .services-intro {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-template-rows: auto auto;
+
+    .left-image {
+      grid-row: 1 / 2;
+      grid-column: 1 / 2;
+    }
+
+    .services-intro-text {
+      grid-row: 2 / 3;
+      grid-column: 1 / 3;
+      padding: 30px 5%;
+    }
+
+    .right-image {
+      grid-row: 1 / 2;
+      grid-column: 2 / 3;
+    }
+  }
+}
 </style>