Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improve x and y position

Browse Source
This commit is contained in:
Abi Raja 2024-05-29 14:48:01 -04:00
parent 97cdb093a5
commit 608ba5cc6f
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/src/components/Preview.tsx
View File

@ -53,9 +53,20 @@ function Preview({ code, device }: Props) {
// Highlight the selected element // Highlight the selected element
updateHighlight(targetElement); updateHighlight(targetElement);
// Show popup at click position // Show popup at click position, slightly offset to be right under the cursor
setPopupVisible(false); setPopupVisible(false);
setPopupPosition({ x: clientX, y: clientY });
// Calculate offsets
const rect = iframeRef.current?.getBoundingClientRect();
const offsetX = rect ? rect.left : 0;
const offsetY = rect ? rect.top : 0;
// Adjust for scale
const scale = 1; // the scale factor applied to the iframe
const scaledX = clientX / scale + offsetX;
const scaledY = clientY / scale + offsetY;
setPopupPosition({ x: scaledX, y: scaledY });
setPopupVisible(true); setPopupVisible(true);
} }