fix: classname

app/citizen-frontend/src/pages/forgot-password.vue

@@ -1,14 +1,21 @@
 <script setup lang="ts">
-import ForgotPasswordForm from '@/components/auth/ForgotPasswordForm.vue'
-import PasswordRecoveryShell from '@/components/auth/PasswordRecoveryShell.vue'
-import { useForgotPassword } from '@/composables/useForgotPassword'
+import ForgotPasswordForm from "@/components/auth/ForgotPasswordForm.vue";
+import PasswordRecoveryShell from "@/components/auth/PasswordRecoveryShell.vue";
+import { useForgotPassword } from "@/composables/useForgotPassword";
 const recoverySteps = [
-  { title: '輸入已註冊手機門號', icon: 'mdi-phone' },
-  { title: '收起E-Mail，使用連結進行重設密碼', icon: 'mdi-email-outline' },
-]
+  { title: "輸入已註冊手機門號", icon: "mdi-phone" },
+  { title: "收起E-Mail，使用連結進行重設密碼", icon: "mdi-email-outline" },
+];
 
-const { accepted, loading, disabled, errorMessage, fieldErrors, remainingSeconds, submit } =
-  useForgotPassword()
+const {
+  accepted,
+  loading,
+  disabled,
+  errorMessage,
+  fieldErrors,
+  remainingSeconds,
+  submit,
+} = useForgotPassword();
 </script>
 
 <template>
@@ -16,7 +23,11 @@ const { accepted, loading, disabled, errorMessage, fieldErrors, remainingSeconds
     <template #description>
       <v-sheet class="pa-4 mb-6" color="background" rounded="lg">
         <ol aria-label="密碼重設流程" class="recovery-flow ma-0 pa-0">
-          <li v-for="(step, index) in recoverySteps" :key="step.title" class="recovery-step">
+          <li
+            v-for="(step, index) in recoverySteps"
+            :key="step.title"
+            class="recovery-step"
+          >
             <v-avatar
               class="recovery-step-icon"
               color="primary"
@@ -28,7 +39,7 @@ const { accepted, loading, disabled, errorMessage, fieldErrors, remainingSeconds
             </v-avatar>
             <div class="recovery-step-content">
               <span class="recovery-step-number text-primary">
-                步驟 {{ String(index + 1).padStart(2, '0') }}
+                步驟 {{ String(index + 1).padStart(2, "0") }}
               </span>
               <p class="text-title-small text-high-emphasis ma-0">
                 {{ step.title }}
@@ -42,12 +53,17 @@ const { accepted, loading, disabled, errorMessage, fieldErrors, remainingSeconds
       <v-alert type="success" variant="tonal" role="status">
         如果帳號存在，系統將寄送密碼重設信件。
       </v-alert>
-      <p class="mt-4 text-body-1">請查看信箱與垃圾郵件匣。</p>
+      <p class="mt-4 text-body-large">請查看信箱與垃圾郵件匣。</p>
     </template>
     <template v-else>
-      <v-alert v-if="errorMessage" class="mb-4" type="error" variant="tonal" role="alert">{{
-        errorMessage
-      }}</v-alert>
+      <v-alert
+        v-if="errorMessage"
+        class="mb-4"
+        type="error"
+        variant="tonal"
+        role="alert"
+        >{{ errorMessage }}</v-alert
+      >
       <ForgotPasswordForm
         :loading="loading"
         :disabled="disabled"
@@ -83,7 +99,7 @@ const { accepted, loading, disabled, errorMessage, fieldErrors, remainingSeconds
   left: 19px;
   width: 2px;
   background: rgba(var(--v-theme-primary), 0.18);
-  content: '';
+  content: "";
 }
 
 .recovery-step-icon {