From 8248f7b9698a9aea332460812df9be966cbb18c6 Mon Sep 17 00:00:00 2001
From: GUjiYN <2946459904@qq.com>
Date: Fri, 19 Jan 2024 13:55:12 +0800
Subject: [PATCH] =?UTF-8?q?=E9=80=82=E9=85=8D=E6=B5=8F=E8=A7=88=E5=99=A8te?=
 =?UTF-8?q?st?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/MainPage/More.vue        |   2 +-
 src/components/MainPage/NewProfile.vue  | 165 +++++++++++-----------
 src/components/MainPage/ProjectList.vue | 173 +++++++++++++-----------
 src/components/MainPage/TeamProfile.vue |  45 +++---
 src/components/index.vue                |   7 +-
 5 files changed, 213 insertions(+), 179 deletions(-)

diff --git a/src/components/MainPage/More.vue b/src/components/MainPage/More.vue
index e166775..0df7a0a 100644
--- a/src/components/MainPage/More.vue
+++ b/src/components/MainPage/More.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="w-full mt-40 bg-gray-700 h-[400px]">
+  <div class="w-full  mt-40 bg-gray-700 h-[400px]">
     <div class="flex text-white">
       <div class="">
         <p class="pt-32 pl-52 text-2xl">
diff --git a/src/components/MainPage/NewProfile.vue b/src/components/MainPage/NewProfile.vue
index 28ba717..c99b487 100644
--- a/src/components/MainPage/NewProfile.vue
+++ b/src/components/MainPage/NewProfile.vue
@@ -1,89 +1,97 @@
 <template>
-  <div class="ml-64 container mx-auto flex flex-wrap mt-40 w-full">
-    <h2 class="text-3xl font-bold mb-16 dark:text-white">新闻</h2>
-    <button class="transition duration-300 ease-in-out transform hover:scale-105 ml-[1138px] border-gray-200 border-2 h-8 w-14 rounded-full flex justify-center items-center">
-      <svg class="w-4 h-4 text-gray-400 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-      </svg>
-    </button>
-    <div class="flex space-x-16 w-full">
-      <div @mouseover="showMoreButton1=true" @mouseleave="showMoreButton1=false"
-           class="transition-transform transform-gpu hover:scale-105 relative w-full sm:w-1/2 md:w-1/3 lg:w-1/3 xl:w-1/4 h-[460px] bg-white border border-gray-200 shadow dark:bg-gray-800 dark:border-gray-700"
-           :class="{'hover:bg-green-400':showMoreButton1}"
-      >
-        <div>
-          <p class="pl-5 mt-6 truncate text-xl sm:text-base md:text-lg lg:text-xl font-bold tracking-tight text-gray-700 dark:text-white" :class="{'text-white':showMoreButton1}">张三老师发布了：</p>
-          <p class="flex justify-center mt-10 mb-3 font-normal text-lg text-gray-700 dark:text-gray-400" :class="{'text-white':showMoreButton1}">梁溪区纪委大数据管理平台项目</p>
-          <p class="ml-4 mr-4">主要针对大量数据进行处理，需要大量数据，前后端配合需要的技术有：springboot,vue,mysql等</p>
-          <div class="absolute bottom-0 w-full h-[20%] bg-gray-100 mt-[200px] flex sm:text-base md:text-lg lg:text-xl" :class="{'bg-white':showMoreButton1}">
-            <div class="flex flex-col">
-              <div class="ml-6 mt-4 font-semibold text-3xl" :class="{'text-green-400':showMoreButton1}">
-                01-17
-              </div>
-              <div class="ml-6 text-lg" :class="{'text-green-400':showMoreButton1}">
-                2024
-              </div>
-            </div>
-            <div class="mt-10 ml-52">
-              <a href="#" v-if="showMoreButton1" class="inline-flex items-center text-sm font-medium text-center text-white bg-green-400 rounded-full dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
-                <svg class="rtl:rotate-180 w-4 h-4 m-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </a>
-            </div>
-          </div>
+  <div class="mt-40 w-full">
+    <div class="md:container mx-auto">
+      <div class="flex items-center">
+        <h2 class="text-3xl font-bold dark:text-white">新闻</h2>
+        <div @mouseover="LearnMore8=true" @mouseleave="LearnMore8=false" class="ml-auto">
+          <button :class="{'bg-green-400':LearnMore8}" class="transition duration-300 ease-in-out transform hover:scale-105 border-gray-200 border-2 h-8 w-14 rounded-full flex justify-center items-center">
+            <svg class="w-4 h-4 text-gray-400 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+              <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+            </svg>
+          </button>
         </div>
       </div>
-      <div @mouseover="showMoreButton2=true" @mouseleave="showMoreButton2=false"
-           class="transition-transform transform-gpu hover:scale-105 relative w-full sm:w-1/2 md:w-1/3 lg:w-1/3 xl:w-1/4 h-[460px] bg-white border border-gray-200 shadow dark:bg-gray-800 dark:border-gray-700"
-           :class="{'hover:bg-green-400':showMoreButton2}"
-      >
-        <div class="">
-          <p class="pl-5 mt-6 truncate text-xl sm:text-base md:text-lg lg:text-xl font-bold tracking-tight text-gray-700 dark:text-white" :class="{'text-white':showMoreButton2}">张三老师发布了：</p>
-          <p class="flex justify-center mt-10 mb-3 font-normal text-lg text-gray-700 dark:text-gray-400" :class="{'text-white':showMoreButton2}">梁溪区纪委大数据管理平台项目</p>
-          <p class="ml-4 mr-4">主要针对大量数据进行处理，需要大量数据，前后端配合需要的技术有：springboot,vue,mysql等</p>
-           <div class="absolute bottom-0 w-full h-[20%] bg-gray-100 mt-[200px] flex" :class="{'bg-white':showMoreButton2}">
-            <div class="flex flex-col">
-              <div class="ml-6 mt-4 font-semibold text-3xl" :class="{'text-green-400':showMoreButton2}">
-                01-17
+      <div class="mx-auto mt-24 flex flex-col space-y-8">
+        <div class="flex space-x-12">
+          <div @mouseover="showMoreButton1=true" @mouseleave="showMoreButton1=false"
+               class="flex-1 transition-transform transform-gpu hover:scale-105 relative sm:w-1/2 md:w-1/4 lg:w-1/3 xl:w-1/4 h-[500px] bg-white border border-gray-200 shadow dark:bg-gray-800 dark:border-gray-700"
+               :class="{'hover:bg-green-400':showMoreButton1}"
+          >
+            <div>
+              <p class="pl-5 mt-6 truncate text-xl sm:text-base md:text-lg lg:text-xl font-bold tracking-tight text-gray-700 dark:text-white" :class="{'text-white':showMoreButton1}">张三老师发布了：</p>
+              <p class="flex justify-center mt-10 mb-3 font-normal text-lg text-gray-700 dark:text-gray-400" :class="{'text-white':showMoreButton1}">梁溪区纪委大数据管理平台项目</p>
+              <p class="ml-4 mr-4">主要针对大量数据进行处理，需要大量数据，前后端配合需要的技术有：springboot,vue,mysql等</p>
+              <div class="absolute bottom-0 w-full h-[20%] bg-gray-100 mt-[200px] flex sm:text-base md:text-lg lg:text-xl" :class="{'bg-white':showMoreButton1}">
+                <div class="flex flex-col">
+                  <div class="ml-6 mt-4 font-semibold text-3xl" :class="{'text-green-400':showMoreButton1}">
+                    01-17
+                  </div>
+                  <div class="ml-6 text-lg" :class="{'text-green-400':showMoreButton1}">
+                    2024
+                  </div>
+                </div>
+                <div class="mt-10 ml-auto mr-10">
+                  <a href="#" v-if="showMoreButton1" class="inline-flex items-center text-sm font-medium text-center text-white bg-green-400 rounded-full dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
+                    <svg class="rtl:rotate-180 w-4 h-4 m-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </a>
+                </div>
               </div>
-              <div class="ml-6 text-lg" :class="{'text-green-400':showMoreButton2}">
-                2024
-              </div>
-            </div>
-            <div class="mt-10 ml-52">
-              <a href="#" v-if="showMoreButton2" class="inline-flex items-center text-sm font-medium text-center text-white bg-green-400 rounded-full dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
-                <svg class="rtl:rotate-180 w-4 h-4 m-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </a>
             </div>
           </div>
-        </div>
-      </div>
-      <div @mouseover="showMoreButton3=true" @mouseleave="showMoreButton3=false"
-           class="transition-transform transform-gpu hover:scale-105 hover:bg-green-400 relative w-full sm:w-1/2 md:w-1/3 lg:w-1/3 xl:w-1/4 h-[460px] bg-white border border-gray-200 shadow dark:bg-gray-800 dark:border-gray-700"
-           :class="{'hover:bg-green-400':showMoreButton3}"
-      >
-        <div class="">
-          <p class="pl-5 mt-6 truncate text-xl sm:text-base md:text-lg lg:text-xl font-bold tracking-tight text-gray-700 dark:text-white" :class="{'text-white':showMoreButton3}">张三老师发布了：</p>
-          <p class="flex justify-center mt-10 mb-3 font-normal text-lg text-gray-700 dark:text-gray-400" :class="{'text-white':showMoreButton3}">梁溪区纪委大数据管理平台项目</p>
-          <p class="ml-4 mr-4">主要针对大量数据进行处理，需要大量数据，前后端配合需要的技术有：springboot,vue,mysql等</p>
-          <div class="absolute bottom-0 w-full h-[20%] bg-gray-100 mt-[200px] flex" :class="{'bg-white':showMoreButton3}">
-            <div class="flex flex-col">
-              <div class="ml-6 mt-4 font-semibold text-3xl" :class="{'text-green-400':showMoreButton3}">
-                01-17
-              </div>
-              <div class="ml-6 text-lg" :class="{'text-green-400':showMoreButton3}">
-                2024
+          <div @mouseover="showMoreButton2=true" @mouseleave="showMoreButton2=false"
+               class="flex-1 transition-transform transform-gpu hover:scale-105 relative sm:w-1/2 md:w-1/4 lg:w-1/3 xl:w-1/4 h-[500px] bg-white border border-gray-200 shadow dark:bg-gray-800 dark:border-gray-700"
+               :class="{'hover:bg-green-400':showMoreButton2}"
+          >
+            <div class="">
+              <p class="pl-5 mt-6 truncate text-xl sm:text-base md:text-lg lg:text-xl font-bold tracking-tight text-gray-700 dark:text-white" :class="{'text-white':showMoreButton2}">张三老师发布了：</p>
+              <p class="flex justify-center mt-10 mb-3 font-normal text-lg text-gray-700 dark:text-gray-400" :class="{'text-white':showMoreButton2}">梁溪区纪委大数据管理平台项目</p>
+              <p class="ml-4 mr-4">主要针对大量数据进行处理，需要大量数据，前后端配合需要的技术有：springboot,vue,mysql等</p>
+              <div class="absolute bottom-0 w-full h-[20%] bg-gray-100 mt-[200px] flex" :class="{'bg-white':showMoreButton2}">
+                <div class="flex flex-col">
+                  <div class="ml-6 mt-4 font-semibold text-3xl" :class="{'text-green-400':showMoreButton2}">
+                    01-17
+                  </div>
+                  <div class="ml-6 text-lg" :class="{'text-green-400':showMoreButton2}">
+                    2024
+                  </div>
+                </div>
+                <div class="mt-10 ml-auto mr-10">
+                  <a href="#" v-if="showMoreButton2" class="inline-flex items-center text-sm font-medium text-center text-white bg-green-400 rounded-full dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
+                    <svg class="rtl:rotate-180 w-4 h-4 m-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </a>
+                </div>
               </div>
             </div>
-            <div class="mt-10 ml-52">
-              <a href="#" v-if="showMoreButton3" class="inline-flex items-center text-sm font-medium text-center text-white bg-green-400 rounded-full dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
-                <svg class="rtl:rotate-180 w-4 h-4 m-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </a>
+          </div>
+          <div @mouseover="showMoreButton3=true" @mouseleave="showMoreButton3=false"
+               class="flex-1 transition-transform transform-gpu hover:scale-105 hover:bg-green-400 relative sm:w-1/2 md:w-1/4 lg:w-1/3 xl:w-1/4 h-[500px] bg-white border border-gray-200 shadow dark:bg-gray-800 dark:border-gray-700"
+               :class="{'hover:bg-green-400':showMoreButton3}"
+          >
+            <div class="">
+              <p class="pl-5 mt-6 truncate text-xl sm:text-base md:text-lg lg:text-xl font-bold tracking-tight text-gray-700 dark:text-white" :class="{'text-white':showMoreButton3}">张三老师发布了：</p>
+              <p class="flex justify-center mt-10 mb-3 font-normal text-lg text-gray-700 dark:text-gray-400" :class="{'text-white':showMoreButton3}">梁溪区纪委大数据管理平台项目</p>
+              <p class="ml-4 mr-4">主要针对大量数据进行处理，需要大量数据，前后端配合需要的技术有：springboot,vue,mysql等</p>
+              <div class="absolute bottom-0 w-full h-[20%] bg-gray-100 mt-[200px] flex" :class="{'bg-white':showMoreButton3}">
+                <div class="flex flex-col">
+                  <div class="ml-6 mt-4 font-semibold text-3xl" :class="{'text-green-400':showMoreButton3}">
+                    01-17
+                  </div>
+                  <div class="ml-6 text-lg" :class="{'text-green-400':showMoreButton3}">
+                    2024
+                  </div>
+                </div>
+                <div class="mt-10 ml-auto mr-10">
+                  <a href="#" v-if="showMoreButton3" class="inline-flex items-center text-sm font-medium text-center text-white bg-green-400 rounded-full dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
+                    <svg class="rtl:rotate-180 w-4 h-4 m-1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </a>
+                </div>
+              </div>
             </div>
           </div>
         </div>
@@ -99,6 +107,7 @@ export default {
       showMoreButton1:false,
       showMoreButton2:false,
       showMoreButton3:false,
+      LearnMore8:false,
     }
   }
 }
diff --git a/src/components/MainPage/ProjectList.vue b/src/components/MainPage/ProjectList.vue
index f718001..87bab4b 100644
--- a/src/components/MainPage/ProjectList.vue
+++ b/src/components/MainPage/ProjectList.vue
@@ -1,94 +1,109 @@
 <template>
-  <div class="md:container w-full mt-40 ml-64">
-    <div class="flex">
-      <h2 class="text-3xl font-bold">项目展示</h2>
-      <button :class="{'text-white':LearnMore0}" class="transition duration-300 ease-in-out transform hover:scale-105 ml-[1050px] border-gray-200 border-2 h-8 w-14 rounded-full flex justify-center items-center">
-        <svg class="w-4 h-4 text-gray-400 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-          <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-        </svg>
-      </button>
-    </div>
-    <div class="mt-24 flex flex-col space-y-8">
-      <div class="flex space-x-12">
-        <div @mouseover="LearnMore1=true" @mouseleave="LearnMore1=false" class="relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-72 w-96 bg-cover bg-center bg-[url('@/assets/images/img21.jpg')]">
-          <div class="flex items-center">
-            <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore1}">
-              <h5 class="ml-5 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore1">项目标题</h5>
-              <button v-if="LearnMore1" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
-                <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </button>
+  <div class="mt-40 w-full">
+    <div class="md:container mx-auto">
+      <div class="flex items-center">
+        <h2 class="text-3xl font-bold">项目展示</h2>
+        <div @mouseover="LearnMore0=true" @mouseleave="LearnMore0=false" class="ml-auto">
+          <button :class="{'bg-green-400':LearnMore0}" class="transition duration-300 ease-in-out transform hover:scale-105  border-gray-200 border-2 h-8 w-14 rounded-full flex justify-center items-center">
+            <svg class="w-4 h-4 text-gray-400 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+              <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+            </svg>
+          </button>
+        </div>
+      </div>
+      <div class="mx-auto mt-24 flex flex-col space-y-8">
+        <div class="flex space-x-12">
+          <div @mouseover="LearnMore1=true" @mouseleave="LearnMore1=false" class="flex-1 relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-80 w-1/4 bg-cover bg-center bg-[url('@/assets/images/img21.jpg')]">
+            <div class="flex items-center">
+              <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore1}">
+                <h5 class="ml-8 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore1">项目标题</h5>
+                <div class="ml-auto mr-10">
+                  <button v-if="LearnMore1" class="mt-8 w-6 h-6 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
+                    <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div @mouseover="LearnMore2=true" @mouseleave="LearnMore2=false" class=" flex-1 relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-80 w-1/4 bg-cover bg-center bg-[url('@/assets/images/img22.jpg')]">
+            <div class="flex items-center">
+              <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore2}">
+                <h5 class="ml-8 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore2">项目标题</h5>
+                  <div class="ml-auto mr-10">
+                    <button v-if="LearnMore2" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
+                      <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                        <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                      </svg>
+                    </button>
+                  </div>
+              </div>
+            </div>
+          </div>
+          <div @mouseover="LearnMore3=true" @mouseleave="LearnMore3=false" class="flex-1 relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-80 w-1/4 bg-cover bg-center bg-[url('@/assets/images/img23.jpg')]">
+            <div class="flex items-center">
+              <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore3}">
+                <h5 class="ml-8 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore3">项目标题</h5>
+                <div class="ml-auto mr-10">
+                 <button v-if="LearnMore3" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
+                   <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                     <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                   </svg>
+                 </button>
+                </div>
+              </div>
             </div>
           </div>
         </div>
-        <div @mouseover="LearnMore2=true" @mouseleave="LearnMore2=false" class="relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-72 w-96 bg-cover bg-center bg-[url('@/assets/images/img22.jpg')]">
-          <div class="flex items-center">
-            <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore2}">
-              <h5 class="ml-5 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore2">项目标题</h5>
-                <button v-if="LearnMore2" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
-                  <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                  </svg>
-                </button>
+        <div class="flex space-x-12">
+          <div @mouseover="LearnMore4=true" @mouseleave="LearnMore4=false" class="flex-1 relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-80 w-1/4 bg-cover bg-center bg-[url('@/assets/images/img24.jpg')]">
+            <div class="flex items-center">
+              <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore4}">
+                <h5 class="ml-8 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore4">项目标题</h5>
+                <div class="ml-auto mr-10">
+                  <button v-if="LearnMore4" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
+                    <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </button>
+                </div>
+              </div>
             </div>
           </div>
-        </div>
-        <div @mouseover="LearnMore3=true" @mouseleave="LearnMore3=false" class="relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-72 w-96 bg-cover bg-center bg-[url('@/assets/images/img23.jpg')]">
-          <div class="flex items-center">
-            <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore3}">
-              <h5 class="ml-5 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore3">项目标题</h5>
-              <button v-if="LearnMore3" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
-                <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </button>
+          <div @mouseover="LearnMore5=true" @mouseleave="LearnMore5=false" class="flex-1 relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-80 w-1/4 bg-center bg-[url('@/assets/images/img25.jpg')]">
+            <div class="flex items-center">
+              <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore5}">
+                <h5 class="ml-8 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore5">项目标题</h5>
+                <div class="ml-auto mr-10">
+                  <button v-if="LearnMore5" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
+                    <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div @mouseover="LearnMore6=true" @mouseleave="LearnMore6=false" class="flex-1 relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-80 bg-cover bg-center bg-[url('@/assets/images/img26.jpg')]">
+            <div class="flex items-center">
+              <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore6}">
+                <h5 class="ml-8 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore6"> 项目标题</h5>
+                <div class="ml-auto mr-10">
+                  <button v-if="LearnMore6" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
+                    <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+                      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+                    </svg>
+                  </button>
+                </div>
+              </div>
             </div>
           </div>
         </div>
       </div>
-      <div class="flex space-x-12">
-        <div @mouseover="LearnMore4=true" @mouseleave="LearnMore4=false" class="relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-72 w-96 bg-cover bg-center bg-[url('@/assets/images/img24.jpg')]">
-          <div class="flex items-center">
-            <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore4}">
-              <h5 class="ml-5 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore4">项目标题</h5>
-              <button v-if="LearnMore4" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
-                <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </button>
-            </div>
-          </div>
-        </div>
-        <div @mouseover="LearnMore5=true" @mouseleave="LearnMore5=false" class="relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-72 w-96 bg-cover bg-center bg-[url('@/assets/images/img25.jpg')]">
-          <div class="flex items-center">
-            <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore5}">
-              <h5 class="ml-5 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore5">项目标题</h5>
-              <button v-if="LearnMore5" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
-                <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </button>
-            </div>
-          </div>
-        </div>
-        <div @mouseover="LearnMore6=true" @mouseleave="LearnMore6=false" class="relative transition-transform transform-gpu hover:scale-105 border-gray-400 shadow-lg h-72 w-96 bg-cover bg-center bg-[url('@/assets/images/img26.jpg')]">
-          <div class="flex items-center">
-            <div class="flex absolute bottom-0 h-[30%] w-full" :class="{'bg-white':LearnMore6}">
-              <h5 class="ml-5 mt-6 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" v-if="LearnMore6"> 项目标题</h5>
-              <button v-if="LearnMore6" class="mt-8 w-6 h-6 ml-52 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105">
-                <svg class="rtl:rotate-180 w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-                </svg>
-              </button>
-            </div>
-          </div>
-        </div>
-      </div>
-
     </div>
-
   </div>
+
 </template>
 
 <script>
diff --git a/src/components/MainPage/TeamProfile.vue b/src/components/MainPage/TeamProfile.vue
index 4802586..fce1ccd 100644
--- a/src/components/MainPage/TeamProfile.vue
+++ b/src/components/MainPage/TeamProfile.vue
@@ -1,24 +1,35 @@
 <template>
-  <div class="ml-64 md:container w-full mt-40">
-    <div class="flex">
-      <h2 class="text-3xl font-bold mb-6">
-        关于
-      </h2>
-      <button class="transition duration-300 ease-in-out transform hover:scale-105 ml-[1115px] border-gray-200 border-2 h-8 w-14 rounded-full flex justify-center items-center">
-        <svg class="w-4 h-4 text-gray-400 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
-          <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
-        </svg>
-      </button>
-    </div>
-    <div class="flex">
-      <div class="mt-16 h-96 w-[600px] border-2 border-gray-400">
-        团队介绍
+  <div class="w-full mt-40">
+    <div class="container mx-auto">
+      <div class="flex">
+        <h2 class="text-3xl font-bold mb-6">
+          关于
+        </h2>
+        <div @mouseover="LearnMore7=true" @mouseleave="LearnMore7=false" class="ml-auto">
+          <button :class="{'bg-green-400':LearnMore7}" class="transition duration-300 ease-in-out transform hover:scale-105 border-gray-200 border-2 h-8 w-14 rounded-full flex justify-center items-center">
+            <svg class="w-4 h-4 text-gray-400 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
+              <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
+            </svg>
+          </button>
+        </div>
       </div>
-      <div role="status" class="ml-10 mt-16 mb-40 h-96 w-2/5 bg-white shadow-lg">
-        <img src="@/assets/images/img15.jpg" alt="">
+      <div class="flex">
+        <div class="flex-1 mt-16 h-96 w-[600px] border-2 border-gray-400">
+          团队介绍
+        </div>
+        <div role="status" class="flex-1 ml-10 mt-16 mb-40 h-96 w-2/5 bg-white shadow-lg">
+          <img src="@/assets/images/img15.jpg" alt="">
+        </div>
       </div>
     </div>
   </div>
 </template>
-<script setup>
+<script>
+export default {
+  data(){
+    return{
+      LearnMore7:false,
+    }
+  }
+}
 </script>
\ No newline at end of file
diff --git a/src/components/index.vue b/src/components/index.vue
index 9341069..9648cb4 100644
--- a/src/components/index.vue
+++ b/src/components/index.vue
@@ -1,15 +1,14 @@
 <script setup>
 import { onMounted } from 'vue'
 import { initFlowbite } from 'flowbite'
-import More from "@/components/MainPage/More.vue";
-// initialize components based on data attribute selectors
+
 onMounted(() => {
   initFlowbite();
 })
 </script>
 <template>
-  <div class=" w-screen h-auto">
-    <div>
+  <div class="w-[100%] h-auto">
+    <div class="flex flex-col">
       <NavBar/>
       <Carousel/>
       <ProjectList/>