From 8691febf515de1ee4865cc17b9657808160f74d1 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 3 Feb 2026 00:15:11 +0000
Subject: [PATCH 2/5] Add beautiful donation card to About page

Co-authored-by: Sunwuyuan <88357633+Sunwuyuan@users.noreply.github.com>
---
 src/components/settings/AboutCard.vue | 74 +++++++++++++++++++++++++++
 1 file changed, 74 insertions(+)

diff --git a/src/components/settings/AboutCard.vue b/src/components/settings/AboutCard.vue
index 8f1f0e9..47c1f52 100644
--- a/src/components/settings/AboutCard.vue
+++ b/src/components/settings/AboutCard.vue
@@ -10,6 +10,47 @@
     <v-card-text>
       <v-row>
         <v-col class="mx-auto" cols="12" md="8">
+          <!-- 捐赠卡片 -->
+          <v-card
+            border
+            class="donation-card gradient-donation clickable mb-6"
+            color="pink-lighten-4"
+            elevation="8"
+            hover
+            rounded="xl"
+            variant="tonal"
+            @click="openDonationLink"
+          >
+            <v-card-item>
+              <div class="card-content">
+                <div>
+                  <div class="text-h6 font-weight-bold">❤️ 支持 Classworks</div>
+                  <div class="text-caption text-medium-emphasis mt-1">
+                    您的捐赠将帮助项目持续发展
+                  </div>
+                </div>
+              </div>
+            </v-card-item>
+            <v-card-text>
+              <p class="text-body-2 mb-3">
+                Classworks 是一个完全开源免费的项目，由社区开发者们利用业余时间维护。
+                如果这个工具对您有帮助，您可以考虑通过爱发电支持开发者。
+              </p>
+              <div class="mt-4">
+                <v-btn
+                  append-icon="mdi-heart"
+                  class="text-none"
+                  color="pink"
+                  rounded="xl"
+                  variant="elevated"
+                  @click="openDonationLink"
+                >
+                  前往爱发电支持开发者
+                </v-btn>
+              </div>
+            </v-card-text>
+          </v-card>
+
           <div class="d-flex flex-column align-start">
             <v-avatar class="mb-4" size="120">
               <v-img
@@ -378,6 +419,10 @@ export default {
       }
     };
 
+    const openDonationLink = () => {
+      window.open('https://afdian.com/a/wydev', '_blank');
+    };
+
     onMounted(() => {
       loadDependencies();
     });
@@ -396,6 +441,7 @@ export default {
       openReportDialog,
       copyEnvInfo,
       openFeedback,
+      openDonationLink,
       envBoxText,
       envInfo,
       reportBody,
@@ -405,3 +451,31 @@ export default {
   },
 };
 </script>
+
+<style scoped>
+.gradient-donation {
+  background: linear-gradient(135deg, rgba(236, 64, 122, 0.15), rgba(233, 30, 99, 0.08) 60%);
+  border: 2px solid rgba(236, 64, 122, 0.25);
+  transition: all 0.3s ease;
+  cursor: pointer;
+}
+
+.gradient-donation:hover {
+  transform: translateY(-4px);
+  box-shadow: 0 8px 24px rgba(236, 64, 122, 0.3) !important;
+}
+
+.gradient-donation:active {
+  transform: translateY(-2px);
+}
+
+.clickable {
+  cursor: pointer;
+}
+
+.card-content {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+</style>

From 0ebc14c49d1ed6de6df3e54cf69813a3b0af67b9 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 3 Feb 2026 00:16:17 +0000
Subject: [PATCH 3/5] Address code review feedback: remove duplicate cursor
 style and add aria-label

Co-authored-by: Sunwuyuan <88357633+Sunwuyuan@users.noreply.github.com>
---
 src/components/settings/AboutCard.vue | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/components/settings/AboutCard.vue b/src/components/settings/AboutCard.vue
index 47c1f52..3630dc1 100644
--- a/src/components/settings/AboutCard.vue
+++ b/src/components/settings/AboutCard.vue
@@ -39,6 +39,7 @@
               <div class="mt-4">
                 <v-btn
                   append-icon="mdi-heart"
+                  aria-label="Support Classworks on Aifadian"
                   class="text-none"
                   color="pink"
                   rounded="xl"
@@ -469,10 +470,6 @@ export default {
   transform: translateY(-2px);
 }
 
-.clickable {
-  cursor: pointer;
-}
-
 .card-content {
   display: flex;
   align-items: center;

From faea0010483b6040e94bf8a06d5a81d917cc341b Mon Sep 17 00:00:00 2001
From: Sunwuyuan <sun@wuyuan.dev>
Date: Tue, 3 Feb 2026 08:21:55 +0800
Subject: [PATCH 4/5] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20AboutCard.vue?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/settings/AboutCard.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/components/settings/AboutCard.vue b/src/components/settings/AboutCard.vue
index 3630dc1..d8f6c1d 100644
--- a/src/components/settings/AboutCard.vue
+++ b/src/components/settings/AboutCard.vue
@@ -24,7 +24,7 @@
             <v-card-item>
               <div class="card-content">
                 <div>
-                  <div class="text-h6 font-weight-bold">❤️ 支持 Classworks</div>
+                  <div class="text-h6 font-weight-bold">请捐赠给 Classworks</div>
                   <div class="text-caption text-medium-emphasis mt-1">
                     您的捐赠将帮助项目持续发展
                   </div>
@@ -33,8 +33,7 @@
             </v-card-item>
             <v-card-text>
               <p class="text-body-2 mb-3">
-                Classworks 是一个完全开源免费的项目，由社区开发者们利用业余时间维护。
-                如果这个工具对您有帮助，您可以考虑通过爱发电支持开发者。
+                我是Classworks的开发者孙悟元，是一名高二的中国在校学生。Classworks 是一个完全开源免费的项目。如果可以，请捐赠我们。
               </p>
               <div class="mt-4">
                 <v-btn
@@ -46,7 +45,7 @@
                   variant="elevated"
                   @click="openDonationLink"
                 >
-                  前往爱发电支持开发者
+                  爱发电
                 </v-btn>
               </div>
             </v-card-text>

From 2964c52581e24388ba8b579458095100e6f026e4 Mon Sep 17 00:00:00 2001
From: Sunwuyuan <sun@wuyuan.dev>
Date: Tue, 3 Feb 2026 08:24:16 +0800
Subject: [PATCH 5/5] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20AboutCard.vue?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/settings/AboutCard.vue | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/components/settings/AboutCard.vue b/src/components/settings/AboutCard.vue
index d8f6c1d..2befa17 100644
--- a/src/components/settings/AboutCard.vue
+++ b/src/components/settings/AboutCard.vue
@@ -24,16 +24,14 @@
             <v-card-item>
               <div class="card-content">
                 <div>
-                  <div class="text-h6 font-weight-bold">请捐赠给 Classworks</div>
-                  <div class="text-caption text-medium-emphasis mt-1">
-                    您的捐赠将帮助项目持续发展
-                  </div>
+                  <div class="text-h6 font-weight-bold">请支持我们 Classworks</div>
+ 
                 </div>
               </div>
             </v-card-item>
             <v-card-text>
               <p class="text-body-2 mb-3">
-                我是Classworks的开发者孙悟元，是一名高二的中国在校学生。Classworks 是一个完全开源免费的项目。如果可以，请捐赠我们。
+                我是Classworks的开发者孙悟元，是一名高二的中国在校学生。Classworks 是一个完全开源免费的项目。如果可以，欢迎打赏。
               </p>
               <div class="mt-4">
                 <v-btn