add: home select exp

src/views/HomeView.vue

@@ -1,14 +1,9 @@
 <template>
   <div class="bg-base-200 min-h-screen">
     <main class="hero min-h-screen bg-base-200">
-      <div class="hero-content flex-col lg:flex-row-reverse gap-8 lg:gap-12 py-10 px-4">
-        <!-- 图片容器 -->
-        <div
-          class="image-container relative w-full max-w-sm hover:scale-105 hover:-rotate-1 transition-transform duration-500 ease-in-out">
-          <img src="https://placehold.co/600x400"
-            class="w-full rounded-2xl shadow-2xl border-4 border-base-300 transition-shadow duration-300 hover:shadow-primary" />
-          <!-- 这里使用relative定位，限制覆盖层只在图片容器内 -->
-          <div class="absolute inset-0 bg-primary opacity-10 rounded-2xl pointer-events-none"></div>
+      <div class="hero-content flex-col xl:flex-row-reverse gap-8 xl:gap-12 py-10 px-4">        <!-- 例程轮播容器 -->
+        <div class="w-full flex justify-center" style="min-width: 650px;">
+          <TutorialCarousel :autoRotationInterval="3000" />
         </div>
         <!-- 内容容器 -->
         <div class="content-container max-w-md lg:max-w-2xl transform transition-all duration-500 ease-in-out">
@@ -93,6 +88,7 @@
 
 <script lang="ts" setup>
 import "@/router";
+import TutorialCarousel from "@/components/TutorialCarousel.vue";
 </script>
 
 <style scoped lang="postcss">