init

src/components/StepItem/index.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="grid grid-cols-[32px_1fr] items-start gap-4 max-[640px]:grid-cols-1">
+    <div
+      class="grid h-8 w-8 place-items-center rounded-full bg-slate-900 text-[13px] font-bold text-white max-[640px]:h-7 max-[640px]:w-7"
+    >
+      {{ step }}
+    </div>
+    <div class="grid gap-3 rounded-2xl border border-gray-200 bg-white p-4 shadow-[0_12px_28px_rgba(0,0,0,0.08)]">
+      <slot />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  step: number
+}>()
+</script>