correction scroll preview

src/App.vue

@@ -149,7 +149,6 @@ onMounted(async () => {
   height: 100vh;
   border: none;
   transform-origin: top center;
-  transition: transform 0.3s ease;
 }
 
 

src/components/editor/PageSettings.vue

@@ -195,7 +195,7 @@
 </template>
 
 <script setup>
-import { ref, computed, watch, onMounted, inject } from 'vue';
+import { ref, computed, watch, onMounted, inject, nextTick } from 'vue';
 import bookIcon from '/assets/svg/book.svg?raw';
 import { useStylesheetStore } from '../../stores/stylesheet';
 import { useDebounce } from '../../composables/useDebounce';
@@ -518,7 +518,7 @@ const syncFromStore = () => {
       (rightPageMatch && rightPageMatch[0].includes('string(title)'));
     runningTitle.value = hasRunningTitle;
   } finally {
-    isUpdatingFromStore = false;
+    nextTick(() => { isUpdatingFromStore = false; });
   }
 };
 

src/components/ui/ZoomControls.vue

@@ -11,13 +11,23 @@ import { ref, computed } from 'vue';
 
 const zoomLevel = ref(1);
 
-const zoomIn = () => { zoomLevel.value = Math.min(zoomLevel.value + 0.1, 3); };
-const zoomOut = () => { zoomLevel.value = Math.max(zoomLevel.value - 0.1, 0.2); };
-const zoomReset = () => { zoomLevel.value = 1; };
+const zoomIn = () => { triggerZoom(); zoomLevel.value = Math.min(zoomLevel.value + 0.1, 3); };
+const zoomOut = () => { triggerZoom(); zoomLevel.value = Math.max(zoomLevel.value - 0.1, 0.2); };
+const zoomReset = () => { triggerZoom(); zoomLevel.value = 1; };
+
+const isZooming = ref(false);
+let zoomTimer = null;
+
+const triggerZoom = () => {
+  isZooming.value = true;
+  clearTimeout(zoomTimer);
+  zoomTimer = setTimeout(() => { isZooming.value = false; }, 350);
+};
 
 const zoomStyle = computed(() => ({
   transform: `scale(${zoomLevel.value})`,
   height: `${100 / zoomLevel.value}vh`,
+  transition: isZooming.value ? 'transform 0.3s ease' : 'none',
 }));
 
 defineExpose({ zoomStyle });