From ecd02793d4ddf42c03b1f3d3d96e6db0c730d654 Mon Sep 17 00:00:00 2001
From: Cat Tom <linweijie2015@gmail.com>
Date: Wed, 26 Mar 2025 11:34:07 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=20WechatModal=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E7=9A=84=E6=A0=B7=E5=BC=8F=E5=92=8C=E5=8A=A8?=
 =?UTF-8?q?=E7=94=BB=E6=95=88=E6=9E=9C=EF=BC=8C=E4=BD=BF=E7=94=A8=20grid?=
 =?UTF-8?q?=20=E5=B8=83=E5=B1=80=E5=92=8C=E6=96=B0=E5=A2=9E=E6=B7=A1?=
 =?UTF-8?q?=E5=85=A5=E7=BC=A9=E6=94=BE=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/WechatModal.vue | 39 ++++++++++++++++++++++------------
 1 file changed, 25 insertions(+), 14 deletions(-)

diff --git a/src/components/WechatModal.vue b/src/components/WechatModal.vue
index 9938490..ea62f35 100644
--- a/src/components/WechatModal.vue
+++ b/src/components/WechatModal.vue
@@ -203,14 +203,11 @@ onUnmounted(() => {
 .wechat-modal-mask {
   position: fixed;
   z-index: v-bind('zIndex');
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
+  inset: 0;
   background-color: rgba(0, 0, 0, 0.6);
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  display: grid;
+  place-items: center;
+  animation: fadeIn 0.3s ease;
   backdrop-filter: blur(8px);
   transition: opacity 0.3s ease;
 }
@@ -372,15 +369,29 @@ onUnmounted(() => {
   }
 }
 
-/* 过渡动画 */
-.wechat-modal-enter-from,
-.wechat-modal-leave-to {
-  opacity: 0;
+/* 独立卡片动画 */
+@keyframes fadeIn {
+  from { opacity: 0; }
+  to { opacity: 1; }
 }
 
-.wechat-modal-enter-from .wechat-modal-container,
-.wechat-modal-leave-to .wechat-modal-container {
-  transform: scale(0.8);
+@keyframes scaleUp {
+  from {
+    transform: scale(0.8) translateY(20px);
+    opacity: 0;
+  }
+  to {
+    transform: scale(1) translateY(0);
+    opacity: 1;
+  }
+}
+
+.wechat-modal-enter-active .wechat-modal-container {
+  animation: scaleUp 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.1);
+}
+
+.wechat-modal-leave-active .wechat-modal-container {
+  animation: scaleUp 0.2s reverse;
 }
 
 .wechat-modal-enter-active .wechat-modal-container,