x

apps/admin/src/components/page-builder/BlockTranslationModal.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useMemo } from 'react';
+import { createPortal } from 'react-dom';
 import {
   X,
   Copy,
@@ -357,6 +358,11 @@ export default function BlockTranslationModal({
       setActiveTab(initialTab);
       setParseError(null);
       setSuccessMsg(null);
+      const prevOverflow = document.body.style.overflow;
+      document.body.style.overflow = 'hidden';
+      return () => {
+        document.body.style.overflow = prevOverflow;
+      };
     }
   }, [isOpen, initialTab]);
 
@@ -1407,8 +1413,8 @@ ${exportJsonString}
 
   if (!isOpen) return null;
 
-  return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-night-950/80 backdrop-blur-md animate-fade-in">
+  return createPortal(
+    <div className="fixed inset-0 z-[9999] flex items-center justify-center p-4 bg-night-950/80 backdrop-blur-md animate-fade-in">
       <div className="bg-night-900 border border-white/10 rounded-3xl shadow-2xl w-full max-w-4xl max-h-[90vh] flex flex-col overflow-hidden text-slate-200 animate-pop-in">
         {/* Header */}
         <div className="px-6 py-5 border-b border-white/5 flex items-center justify-between bg-gradient-to-r from-white/[0.04] to-transparent shrink-0">
@@ -2035,6 +2041,7 @@ ${exportJsonString}
           </div>
         </div>
       </div>
-    </div>
+    </div>,
+    document.body
   );
 }

apps/admin/src/components/products/ProductTranslationModal.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useMemo } from 'react';
+import { createPortal } from 'react-dom';
 import {
   X,
   Copy,
@@ -142,6 +143,11 @@ export default function ProductTranslationModal({
       setActiveTab(initialTab);
       setParseError(null);
       setSuccessMsg(null);
+      const prevOverflow = document.body.style.overflow;
+      document.body.style.overflow = 'hidden';
+      return () => {
+        document.body.style.overflow = prevOverflow;
+      };
     }
   }, [isOpen, initialTab]);
 
@@ -357,8 +363,8 @@ ${exportJsonString}
 
   if (!isOpen) return null;
 
-  return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-night-950/80 backdrop-blur-md animate-fade-in">
+  return createPortal(
+    <div className="fixed inset-0 z-[9999] flex items-center justify-center p-4 bg-night-950/80 backdrop-blur-md animate-fade-in">
       <div className="bg-night-900 border border-white/10 rounded-3xl shadow-2xl w-full max-w-4xl max-h-[90vh] flex flex-col overflow-hidden text-slate-200 animate-pop-in">
         {/* Header */}
         <div className="px-6 py-5 border-b border-white/5 flex items-center justify-between bg-gradient-to-r from-white/[0.04] to-transparent shrink-0">
@@ -689,6 +695,7 @@ ${exportJsonString}
           </div>
         </div>
       </div>
-    </div>
+    </div>,
+    document.body
   );
 }