diff --git a/apps/web/src/components/editor/preview-panel.tsx b/apps/web/src/components/editor/preview-panel.tsx index b7e38cbc..af603e97 100644 --- a/apps/web/src/components/editor/preview-panel.tsx +++ b/apps/web/src/components/editor/preview-panel.tsx @@ -53,9 +53,11 @@ export function PreviewPanel() { let availableWidth, availableHeight; if (isExpanded) { - // Use full viewport when expanded - availableWidth = window.innerWidth; - availableHeight = window.innerHeight; + // Use full viewport when expanded, accounting for controls and margin + const controlsHeight = 80; // Approximate height of controls area + const marginSpace = 24; // m-3 = 12px on each side = 24px total + availableWidth = window.innerWidth - marginSpace; + availableHeight = window.innerHeight - controlsHeight - marginSpace; } else { container = containerRef.current.getBoundingClientRect(); const computedStyle = getComputedStyle(containerRef.current);