From 1087a4bb1d7d14adca41eb87cd1d0c609e31a801 Mon Sep 17 00:00:00 2001
From: lisonge <i@songe.li>
Date: Sat, 23 Mar 2024 02:12:43 +0800
Subject: [PATCH] fix: box-shadow

---
 src/App.vue                       | 15 ++++++++++++---
 src/components/DraggableCard.vue  |  3 ++-
 src/components/MultiFocusCard.vue |  1 +
 src/views/SnapshotPage.vue        |  1 -
 4 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 9ffa128..93ce977 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -38,8 +38,17 @@ import ErrorDlg from './components/ErrorDlg.vue';
 .box-shadow-dim,
 [box-shadow-dim] {
   box-shadow:
-    rgba(0, 0, 0, 0.2) 0px 11px 15px -7px,
-    rgba(0, 0, 0, 0.14) 0px 24px 38px 3px,
-    rgba(0, 0, 0, 0.12) 0px 9px 46px 8px;
+    0 3px 6px -4px rgba(0, 0, 0, 0.12),
+    0 6px 16px 0 rgba(0, 0, 0, 0.08),
+    0 9px 28px 8px rgba(0, 0, 0, 0.05);
+}
+@media (prefers-color-scheme: dark) {
+  .box-shadow-dim,
+  [box-shadow-dim] {
+    box-shadow:
+      0 3px 6px -4px rgba(0, 0, 0, 0.24),
+      0 6px 12px 0 rgba(0, 0, 0, 0.16),
+      0 9px 18px 8px rgba(0, 0, 0, 0.1);
+  }
 }
 </style>
diff --git a/src/components/DraggableCard.vue b/src/components/DraggableCard.vue
index 50c14e2..b2e9ee7 100644
--- a/src/components/DraggableCard.vue
+++ b/src/components/DraggableCard.vue
@@ -9,6 +9,7 @@ const props = withDefaults(
       top?: number;
       bottom?: number;
     };
+    disabled?: boolean;
   }>(),
   { initialValue: () => ({}) },
 );
@@ -114,7 +115,7 @@ const updateTarget = (arg: unknown) => {
 };
 </script>
 <template>
-  <Teleport to="#app">
+  <Teleport to="#app" :disabled="disabled">
     <div
       fixed
       ref="box"
diff --git a/src/components/MultiFocusCard.vue b/src/components/MultiFocusCard.vue
index a3af8b8..99a4659 100644
--- a/src/components/MultiFocusCard.vue
+++ b/src/components/MultiFocusCard.vue
@@ -29,6 +29,7 @@ const left = _1vw * 25.5;
     :initialValue="{ top: 215, left }"
     v-slot="{ onRef }"
     class="z-2 box-shadow-dim w-420px"
+    :disabled="!focusNodes"
   >
     <NCard v-if="focusNodes" size="small" closable @close="onClose">
       <template #header>
diff --git a/src/views/SnapshotPage.vue b/src/views/SnapshotPage.vue
index 58581d0..870483b 100644
--- a/src/views/SnapshotPage.vue
+++ b/src/views/SnapshotPage.vue
@@ -165,7 +165,6 @@ watch(
       @updateTrack="track = $event"
     />
     <MultiFocusCard
-      v-show="mulitFocus"
       :focusNode="focusNode"
       :focusNodes="mulitFocus"
       @updateFocusNode="