feat: refactor layouts and login components

2026-03-30 15:04:27 +08:00
parent f7413111c0
commit 79b20ded3b
21 changed files with 159 additions and 210 deletions
@@ -0,0 +1,44 @@
+<template>
+  <div
+    class="illustration-container d-flex flex-column align-center justify-center fill-height px-8"
+  >
+    <div class="illustration-wrapper mb-8 w-100 d-flex justify-center">
+      <v-img
+        v-if="image"
+        aspect-ratio="16/9"
+        contain
+        max-width="600"
+        :src="image"
+        width="100%"
+      ></v-img>
+    </div>
+
+    <div class="text-center">
+      <h1 class="text-h4 font-weight-bold text-secondary mb-4">{{ title }}</h1>
+      <p class="text-body-1 text-secondary">{{ description }}</p>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineProps({
+  image: {
+    type: String,
+    default: null,
+  },
+  title: {
+    type: String,
+    default: '這是一個標題',
+  },
+  description: {
+    type: String,
+    default: '這是一個副標題',
+  },
+})
+</script>
+
+<style scoped>
+.illustration-container {
+  width: 100%;
+}
+</style>