diff --git a/package-lock.json b/package-lock.json
index 386ad3e..b6e0bf1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,6 +14,7 @@
"github-calendar": "^2.3.4",
"js-yaml": "^4.1.0",
"vue": "^3.5.13",
+ "vue-page-transition": "^0.2.2",
"vue-router": "^4.5.0",
"yaml": "^2.7.0"
},
@@ -1909,6 +1910,12 @@
}
}
},
+ "node_modules/vue-page-transition": {
+ "version": "0.2.2",
+ "resolved": "https://registry.npmjs.org/vue-page-transition/-/vue-page-transition-0.2.2.tgz",
+ "integrity": "sha512-qOx+llJ28XX0VwJNJ4GVaeNBPRmPMZac2QQgrIHVUhpXyJx2CQ2XvoQOpGD1ge7QMY3PjZ6fwTbdBwZkA3I9qA==",
+ "license": "MIT"
+ },
"node_modules/vue-router": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.5.0.tgz",
diff --git a/package.json b/package.json
index 3801a24..5cf9b1d 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
"github-calendar": "^2.3.4",
"js-yaml": "^4.1.0",
"vue": "^3.5.13",
+ "vue-page-transition": "^0.2.2",
"vue-router": "^4.5.0",
"yaml": "^2.7.0"
},
diff --git a/src/App.vue b/src/App.vue
index 70f5871..2c381b7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -6,8 +6,10 @@ import AppFooter from "./components/AppFooter.vue";
@@ -27,4 +29,14 @@ html, body {
.main-content {
flex: 1; /* 占据剩余空间 */
}
+
+.fade-enter-active,
+.fade-leave-active {
+ transition: opacity 0.5s ease;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+ opacity: 0;
+}
diff --git a/src/components/AppFooter.vue b/src/components/AppFooter.vue
index dbde3d8..0c8e87b 100644
--- a/src/components/AppFooter.vue
+++ b/src/components/AppFooter.vue
@@ -2,6 +2,7 @@