From 72357e9c376a0468aad6eb1846c0e47aa0ca2b47 Mon Sep 17 00:00:00 2001
From: pengzhanbo <volodymyr@foxmail.com>
Date: Wed, 17 Apr 2024 12:09:57 +0800
Subject: [PATCH] =?UTF-8?q?perf(theme):=20=E4=BC=98=E5=8C=96=E5=8D=9A?=
 =?UTF-8?q?=E5=AE=A2=E5=88=97=E8=A1=A8=E9=A1=B5=E7=BF=BB=E9=A1=B5=E8=BF=87?=
 =?UTF-8?q?=E6=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/client/components/TransitionDrop.vue  | 20 ++++++++++++-------
 theme/src/client/components/VFooter.vue       |  4 ++++
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/theme/src/client/components/TransitionDrop.vue b/theme/src/client/components/TransitionDrop.vue
index 3dab68c2..39e24ed6 100644
--- a/theme/src/client/components/TransitionDrop.vue
+++ b/theme/src/client/components/TransitionDrop.vue
@@ -11,15 +11,20 @@ const props = withDefaults(defineProps<Props>(), {
 
 let _transition = ''
 
-function setStyle(item: Element) {
+function beforeAppear(item: Element) {
   const el = item as HTMLElement
-  if (_transition === '') {
-    const value = window.getComputedStyle(el).transition
-    _transition = value && !value.includes('all') ? `${value}, ` : ''
-  }
   el.style.transform = 'translateY(-20px)'
   el.style.opacity = '0'
-  el.style.transition = `transform ${props.duration}s ease-in-out ${props.delay}s, opacity ${props.duration}s ease-in-out ${props.delay}s`
+}
+function setStyle(item: Element) {
+  const el = item as HTMLElement
+
+  if (!_transition) {
+    const value = typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(el).transition : ''
+    _transition = value && !value.includes('all') ? `${value}, ` : ''
+  }
+
+  el.style.transition = `${_transition}transform ${props.duration}s ease-in-out ${props.delay}s, opacity ${props.duration}s ease-in-out ${props.delay}s`
 }
 
 function unsetStyle(item: Element) {
@@ -35,7 +40,8 @@ function unsetStyle(item: Element) {
     name="drop"
     mode="out-in"
     :appear="appear"
-    @before-appear="setStyle"
+    @appear="setStyle"
+    @before-appear="beforeAppear"
     @after-appear="unsetStyle"
     @enter="setStyle"
     @after-enter="unsetStyle"
diff --git a/theme/src/client/components/VFooter.vue b/theme/src/client/components/VFooter.vue
index d6ad206b..d1404c0c 100644
--- a/theme/src/client/components/VFooter.vue
+++ b/theme/src/client/components/VFooter.vue
@@ -47,6 +47,10 @@ onMounted(() => {
   transition: all var(--t-color);
 }
 
+.footer-no-border .plume-footer {
+  border-top: none;
+}
+
 .plume-footer p {
   color: var(--vp-c-text-2);
   transition: color var(--t-color);