Fix: Eliminate Dead Space in Page Builder Layout

[DJJones66]

🛠️ Fix: Eliminate Dead Space in Page Builder Layout

📌 Summary

This PR addresses unwanted horizontal scrolling and right-side dead space in the Plugin Studio Unified Layout and Unified Page Renderer Adapter. The issue was caused by container elements exceeding their parent width, resulting in horizontal overflow and inconsistent rendering behavior.

---

🐞 Problem

• The main content area in PluginStudioLayoutUnified allowed both horizontal and vertical overflow, which caused horizontal scrollbars and dead space beyond the visible canvas.
• In PluginStudioAdapter, containers (.unified-page-renderer, .layout-engine, .responsive-container) and the grid background were configured with min-width: 100vw, which locked them to the viewport rather than the container.
  This produced right-side blank space and misaligned layouts.

---

✅ Solution

1. PluginStudioLayoutUnified.tsx

   • Replaced overflow: auto with explicit overflowY: auto and overflowX: hidden.
   • Added width: 100%, maxWidth: 100%, and minWidth: 0 to enforce container sizing without horizontal bleed.

2. PluginStudioAdapter.tsx

   • Updated CSS for unified container classes:

     • Added max-width: 100% and overflow-x: hidden.
     • Replaced min-width: 100vw with min-width: 100% to align with container width instead of viewport width.

   • Strengthened grid container constraints with max-width: 100%.

---

🧪 Test Coverage

• Verified across multiple layouts in Plugin Studio:

  • No horizontal scrollbars appear during normal use.
  • Dead space on the right side is eliminated.
  • Vertical scrolling remains functional for long content.

• Confirmed behavior in both light and dark modes.

---

🗂️ Affected Files

• PluginStudioLayoutUnified.tsx — Hardened container overflow handling
• PluginStudioAdapter.tsx — CSS adjustments to prevent horizontal overflow and viewport bleed