From 7e14dd55ef20382d5838816178afd4d1875cbf8a Mon Sep 17 00:00:00 2001
From: Tony Yang <t510599@gmail.com>
Date: Tue, 15 Apr 2025 09:44:10 +0800
Subject: [PATCH] update: chinese translation

---
 src/components/Board/BoardForm.vue       | 12 +++++-----
 src/components/Login/LoginForm.vue       | 25 ++++++++++----------
 src/components/Profile/ProfileForm.vue   | 12 +++++-----
 src/components/Register/RegisterForm.vue | 29 ++++++++++++------------
 4 files changed, 38 insertions(+), 40 deletions(-)

diff --git a/src/components/Board/BoardForm.vue b/src/components/Board/BoardForm.vue
index 3d00bb6..3f02cdd 100644
--- a/src/components/Board/BoardForm.vue
+++ b/src/components/Board/BoardForm.vue
@@ -24,14 +24,14 @@ function submit() {
 <template>
   <form @submit.prevent="submit">
     <fieldset class="ts-fieldset">
-      <legend class="ts-legend">New Message</legend>
+      <legend class="ts-legend">新留言</legend>
       <div class="ts-wrap is-vertical">
-        <div class="ts-control">
-          <div class="label">Message</div>
+        <div class="ts-control is-wide">
+          <div class="label">留言</div>
           <div class="content is-fluid">
             <div class="ts-input">
-              <textarea v-if="!locked" name="message" placeholder="Message" v-model="text" :maxlength="maxLength" rows="5"></textarea>
-              <textarea v-else placeholder="Please log in to leave message" :maxlength="maxLength" rows="5" disabled></textarea>
+              <textarea v-if="!locked" name="message" placeholder="輸入留言..." v-model="text" :maxlength="maxLength" rows="5"></textarea>
+              <textarea v-else placeholder="請先登入才能留言！" :maxlength="maxLength" rows="5" disabled></textarea>
             </div>
             <div class="ts-text is-small is-secondary is-end-aligned">
               {{ remainingCharacters }} / {{ maxLength }}
@@ -40,7 +40,7 @@ function submit() {
         </div>
       </div>
       <div class="ts-wrap has-top-spaced is-end-aligned">
-        <button class="ts-button" type="submit" :class="{'is-disabled': text === '' || props.locked }">Submit</button>
+        <button class="ts-button" type="submit" :class="{'is-disabled': text === '' || props.locked }">送出</button>
       </div>
     </fieldset>
   </form>
diff --git a/src/components/Login/LoginForm.vue b/src/components/Login/LoginForm.vue
index ec399d1..988e5ba 100644
--- a/src/components/Login/LoginForm.vue
+++ b/src/components/Login/LoginForm.vue
@@ -15,9 +15,9 @@ const authStore = useAuthStore();
 
 function validateUsername() {
   if (!username.value) {
-    usernameError.value = 'Username is required.';
+    usernameError.value = '使用者名稱為必填。';
   } else if (username.value.length < 3) {
-    usernameError.value = 'Username must be at least 3 characters.';
+    usernameError.value = '使用者名稱長度必須至少三個字元。';
   } else {
     usernameError.value = '';
   }
@@ -25,9 +25,9 @@ function validateUsername() {
 
 function validatePassword() {
   if (!password.value) {
-    passwordError.value = 'Password is required.';
+    passwordError.value = '密碼為必填。';
   } else if (password.value.length < 8) {
-    passwordError.value = 'Password must be at least 8 characters.';
+    passwordError.value = '使用者名稱長度必須至少八個字元。';
   } else {
     passwordError.value = '';
   }
@@ -70,32 +70,31 @@ const onSubmit = async () => {
 <template>
   <form @submit.prevent="onSubmit">
     <fieldset class="ts-fieldset">
-      <legend class="ts-legend">Login</legend>
+      <legend class="ts-legend">登入</legend>
       <div class="ts-wrap is-vertical">
-        <div class="ts-control">
-          <div class="label">Username</div>
+        <div class="ts-control is-wide">
+          <div class="label">使用者名稱</div>
           <div class="content is-fluid">
             <div class="ts-input" :class="{'is-negative': usernameError}">
-              <input name="username" type="text" placeholder="Username" v-model="username" />
+              <input name="username" type="text" placeholder="使用者名稱" v-model="username" />
             </div>
             <div class="ts-text is-small is-negative" v-if="usernameError">{{ usernameError }}</div>
           </div>
         </div>
-        <div class="ts-control">
-          <div class="label">Password</div>
+        <div class="ts-control is-wide">
+          <div class="label">密碼</div>
           <div class="content is-fluid">
             <div class="ts-input" :class="{'is-negative': passwordError}">
-              <input name="password" type="password" placeholder="Password" v-model="password" />
+              <input name="password" type="password" placeholder="密碼" v-model="password" />
             </div>
             <div class="ts-text is-small is-negative" v-if="passwordError">{{ passwordError }}</div>
-            <div class="ts-text is-small is-negative">Warning: This is for demonstration purposes only. Passwords are stored in plaintext!</div>
           </div>
         </div>
       </div>
       <div class="ts-wrap has-top-spaced is-end-aligned">
         <button class="ts-button" type="submit" :class="{
           'is-disabled': username === '' || password === '' || usernameError !== '' || passwordError !== ''
-        }">Submit</button>
+        }">送出</button>
       </div>
     </fieldset>
   </form>
diff --git a/src/components/Profile/ProfileForm.vue b/src/components/Profile/ProfileForm.vue
index 1a42aae..ac78250 100644
--- a/src/components/Profile/ProfileForm.vue
+++ b/src/components/Profile/ProfileForm.vue
@@ -61,17 +61,17 @@ const avatarUrl = computed(() => {
 <template>
   <form @submit.prevent="onSubmit">
     <fieldset class="ts-fieldset">
-      <legend class="ts-legend">Update Profile</legend>
+      <legend class="ts-legend">更新個人檔案</legend>
       <div class="ts-wrap is-vertical">
-        <div class="ts-control">
-          <div class="label">Username</div>
+        <div class="ts-control is-wide">
+          <div class="label">使用者名稱</div>
           <div class="content is-fluid">
             <div class="ts-input">
               <input type="text" name="username" placeholder="Username" :value="props.profile?.username" readonly disabled />
             </div>
           </div>
         </div>
-        <div class="ts-control">
+        <div class="ts-control is-wide">
           <div class="label">Avatar</div>
           <div class="content is-fluid">
             <div v-if="avatarUrl">
@@ -81,12 +81,12 @@ const avatarUrl = computed(() => {
               <input type="file" accept="image/jpeg, image/png" @change="onFileChange" />
             </div>
             <div class="ts-text is-small is-negative" v-if="avatarError">{{ avatarError }}</div>
-            <div class="ts-text is-small">Avatar must be a JPG or PNG image less than 2MB.</div>
+            <div class="ts-text is-small">Avatar 必須是 JPG 或 PNG 格式。檔案需小於 2MB。</div>
           </div>
         </div>
       </div>
       <div class="ts-wrap has-top-spaced is-end-aligned">
-        <button class="ts-button" type="submit">Update</button>
+        <button class="ts-button" type="submit">更新</button>
       </div>
     </fieldset>
   </form>
diff --git a/src/components/Register/RegisterForm.vue b/src/components/Register/RegisterForm.vue
index 15c072a..e82de28 100644
--- a/src/components/Register/RegisterForm.vue
+++ b/src/components/Register/RegisterForm.vue
@@ -11,9 +11,9 @@ const passwordError = ref('');
 
 function validateUsername() {
   if (!username.value) {
-    usernameError.value = 'Username is required.';
+    usernameError.value = '使用者名稱為必填。';
   } else if (username.value.length < 3) {
-    usernameError.value = 'Username must be at least 3 characters.';
+    usernameError.value = '使用者名稱長度必須至少三個字元。';
   } else {
     usernameError.value = '';
   }
@@ -21,9 +21,9 @@ function validateUsername() {
 
 function validatePassword() {
   if (!password.value) {
-    passwordError.value = 'Password is required.';
+    passwordError.value = '密碼為必填。';
   } else if (password.value.length < 8) {
-    passwordError.value = 'Password must be at least 8 characters.';
+    passwordError.value = '使用者名稱長度必須至少八個字元。';
   } else {
     passwordError.value = '';
   }
@@ -58,32 +58,31 @@ const submit = () => {
 <template>
   <form @submit.prevent="submit">
     <fieldset class="ts-fieldset">
-      <legend class="ts-legend">New User</legend>
+      <legend class="ts-legend">註冊</legend>
       <div class="ts-wrap is-vertical">
-        <div class="ts-control">
-          <div class="label">Username</div>
+        <div class="ts-control is-wide">
+          <div class="label ts-text is-required">使用者名稱</div>
           <div class="content is-fluid">
             <div class="ts-input" :class="{'is-negative': usernameError}">
-              <input name="username" type="text" placeholder="Username" v-model="username" @input="validateUsername" />
+              <input name="username" type="text" placeholder="使用者名稱" v-model="username" @input="validateUsername" />
             </div>
             <div class="ts-text is-small is-negative" v-if="usernameError">{{ usernameError }}</div>
-            <div class="ts-text is-small">Username must be alphanumeric and at least 3 characters.</div>
+            <div class="ts-text is-small">使用者名稱只能有字母、數字，長度必須至少三個字元。</div>
           </div>
         </div>
-        <div class="ts-control">
-          <div class="label">Password</div>
+        <div class="ts-control is-wide">
+          <div class="label ts-text is-required">密碼</div>
           <div class="content is-fluid">
             <div class="ts-input" :class="{'is-negative': passwordError}">
-              <input name="password" type="password" placeholder="Password" v-model="password" @input="validatePassword" />
+              <input name="password" type="password" placeholder="密碼" v-model="password" @input="validatePassword" />
             </div>
             <div class="ts-text is-small is-negative" v-if="passwordError">{{ passwordError }}</div>
-            <div class="ts-text is-small">Password must be at least 8 characters.</div>
-            <div class="ts-text is-small is-negative">Warning: This is for demonstration purposes only. Passwords are stored in plaintext!</div>
+            <div class="ts-text is-small">密碼長度必須至少八個字元。</div>
           </div>
         </div>
       </div>
       <div class="ts-wrap has-top-spaced is-end-aligned">
-        <button class="ts-button" type="submit" :class="{'is-disabled': username === '' || password === '' }">Submit</button>
+        <button class="ts-button" type="submit" :class="{'is-disabled': username === '' || password === '' }">送出</button>
       </div>
     </fieldset>
   </form>