fix(k8s): YAML 弹框 Portal 到 body 修复居中偏移

PageTransition 的 transform 会使 fixed 弹框相对页面定位而非视口,
YamlViewer 尺寸较大时容易跑出可视区。统一用 ModalOverlay Portal。
This commit is contained in:
Logan.Li committed 2026-06-26 15:04:08 +08:00
1 parent 025e74ff4d
commit 729f25e068
4 files changed
+42 -9

No files matched your search

@@ -0,0 +1,24 @@
// ModalOverlay — Portal 到 body,避免父级 transform 导致 fixed 弹框偏移 // Logan.Li
import { createPortal } from 'react-dom';
interface ModalOverlayProps {
onClose: () => void;
children: React.ReactNode;
/** 遮罩 z-index,默认高于 Sidebar/Header */
zIndex?: number;
}
export function ModalOverlay({ onClose, children, zIndex = 100 }: ModalOverlayProps) {
return createPortal(
<div
className="fixed inset-0 overflow-y-auto bg-black/60"
style={{ zIndex }}
onClick={onClose}
>
<div className="flex min-h-full items-center justify-center p-4">
{children}
</div>
</div>,
document.body,
);
}