UI优化

src/components/Guide.vue

@@ -1,14 +1,19 @@
 <script setup>
 defineProps({
-  tall: {
-    type: Boolean,
-    default: false,
-  },
   noBg: {
     type: Boolean,
     default: false,
   },
+  type: {
+    type: Number,
+    default: 0,
+  },
 });
+const bubbleTypes = [
+  "../static/long-bubble.png",
+  "../static/long-bubble-middle.png",
+  "../static/long-bubble-tall.png",
+];
 </script>
 
 <template>
@@ -17,10 +22,8 @@ defineProps({
     <view>
       <image
         v-if="!noBg"
-        :src="
-          tall ? '../static/long-bubble-tall.png' : '../static/long-bubble.png'
-        "
-        :style="{ top: tall ? '-6%' : '-12%' }"
+        :src="bubbleTypes[type]"
+        :style="{ top: type === 2 ? '-5%' : '-12%' }"
         mode="widthFix"
       />
       <slot />