From f41064086248a5b2ceee22152bf1f8b3930c4cc7 Mon Sep 17 00:00:00 2001
From: sagitchu <sagitchu@gmail.com>
Date: Tue, 10 Mar 2026 20:11:49 +0800
Subject: [PATCH] fix: calculate info popover placement relative to card
 container

Changed info popover position calculation to use the card container
as reference instead of viewport, ensuring consistent placement within
card boundaries.
---
 vite-frontend/src/pages/node.tsx | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/vite-frontend/src/pages/node.tsx b/vite-frontend/src/pages/node.tsx
index e0e56cc..6783693 100644
--- a/vite-frontend/src/pages/node.tsx
+++ b/vite-frontend/src/pages/node.tsx
@@ -388,10 +388,20 @@ export default function NodePage() {
       }
 
       const rect = triggerElement.getBoundingClientRect();
+      const cardElement = triggerElement.closest("[data-node-card='true']");
+      const cardRect =
+        cardElement instanceof HTMLElement
+          ? cardElement.getBoundingClientRect()
+          : null;
       const estimatedPanelWidth = 288;
-      const viewportPadding = 24;
+      const containerPadding = 16;
+      const availableLeftSpace = cardRect
+        ? rect.left - cardRect.left
+        : rect.left;
       const nextPlacement: "left" | "bottom" =
-        rect.left >= estimatedPanelWidth + viewportPadding ? "left" : "bottom";
+        availableLeftSpace >= estimatedPanelWidth + containerPadding
+          ? "left"
+          : "bottom";
 
       setInfoPopoverPlacement((prev) =>
         prev[nodeId] === nextPlacement
@@ -1689,6 +1699,7 @@ export default function NodePage() {
                   <SortableItem key={node.id} id={node.id}>
                     {(listeners) => (
                       <Card
+                        data-node-card="true"
                         key={node.id}
                         className={`group relative overflow-visible shadow-sm border border-divider hover:shadow-md transition-shadow duration-200 h-full flex flex-col ${expiryMeta.accentClassName}`}
                       >