Update playwright_model.py

playwright_model.py

@@ -40,29 +40,39 @@ async def capture_workflows(public_url: str, pdf_filename: str = "workflow_scree
                 })();
             """)
 
-        # --- Auto-detect top bar and fix sidebar below it ---
-        async def fix_sidebar_permanently():
+        # --- Fix only sidebar; keep top bar dynamic per screen ---
+        async def fix_layout_dynamically():
             try:
                 await page.evaluate("""
                     const sidebar = document.querySelector('aside, .sidebar, nav');
-                    const topbar = document.querySelector('.topbar, header, .header, .app-header, .navbar, .page-header');
-
-                    let topOffset = 0;
-                    if (topbar) {
-                        const rect = topbar.getBoundingClientRect();
-                        topOffset = rect.bottom || rect.height || 60;
-                    }
+                    const topbar = document.querySelector('.top-bar, header, .app-header, .navbar, .page-header');
+
+                    // Reset old fixed styles
+                    [sidebar, topbar].forEach(el => {
+                        if (!el) return;
+                        el.style.position = '';
+                        el.style.top = '';
+                        el.style.left = '';
+                        el.style.width = '';
+                        el.style.height = '';
+                        el.style.zIndex = '';
+                        el.style.overflow = '';
+                        el.style.transition = '';
+                    });
 
+                    // Fix sidebar only (topbar remains dynamic)
                     if (sidebar) {
                         const rect = sidebar.getBoundingClientRect();
                         const sidebarWidth = rect.width || sidebar.offsetWidth || 220;
+                        const topOffset = topbar ? topbar.offsetHeight || 60 : 60;
+
                         sidebar.style.position = 'fixed';
                         sidebar.style.top = topOffset + 'px';
                         sidebar.style.left = '0';
                         sidebar.style.height = `calc(100vh - ${topOffset}px)`;
                         sidebar.style.width = sidebarWidth + 'px';
                         sidebar.style.zIndex = '1000';
-                        sidebar.style.overflow = 'hidden';
+                        sidebar.style.overflow = 'auto';
                         sidebar.style.transition = 'none';
                         sidebar.dataset.locked = 'true';
                     }
@@ -70,21 +80,19 @@ async def capture_workflows(public_url: str, pdf_filename: str = "workflow_scree
                     const main = document.querySelector('main, .main-content, .app-body, .content');
                     if (main && sidebar) {
                         main.style.marginLeft = sidebar.offsetWidth + 'px';
+                        main.style.marginTop = topbar ? (topbar.offsetHeight || 60) + 'px' : '0';
                         main.style.position = 'relative';
                     }
 
                     window.scrollTo(0, 0);
-                    document.body.style.margin = '0';
-                    document.body.style.padding = '0';
-                    document.body.style.overflowX = 'hidden';
                 """)
             except Exception as e:
-                print(f"[WARN] Sidebar fix failed: {e}")
+                print(f"[WARN] Layout fix failed: {e}")
 
         # --- Wait until sidebar exists ---
         await page.wait_for_selector("aside, .sidebar, nav", timeout=5000)
         await wait_for_layout_stable()
-        await fix_sidebar_permanently()
+        await fix_layout_dynamically()
         await asyncio.sleep(1)
 
         # --- JS Logic: detect workflows and tabs dynamically ---
@@ -175,12 +183,12 @@ async def capture_workflows(public_url: str, pdf_filename: str = "workflow_scree
             print(f"📸 Capturing main screen: {screen_name}")
 
             await wait_for_layout_stable()
-            await fix_sidebar_permanently()
+            await fix_layout_dynamically()
             await asyncio.sleep(1.0)
             await page.screenshot(path=screenshot_path, full_page=True)
             screenshots.append(screenshot_path)
 
-            # --- Sub-tabs ---
+            # --- Capture sub-tabs ---
             first_active_skipped = False
             for sub in sub_screens:
                 is_active = await page.evaluate(
@@ -200,7 +208,7 @@ async def capture_workflows(public_url: str, pdf_filename: str = "workflow_scree
                 print(f"   ↳ Capturing sub-screen: {sub}")
                 await page.evaluate(f"window.__clickSubScreen('{sub}')")
                 await wait_for_layout_stable()
-                await fix_sidebar_permanently()
+                await fix_layout_dynamically()
                 await asyncio.sleep(1.0)
 
                 sub_name_clean = sub.replace(" ", "_").lower()