From b3bd5aded524fe8313d0524d02fbf06afaf8d5b0 Mon Sep 17 00:00:00 2001
From: Pang <aipaw@live.cn>
Date: Mon, 8 Jan 2024 00:25:37 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E6=BB=91=E5=8A=A8?=
 =?UTF-8?q?=E8=BF=94=E5=9B=9E=E5=8A=A8=E7=94=BB=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/assets/js/components/Mobile/Back.vue |  3 +--
 resources/assets/sass/components/mobile.scss   | 13 +++++++++----
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/resources/assets/js/components/Mobile/Back.vue b/resources/assets/js/components/Mobile/Back.vue
index ac747614d..35e11589f 100644
--- a/resources/assets/js/components/Mobile/Back.vue
+++ b/resources/assets/js/components/Mobile/Back.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="mobile-back">
-        <div v-if="isVisible" class="back-semicircle" :style="style"></div>
+        <div v-if="isVisible && x > 20" class="back-semicircle" :style="style"></div>
     </div>
 </template>
 
@@ -54,7 +54,6 @@ export default {
                 maxTop = this.windowHeight - offset;
             return {
                 top: Math.min(top, maxTop) + 'px',
-                left: this.x > 20 ? 0 : '-50px',
             }
         },
 
diff --git a/resources/assets/sass/components/mobile.scss b/resources/assets/sass/components/mobile.scss
index 6e6ee4ef3..02414fe53 100644
--- a/resources/assets/sass/components/mobile.scss
+++ b/resources/assets/sass/components/mobile.scss
@@ -98,11 +98,16 @@
         z-index: 9999;
         border-radius: 50%;
         transform: translate(-460px, -50%);
-        transition: left 0.2s;
+        animation: mobile-back-animation 200ms forwards;
+    }
+}
 
-        &.show-back {
-            left: 0;
-        }
+@keyframes mobile-back-animation {
+    from {
+        left: -50px;
+    }
+    to {
+        left: 0;
     }
 }