fix: refine iframe transition timing and default values

- Adjust transition duration to 200ms for smoother crossfade
- Add explicit default values for iframe transform properties
- Simplify transition with 'all' shorthand
- Set explicit transition duration for editor panel

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
isUnknown 2025-12-05 15:05:40 +01:00
parent a934736e2c
commit ca95546180
2 changed files with 6 additions and 4 deletions

View file

@ -113,7 +113,7 @@ const renderPreview = async (shouldReloadFromFile = false) => {
// Swap current frame
currentFrameIndex.value = currentFrameIndex.value === 1 ? 2 : 1;
isTransitioning = false;
}, 100); // Match CSS transition duration
}, 200); // Match CSS transition duration
}, 50); // Small delay to ensure scroll is set
}, 200); // Wait for PagedJS
};
@ -158,8 +158,10 @@ onMounted(() => renderPreview(true));
width: 100vw;
height: 100vh;
border: none;
transition: opacity 0.1s ease-in-out, margin-left ease-in-out var(--curve),
transform ease-in-out var(--curve), height ease-in-out var(--curve);
margin-left: 0;
transform: scale(1) translateY(0);
height: 100vh;
transition: all 0.2s ease-in-out var(--curve);
}
.preview-frame.shifted {

View file

@ -85,7 +85,7 @@ nav {
background-color: var(--color-panel-bg);
box-shadow: -5px 0px 12px;
transition: left ease-in-out var(--curve);
transition: left 0.3s var(--curve);
}
.tab-content.open {