feat: 新增輪播圖

app/citizen-frontend/src/components/IntroductionCarousel.vue

@@ -4,6 +4,9 @@ import expoParkOverviewImage from "@/assets/introduction/expo_park_open/open_00.
 import sportsEmpowerHubImage from "@/assets/introduction/expo_park_open/open_01.jpg";
 import fitnessResearchImage from "@/assets/introduction/expo_park_open/open_02.jpg";
 import expoParkZonesImage from "@/assets/introduction/expo_park_open/open_03.jpg";
+import communityImage from "@/assets/introduction/community.jpg";
+import familyImage from "@/assets/introduction/family.jpg";
+import usrImage from "@/assets/introduction/usr.jpg";
 
 const slides = [
   {
@@ -22,6 +25,18 @@ const slides = [
     title: "花博運動賦能基地分區",
     src: expoParkZonesImage,
   },
+  {
+    title: "社區",
+    src: communityImage,
+  },
+  {
+    title: "家庭",
+    src: familyImage,
+  },
+  {
+    title: "USR",
+    src: usrImage,
+  },
 ];
 
 const activeSlide = shallowRef(0);
@@ -94,7 +109,7 @@ const activeSlide = shallowRef(0);
 
 .carousel-pagination {
   display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
+  grid-template-columns: repeat(7, minmax(0, 1fr));
   gap: 8px;
   max-width: 520px;
   margin: 14px auto 0;