diff --git a/public/template_4/js/main.js b/public/template_4/js/main.js
index 949705d..ba13289 100644
--- a/public/template_4/js/main.js
+++ b/public/template_4/js/main.js
@@ -29,7 +29,6 @@ $('#mobile-menu').meanmenu({
 });
 
 $('.side-toggle').on('click', function () {
-	alert('1111')
 	$('.side-info').addClass('info-open');
 	$('.offcanvas-overlay').addClass('overlay-open');
 })
diff --git a/src/layouts/Layout_4.astro b/src/layouts/Layout_4.astro
index a7de88d..e0458be 100644
--- a/src/layouts/Layout_4.astro
+++ b/src/layouts/Layout_4.astro
@@ -56,7 +56,7 @@ import '../styles/template_4/meanmenu.css'
 					</div>
 					<div class="col-2 col-md-1">
 						<div class="side-menu-icon d-lg-none text-end">
-							<button class="side-toggle">顶顶顶顶顶</button>
+							<button class="side-toggle">三</button>
 						</div>
 					</div>
 				</div>
diff --git a/src/pages/template/4/index.astro b/src/pages/template/4/index.astro
index 3cc1032..b6317bd 100644
--- a/src/pages/template/4/index.astro
+++ b/src/pages/template/4/index.astro
@@ -8,6 +8,7 @@ import { TP2_COLUMN_ABOUT_US, TP2_COLUMN_INDEX, TP2_COLUMN_INDEX_URL } from "../
 import { newsIndex } from "../../../../utils/rpc";
 const config = getConfig(Astro)
 const extra = getTp4Extra(config.app_extra_tag);
+console.log(extra)
 const {code, data} = await newsIndex(config.id, 3);
 
 const breadcrumb = [{
@@ -22,274 +23,272 @@ const breadcrumb = [{
     breadcrumb={breadcrumb}
 >
 
-    <main>
-        <div class="app_slider  d-flex align-items-center fix">
-            <div class="App_shape-circle">
-                <img class="shapeAbsoulute scale-upOne d-sm-none d-md-block" src="/template_4/images/shape/circle.png" alt=""/>
-                <img class="shape10" src="/template_4/images/shape/shape10.png" alt=""/>
-                <img class="shape13" src="/template_4/images/shape/shape13.png" alt=""/>
-            </div>
-        <div class="container">
-            <div class="row">
-                <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4">
-                    <div class="App_shape wow fadeInLeft  d-sm-none d-md-block d-none  d-sm-block" data-wow-delay="0.1s" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInLeft;">
-                        <img src="/template_4/images/shape/mainshape.png" alt=""/>
-                    </div>
-                </div>
-                <div class="col-xl-8 col-lg-8 col-md-8 col-sm-12 d-flex align-items-center">
-                    <div class="app_sliderContent">
-                        <div class="shapeesright">
-                            <img class="shape1" src="/template_4/images/shape/shape1.png" alt=""/>
-                            <img class="shape2" src="/template_4/images/shape/shape2.png" alt=""/>
-                            <img class="shape3" src="/template_4/images/shape/shape3.png" alt=""/>
-                            <img class="shape4" src="/template_4/images/shape/shape4.png" alt=""/>
-                            <img class="shape5" src="/template_4/images/shape/shape5.png" alt=""/>
-                            <img class="shape6" src="/template_4/images/shape/shape6.png" alt=""/>
-                            <img class="shape7" src="/template_4/images/shape/shape7.png" alt=""/>
-                            <img class="shape8" src="/template_4/images/shape/shape8.png" alt=""/>
-                            <img class="shape9" src="/template_4/images/shape/shape9.png" alt=""/>
-                            <img class="shape11" src="/template_4/images/shape/shape5.png" alt=""/>
-                        </div>
-                        <h2 class="hero-two-title">{extra.sc1.text1}<br> {extra.sc1.text2}</h2>
-                        <p>{extra.sc1.text3}</p>
-                    </div>
-                </div>
+<div class="app_slider  d-flex align-items-center fix">
+    <div class="App_shape-circle">
+        <img class="shapeAbsoulute scale-upOne d-sm-none d-md-block" src="/template_4/images/shape/circle.png" alt=""/>
+        <img class="shape10" src="/template_4/images/shape/shape10.png" alt=""/>
+        <img class="shape13" src="/template_4/images/shape/shape13.png" alt=""/>
+    </div>
+<div class="container">
+    <div class="row">
+        <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4">
+            <div class="App_shape wow fadeInLeft  d-sm-none d-md-block d-none  d-sm-block" data-wow-delay="0.1s" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInLeft;">
+                <img src="/template_4/images/shape/mainshape.png" alt=""/>
             </div>
         </div>
-        </div>
-
-    <!-- FETURES START -->
-        <div class="homefeture_1 pt-115 pb-130">
-            <div class="container">
-                <div class="app_left_shape">
-                    <img class="leftanimation d-none d-sm-block" src="/template_4/images/shape/left.png" alt="leftshape"/>
-                    <img src="/template_4/images/shape/shape7.png" alt="leftshape"/>
-                    <img class="downsahpe d-none d-sm-block" src="/template_4/images/shape/shape3.png" alt="leftshape"/>
+        <div class="col-xl-8 col-lg-8 col-md-8 col-sm-12 d-flex align-items-center">
+            <div class="app_sliderContent">
+                <div class="shapeesright">
+                    <img class="shape1" src="/template_4/images/shape/shape1.png" alt=""/>
+                    <img class="shape2" src="/template_4/images/shape/shape2.png" alt=""/>
+                    <img class="shape3" src="/template_4/images/shape/shape3.png" alt=""/>
+                    <img class="shape4" src="/template_4/images/shape/shape4.png" alt=""/>
+                    <img class="shape5" src="/template_4/images/shape/shape5.png" alt=""/>
+                    <img class="shape6" src="/template_4/images/shape/shape6.png" alt=""/>
+                    <img class="shape7" src="/template_4/images/shape/shape7.png" alt=""/>
+                    <img class="shape8" src="/template_4/images/shape/shape8.png" alt=""/>
+                    <img class="shape9" src="/template_4/images/shape/shape9.png" alt=""/>
+                    <img class="shape11" src="/template_4/images/shape/shape5.png" alt=""/>
                 </div>
-                <div class="section_title_wrapper text-center wow fadeInUp mb-70" data-wow-delay="0.3s" style="visibility: visible; animation-delay: 0.3s; animation-name: fadeInUp;">
-                    <h2 class="section-title">{extra.sc2.text1}</h2>
-                </div>
-                <div class="row">
-                    <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
-                        <div class="feabox mb-30">
-                            <div class="feabox__img mb-50">
-                                <Image src={`/template_4/images/fetures/forma1.svg`} alt="pic" width={80} height={80}/>
-                            </div>
-                            <div class="feabox__content">
-                                <h3 class="feabox-title tcolor0">{extra.sc2.text2}</h3>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
-                        <div class="feabox mb-30 clr1">
-                            <div class="feabox__img img1 mb-50">
-                                <img src="/template_4/images/fetures/Forma2.png" alt="form2"/>
-                            </div>
-                            <div class="feabox__content">
-                                <h3 class="feabox-title tcolor1">{extra.sc2.text3}</h3>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
-                        <div class="feabox mb-30 clr2">
-                            <div class="feabox__img img2 mb-50">
-                                <img src="/template_4/images/fetures/Forma3.png" alt="form3"/>
-                            </div>
-                            <div class="feabox__content">
-                                <h3 class="feabox-title tcolor2">{extra.sc2.text4}</h3>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
-                        <div class="feabox mb-30 clr3">
-                            <div class="feabox__img img3 mb-50">
-                                <img src="/template_4/images/fetures/Forma4.png" alt="form4"/>
-                            </div>
-                            <div class="feabox__content">
-                                <h3 class="feabox-title tcolor3">{extra.sc2.text5}</h3>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    <!-- FETURES END -->
-
-    <!-- APP DETAILS START -->
-        <div class="app_details pb-20">
-            <div class="container">
-                <div class="row align-items-center">
-                    <div class="col-xl-7 col-lg-6 col-md-12">
-                        <div class="details_content  pb-70">
-                            <h2 class="section-title section_title_large">{extra.sc3.text1}</h2>
-                        </div>
-                        <div class="row">
-                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
-                                <div class="feature3">
-                                    <div class="feature3__image">
-                                        <img class="pb-30" src="/template_4/images/service/s7.png" alt="details"/>
-                                    </div>
-                                    <div class="feature3__content">
-                                        <h4 class="content_title">{extra.sc3.text2}</h4>
-                                        <p>{extra.sc3.text3}</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
-                                <div class="feature3 pl-40">
-                                    <div class="feature3__image febg1">
-                                        <img class="pb-30" src="/template_4/images/fetures/s2.png" alt="details"/>
-                                    </div>
-                                    <div class="feature3__content">
-                                        <h4 class="content_title">{extra.sc3.text4}</h4>
-                                        <p>{extra.sc3.text5}</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
-                                <div class="feature3">
-                                    <div class="feature3__image febg2">
-                                        <img class="pb-30" src="/template_4/images/fetures/s3.png" alt="details"/>
-                                    </div>
-                                    <div class="feature3__content">
-                                        <h4 class="content_title">{extra.sc3.text6}</h4>
-                                        <p>{extra.sc3.text7}</p>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
-                                <div class="feature3 pl-40">
-                                    <div class="feature3__image febg3">
-                                        <img class="pb-30" src="/template_4/images/fetures/s4.png" alt="details"/>
-                                    </div>
-                                    <div class="feature3__content">
-                                        <h4 class="content_title">{extra.sc3.text8}</h4>
-                                        <p>{extra.sc3.text9}</p>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-xl-5 col-lg-6 col-lg-6 col-md-12 d-md-none d-lg-block d-sm-none d-md-block d-sm-block">
-                        <div class="wow zoomIn" data-wow-delay=".3s" style="visibility: visible; animation-delay: 0.2s; animation-name: zoomIn;">
-                            <img src="/template_4/images/fetures/mockup.png" alt="blogshape"/>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    <!-- APP DETAILS END -->
-
-    <!-- DOWNLOAD START  -->
-        <div class="download-area pt-50 mt-100">
-            <div class="container">
-                <div class="row">
-                    <div class="col-xl-6 col-lg-6 col-md-4 col-sm-12 d-sm-none d-md-block">
-                        <div class="download_image">
-                            <img class="dw d-none d-sm-block" src="/template_4/images/shape/iphon2.png" alt="download_shape"/>
-                            <img class="downloadpos  d-md-none d-lg-block d-none d-sm-block" src="/template_4/images/shape/iphone3.png" alt="download_shape"/>
-                            <img class="downloadpos2 d-md-none d-lg-block d-none d-sm-block" src="/template_4/images/shape/circle.png" alt="download_shape"/>
-                        </div>
-                    </div>
-                    <div class="col-xl-6 col-lg-6 col-md-8 col-sm-12">
-                        <div class="download_content pl-105 pt-90">
-                            <h2 class="section-title">{extra?.sc4?.text1}</h2>
-                            <p>{extra?.sc4?.text2}</p>
-                            <div class="download-btn">
-                                <a class="tp_download" href={extra?.sc4?.text3}><Image width={50} height={50} alt="huawei-store" src={`/template_4/images/store/huawei.svg`} /></a>
-                                <a class="tp_download" href={extra?.sc4?.text4}><Image width={50} height={50} alt="xiaomi-store" src={`/template_4/images/store/xiaomi.svg`} /></a>
-                                <a class="tp_download" href={extra?.sc4?.text5}><Image width={50} height={50} alt="tencent-store" src={`/template_4/images/store/tencent.svg`} /></a>
-                                <a class="tp_download" href={extra?.sc4?.text6}><Image width={50} height={50} alt="wandoujia-store" src={`/template_4/images/store/wandoujia.svg`} /></a>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    <!-- DOWNLOAD END  -->
-
-    <div class="blog3">
-        <div class="container">
-            <div class="section_title_wrapper mb-60 text-center">
-                <h2 class="section-title team_title_h3">新闻产品资讯</h2>
-            </div>
-            
-            <div class="row">
-                {
-                    data.map(item => {
-                        return <div class="col-xl-4 col-lg-4 col-md-6">
-                                    <div class="blog">
-                                        <a href={`/news/${item.id}`}>
-                                            <div class="blog__image">
-                                                <Image class="blog-image" width={100} height={100} alt={item.title} src={item.cover} />
-                                                {/* <img src="assets/img/Blog/blog1.png" alt="blogImage"> */}
-                                            </div>
-                                            <div class="blog__meta">
-                                                <span>{item.created_at}</span>
-                                                <div><h3 class="title">{item.title}</h3></div>
-                                            </div>
-                                        </a>
-                                    </div>
-                                </div>
-                    })
-                }
+                <h2 class="hero-two-title">{extra.sc1.text1}<br> {extra.sc1.text2}</h2>
+                <p>{extra.sc1.text3}</p>
             </div>
         </div>
     </div>
+</div>
+</div>
 
-    <!-- TRY START  -->
-    <div class="social_share mb-100">
-        <div class="container">
-            <div class="section_title_wrapper mb-80 text-center mt-115">
-                <h2 class="section-title mb-20">{extra?.sc5?.text1}</p>
+<!-- FETURES START -->
+<div class="homefeture_1 pt-115 pb-130">
+    <div class="container">
+        <div class="app_left_shape">
+            <img class="leftanimation d-none d-sm-block" src="/template_4/images/shape/left.png" alt="leftshape"/>
+            <img src="/template_4/images/shape/shape7.png" alt="leftshape"/>
+            <img class="downsahpe d-none d-sm-block" src="/template_4/images/shape/shape3.png" alt="leftshape"/>
+        </div>
+        <div class="section_title_wrapper text-center wow fadeInUp mb-70" data-wow-delay="0.3s" style="visibility: visible; animation-delay: 0.3s; animation-name: fadeInUp;">
+            <h2 class="section-title">{extra.sc2.text1}</h2>
+        </div>
+        <div class="row">
+            <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
+                <div class="feabox mb-30">
+                    <div class="feabox__img mb-50">
+                        <Image src={`/template_4/images/fetures/forma1.svg`} alt="pic" width={80} height={80}/>
+                    </div>
+                    <div class="feabox__content">
+                        <h3 class="feabox-title tcolor0">{extra.sc2.text2}</h3>
+                    </div>
+                </div>
             </div>
-            <div class="row">
-                <div class="col-xl-3 col-lg-4 col-md-6 share-container">
-                    <div class="share align-items-center mb-30">
-                        <div class="share__icon">
-                            <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/vivo.svg`} />
-                        </div>
-                        <div class="share__content">
-                            <h4>vivo</h4>
-                        </div>
+            <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
+                <div class="feabox mb-30 clr1">
+                    <div class="feabox__img img1 mb-50">
+                        <img src="/template_4/images/fetures/Forma2.png" alt="form2"/>
+                    </div>
+                    <div class="feabox__content">
+                        <h3 class="feabox-title tcolor1">{extra.sc2.text3}</h3>
                     </div>
                 </div>
-                <div class="col-xl-3 col-lg-4 col-md-6 share-container">
-                    <div class="share align-items-center mb-30">
-                        <div class="share__icon">
-                            <!-- <img src="assets/img/social/twitter.png" alt="shareIcon"> -->
-                            <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/huawei.svg`} />
-                        </div>
-                        <div class="share__content">
-                            <h4>华为</h4>
-                        </div>
+            </div>
+            <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
+                <div class="feabox mb-30 clr2">
+                    <div class="feabox__img img2 mb-50">
+                        <img src="/template_4/images/fetures/Forma3.png" alt="form3"/>
+                    </div>
+                    <div class="feabox__content">
+                        <h3 class="feabox-title tcolor2">{extra.sc2.text4}</h3>
                     </div>
                 </div>
-                <div class="col-xl-3 col-lg-4 col-md-6 share-container">
-                    <div class="share align-items-center mb-30">
-                        <div class="share__icon">
-                            <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/xiaomi.svg`} />
-                        </div>
-                        <div class="share__content">
-                            <h4>小米</h4>
-                        </div>
+            </div>
+            <div class="col-xl-3 col-lg-3 col-md-6 feabox-container">
+                <div class="feabox mb-30 clr3">
+                    <div class="feabox__img img3 mb-50">
+                        <img src="/template_4/images/fetures/Forma4.png" alt="form4"/>
                     </div>
-                </div>
-                <div class="col-xl-3 col-lg-4 col-md-6 share-container">
-                    <div class="share align-items-center mb-30">
-                        <div class="share__icon">
-                            <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/oppo.svg`} />
-                        </div>
-                        <div class="share__content">
-                            <h4>OPPO</h4>
-                        </div>
+                    <div class="feabox__content">
+                        <h3 class="feabox-title tcolor3">{extra.sc2.text5}</h3>
                     </div>
                 </div>
             </div>
         </div>
     </div>
-    <!-- TRY END  -->
-    </main>
+</div>
+<!-- FETURES END -->
+
+<!-- APP DETAILS START -->
+<div class="app_details pb-20">
+    <div class="container">
+        <div class="row align-items-center">
+            <div class="col-xl-7 col-lg-6 col-md-12">
+                <div class="details_content  pb-70">
+                    <h2 class="section-title section_title_large">{extra.sc3.text1}</h2>
+                </div>
+                <div class="row">
+                    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
+                        <div class="feature3">
+                            <div class="feature3__image">
+                                <img class="pb-30" src="/template_4/images/service/s7.png" alt="details"/>
+                            </div>
+                            <div class="feature3__content">
+                                <h4 class="content_title">{extra.sc3.text2}</h4>
+                                <p>{extra.sc3.text3}</p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
+                        <div class="feature3 pl-40">
+                            <div class="feature3__image febg1">
+                                <img class="pb-30" src="/template_4/images/fetures/s2.png" alt="details"/>
+                            </div>
+                            <div class="feature3__content">
+                                <h4 class="content_title">{extra.sc3.text4}</h4>
+                                <p>{extra.sc3.text5}</p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
+                        <div class="feature3">
+                            <div class="feature3__image febg2">
+                                <img class="pb-30" src="/template_4/images/fetures/s3.png" alt="details"/>
+                            </div>
+                            <div class="feature3__content">
+                                <h4 class="content_title">{extra.sc3.text6}</h4>
+                                <p>{extra.sc3.text7}</p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6">
+                        <div class="feature3 pl-40">
+                            <div class="feature3__image febg3">
+                                <img class="pb-30" src="/template_4/images/fetures/s4.png" alt="details"/>
+                            </div>
+                            <div class="feature3__content">
+                                <h4 class="content_title">{extra.sc3.text8}</h4>
+                                <p>{extra.sc3.text9}</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-xl-5 col-lg-6 col-lg-6 col-md-12 d-md-none d-lg-block d-sm-none d-md-block d-sm-block">
+                <div class="wow zoomIn" data-wow-delay=".3s" style="visibility: visible; animation-delay: 0.2s; animation-name: zoomIn;">
+                    <img src="/template_4/images/fetures/mockup.png" alt="blogshape"/>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- APP DETAILS END -->
+
+<!-- DOWNLOAD START  -->
+<div class="download-area pt-50 mt-100">
+    <div class="container">
+        <div class="row">
+            <div class="col-xl-6 col-lg-6 col-md-4 col-sm-12 d-sm-none d-md-block">
+                <div class="download_image">
+                    <img class="dw d-none d-sm-block" src="/template_4/images/shape/iphon2.png" alt="download_shape"/>
+                    <img class="downloadpos  d-md-none d-lg-block d-none d-sm-block" src="/template_4/images/shape/iphone3.png" alt="download_shape"/>
+                    <img class="downloadpos2 d-md-none d-lg-block d-none d-sm-block" src="/template_4/images/shape/circle.png" alt="download_shape"/>
+                </div>
+            </div>
+            <div class="col-xl-6 col-lg-6 col-md-8 col-sm-12">
+                <div class="download_content pl-105 pt-90">
+                    <h2 class="section-title">{extra?.sc4?.text1}</h2>
+                    <p>{extra?.sc4?.text2}</p>
+                    <div class="download-btn">
+                        <span class="tp_download"><Image width={50} height={50} alt="huawei-store" src={`/template_4/images/store/huawei.svg`} /></span>
+                        <span class="tp_download"><Image width={50} height={50} alt="xiaomi-store" src={`/template_4/images/store/xiaomi.svg`} /></span>
+                        <span class="tp_download"><Image width={50} height={50} alt="tencent-store" src={`/template_4/images/store/tencent.svg`} /></span>
+                        <span class="tp_download"><Image width={50} height={50} alt="wandoujia-store" src={`/template_4/images/store/wandoujia.svg`} /></span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<!-- DOWNLOAD END  -->
+
+<div class="blog3">
+<div class="container">
+    <div class="section_title_wrapper mb-60 text-center">
+        <h2 class="section-title team_title_h3">新闻产品资讯</h2>
+    </div>
+    
+    <div class="row">
+        {
+            data.map(item => {
+                return <div class="col-xl-4 col-lg-4 col-md-6">
+                            <div class="blog">
+                                <a href={`/news/${item.id}`}>
+                                    <div class="blog__image">
+                                        <Image class="blog-image" width={100} height={100} alt={item.title} src={item.cover} />
+                                        {/* <img src="assets/img/Blog/blog1.png" alt="blogImage"> */}
+                                    </div>
+                                    <div class="blog__meta">
+                                        <span>{item.created_at}</span>
+                                        <div><h3 class="title">{item.title}</h3></div>
+                                    </div>
+                                </a>
+                            </div>
+                        </div>
+            })
+        }
+    </div>
+</div>
+</div>
+
+<!-- TRY START  -->
+<div class="social_share mb-100">
+<div class="container">
+    <div class="section_title_wrapper mb-80 text-center mt-115">
+        <h2 class="section-title mb-20">{extra?.sc5?.text1}</p>
+    </div>
+    <div class="row">
+        <div class="col-xl-3 col-lg-4 col-md-6 share-container">
+            <div class="share align-items-center mb-30">
+                <div class="share__icon">
+                    <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/vivo.svg`} />
+                </div>
+                <div class="share__content">
+                    <h4>vivo</h4>
+                </div>
+            </div>
+        </div>
+        <div class="col-xl-3 col-lg-4 col-md-6 share-container">
+            <div class="share align-items-center mb-30">
+                <div class="share__icon">
+                    <!-- <img src="assets/img/social/twitter.png" alt="shareIcon"> -->
+                    <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/huawei.svg`} />
+                </div>
+                <div class="share__content">
+                    <h4>华为</h4>
+                </div>
+            </div>
+        </div>
+        <div class="col-xl-3 col-lg-4 col-md-6 share-container">
+            <div class="share align-items-center mb-30">
+                <div class="share__icon">
+                    <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/xiaomi.svg`} />
+                </div>
+                <div class="share__content">
+                    <h4>小米</h4>
+                </div>
+            </div>
+        </div>
+        <div class="col-xl-3 col-lg-4 col-md-6 share-container">
+            <div class="share align-items-center mb-30">
+                <div class="share__icon">
+                    <Image class="shareIcon" height={100} width={100} alt="huawei" src={`/common/oppo.svg`} />
+                </div>
+                <div class="share__content">
+                    <h4>OPPO</h4>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+</div>
+<!-- TRY END  -->
 		
 </Layout>
 <style>