From fe2396f346e20e224eb81f7d8c35d5223c0040a5 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Mon, 3 Nov 2025 08:38:49 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E3=80=90ele=E3=80=91=E3=80=90mall?=
 =?UTF-8?q?=E3=80=91diy-editor=20=E7=9A=84=20floating-action-button=20?=
 =?UTF-8?q?=E4=BD=BF=E7=94=A8=20tailwindcss=20=E7=AE=80=E5=8C=96=20style?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../mobile/floating-action-button/index.vue     | 17 +++++------------
 1 file changed, 5 insertions(+), 12 deletions(-)

diff --git a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue
index d0c2ae410..82e1a6fff 100644
--- a/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue
+++ b/apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/floating-action-button/index.vue
@@ -62,21 +62,14 @@ function handleToggleFab() {
     </ElButton>
   </div>
   <!-- 模态背景：展开时显示，点击后折叠 -->
-  <div v-if="expanded" class="modal-bg" @click="handleToggleFab"></div>
+  <div
+    v-if="expanded"
+    class="absolute left-[calc(50%-375px/2)] top-0 z-[11] h-full w-[375px] bg-black/40"
+    @click="handleToggleFab"
+  ></div>
 </template>
 
 <style scoped lang="scss">
-/* 模态背景 */
-.modal-bg {
-  position: absolute;
-  top: 0;
-  left: calc(50% - 375px / 2);
-  z-index: 11;
-  width: 375px;
-  height: 100%;
-  background-color: rgb(0 0 0 / 40%);
-}
-
 .fab-icon {
   transform: rotate(0deg);
   transition: transform 0.3s;