Improve mobile responsive adaptation (#7)

* Initial plan

* initial plan

Co-authored-by: FenjuFu <92919259+FenjuFu@users.noreply.github.com>

* improve mobile responsive adaptation for hero, carousel, and chat assistant

Co-authored-by: FenjuFu <92919259+FenjuFu@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: FenjuFu <92919259+FenjuFu@users.noreply.github.com>

Author: Copilot

docs/.vitepress/theme/components/HeroCarousel.vue

@@ -160,4 +160,16 @@ onUnmounted(() => {
 .carousel-fade-leave-to {
   opacity: 0;
 }
+
+@media (max-width: 768px) {
+  .carousel-link {
+    right: 0;
+    font-size: 12px;
+    top: -2px;
+  }
+
+  .carousel-stage {
+    padding-top: 8px;
+  }
+}
 </style>

docs/.vitepress/theme/components/LearningAssistant.vue

@@ -173,12 +173,22 @@ const sendMessage = async () => {
     right: 16px;
     z-index: 1000;
   }
-  
+
+  .chat-toggle {
+    width: 48px;
+    height: 48px;
+    font-size: 24px;
+  }
+
   .chat-window {
-    width: calc(100vw - 32px);
+    position: fixed;
+    bottom: 0;
+    right: 0;
+    width: 100vw;
     max-width: none;
-    height: 450px;
-    max-height: calc(100vh - 100px);
+    height: 70vh;
+    max-height: calc(100vh - 60px);
+    border-radius: 16px 16px 0 0;
   }
 }
 

docs/.vitepress/theme/index.css

@@ -82,45 +82,60 @@
   /* 首页 hero 区域适配 */
   .VPHero {
     padding-top: 48px !important;
-    padding-bottom: 48px !important;
+    padding-bottom: 32px !important;
   }
-  
+
+  /* 缩小移动端 hero 图片区域，避免图片占据过多屏幕空间 */
+  .VPHero .image {
+    margin: -40px -24px -36px !important;
+  }
+
+  .VPHero .image-container {
+    width: 200px !important;
+    height: 200px !important;
+  }
+
+  .VPHero .image-bg {
+    width: 140px !important;
+    height: 140px !important;
+  }
+
   .VPHero .name {
-    font-size: 36px !important;
+    font-size: 32px !important;
     line-height: 1.2 !important;
   }
 
   .VPHero .text {
-    font-size: 24px !important;
+    font-size: 22px !important;
     line-height: 1.3 !important;
   }
 
   .VPHero .tagline {
-    font-size: 15px !important;
+    font-size: 14px !important;
     line-height: 1.5 !important;
-    margin-top: 16px !important;
+    margin-top: 12px !important;
     padding: 0 12px !important;
   }
-  
+
   .VPHero .actions {
     display: flex !important;
     flex-direction: column !important;
-    gap: 16px !important;
+    gap: 12px !important;
     padding: 0 24px !important;
-    margin-top: 24px !important;
+    margin-top: 20px !important;
   }
-  
+
   .VPHero .action {
     margin: 0 !important;
     width: 100% !important;
   }
-  
+
   .VPHero .VPButton {
     width: 100% !important;
     display: flex !important;
     justify-content: center !important;
-    padding: 12px 24px !important;
-    font-size: 16px !important;
+    padding: 10px 20px !important;
+    font-size: 15px !important;
     height: auto !important;
     line-height: 1.5 !important;
   }