fix: 优化页脚和头部样式，调整关于页面内容的排版

components/Footer-section/index.vue

@@ -94,8 +94,8 @@ const { t } = useI18n()
       <div class="f-bottom-shape">
         <img class="bgCover" src="/picture/footer-bottom.svg" alt="" />
       </div>
-      <div class="container">
-        <div class="footer-wrapper d-flex align-items-center justify-content-between">
+      <div style="padding:0 300px;" >
+        <div class="footer-wrapper d-flex align-items-center justify-content-between" style="position: relative; bottom:100px" >
           <p class="wow fadeInLeft color-2" data-wow-delay=".3s">
             {{ t('copyright') }}
             <a href=""></a>

components/TopHeader.vue

@@ -27,9 +27,9 @@ const langLabel = computed(() => {
     <div class="container-fluid">
       <div class="mega-menu-wrapper">
         <div class="header-main style-2">
-          <div class="header-left zindex">
+          <div class="header-left zindex" style="display: flex;">
             <div class="logo">
-              <NuxtLink to="/" class="header-logo">
+              <NuxtLink to="/" class="header-logo" style="padding-right: 20px;">
                 <img src="/picture/logo.svg" alt="logo-img" />
               </NuxtLink>
             </div>
@@ -136,6 +136,10 @@ const langLabel = computed(() => {
                         </li>
                       </ul> -->
                     </li>
+                    <li>
+                      <a href="/about">{{ t('aboutUs') }}</a>
+                      <!-- <a href="javascript:(0)">{{ t('contactUs') }}</a> -->
+                    </li>
                     <!-- <li>
                       <a href="/about">{{ t('aboutUs') }}</a>
                       <a href="javascript:(0)">{{ t('aboutUs') }}</a>

pages/about/index.vue

@@ -89,7 +89,7 @@
                 <div class="col-xl-4 col-lg-8 col-md-6 wow fadeInUp" data-wow-delay=".3s">
                   <div class="icon-items">
                     <div class="content text-center">
-                      <h5>80%</h5>
+                      <h3 style="color:#F39F5F">80%</h3>
                       <p>
                         {{ t('aboutPage.teachersWithOverseasExperience') }}
                         <br />
@@ -98,9 +98,9 @@
                   </div>
                 </div>
                 <div class="col-xl-4 col-lg-8 col-md-6 wow fadeInUp" data-wow-delay=".3s">
-                  <div class="icon-items">
-                    <div class="content text-center">
-                      <h5>98%</h5>
+                  <div class="icon-items" style="justify-content: center; text-align: center;">
+                    <div class="content" >
+                      <h3 style="color:#F39F5F">98%</h3>
                       <p>
                         {{ t('aboutPage.hskPassRate') }}
                         <br />
@@ -111,7 +111,7 @@
                 <div class="col-xl-4 col-lg-8 col-md-6 wow fadeInUp" data-wow-delay=".5s">
                   <div class="icon-items">
                     <div class="content text-center">
-                      <h5>10000+</h5>
+                      <h3 style="color:#F39F5F">10000+</h3>
                       <p>
                         {{ t('aboutPage.membersStartedLearning') }}
                         <br />
@@ -170,7 +170,7 @@
         </div>
         <div class="col-xl-4 col-lg-6 wow fadeInUp" data-wow-delay=".4s">
           <div class="feature-value-items">
-            <div class="feature-value-image">
+            <div class="feature-value-image" style="top:20px;z-index: 20; scale: 1.1;">
               <img src="/aboutImg/Container1.svg" alt="img" />
             </div>
           </div>
@@ -203,13 +203,13 @@
         </div>
       </div>
     </div>
-    <div style="position: absolute;bottom: 0;width: 100%;height:100px; background-image: url('/aboutImg/section-bottom-shape.svg');background-size: auto 100%;"></div>
+    <div style="position: absolute;z-index: 200;bottom: 0;width: 100%;height:100px; background-image: url('/aboutImg/section-bottom-shape.svg');background-size: auto 100%;"></div>
   </section>
   <section>
     <div class="main-container">
       <div class="title-section wow fadeInUp" data-wow-delay=".3s">
         <h3 style="color:#F39F5F">{{ t('aboutPage.brandCulture') }}</h3>
-        <h2 style="font-size: 50px;width: 700px;display: inline-block; text-align: center;">{{ t('aboutPage.brandCultureDesc') }}</h2>
+        <h2 style="color:#385469;font-size: 50px;width: 700px;display: inline-block; text-align: center;">{{ t('aboutPage.brandCultureDesc') }}</h2>
       </div>
       <div class="card-container fadeInUp" data-wow-delay=".5s">
         <div class="cloud-card orange-gradient " style="background: url('/aboutImg/Group 121.svg') center / cover no-repeat;">
@@ -231,9 +231,9 @@
     <div class="min-h-screen ">
       <div class="container wow fadeInUp" data-wow-delay=".3s">
         <!-- 标题区域 -->
-        <div class="title-area">
+        <div class="title-area" style="padding-top: 65px;">
           <h3 style="color:#F39F5F">{{ t('aboutPage.educationConcept') }}</h3>
-          <h2 style="font-size: 50px;width: 700px;display: inline-block; text-align: center;">{{ t('aboutPage.educationConceptDesc') }}</h2>
+          <h2 style="color:#385469; font-size: 50px;width: 700px;display: inline-block; text-align: center;">{{ t('aboutPage.educationConceptDesc') }}</h2>
         </div>
 
         <!-- 内容区域 -->
@@ -264,7 +264,7 @@
               </div>
             </div>
             <div class="image-content">
-              <img src="/aboutImg/software-hero-img.svg" style="left:0" alt="特色教学方式" />
+              <img src="/aboutImg/software-hero-img.svg" style="left:0;padding: 10px;object-position: left top;object-fit: cover;" alt="特色教学方式" />
             </div>
           </div>
 
@@ -459,7 +459,6 @@ const { t } = useI18n()
 }
 
 .image-content {
-  width: 50%;
   position: relative;
   display: flex;
   justify-content: end;