fix(frontend): fix find widget tooltip flicker, clipping, and close button alignment

- Prevent hover tooltip flicker by adding pointer-events:none to the
  .context-view overlay that covers trigger buttons
- Escape overflow:hidden clipping on ancestor elements by switching the
  tooltip overlay to position:fixed, with CSS custom properties
  (--cv-offset-x/y) set via ResizeObserver to translate container-relative
  coordinates to viewport-relative
- Give the find widget its own border/radius styles (no top border,
  bottom-only border-radius) since it slides from the editor top
- Adjust close button vertical position to align with action buttons

Closes #73

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
xintaofei
2026-04-13 12:08:00 +08:00
parent 41b28001af
commit 917ff9a672
2 changed files with 44 additions and 1 deletions

View File

@@ -1014,6 +1014,21 @@ export function FileWorkspacePanel() {
setCursorLine(editorInstance.getPosition()?.lineNumber ?? 1)
applyHiddenAreas()
applyGitChangeDecorations()
// Set CSS custom properties so hover tooltips can use position:fixed
// to escape overflow:hidden clipping on ancestor elements.
const dom = editorInstance.getContainerDomNode()
if (dom) {
const syncOffset = () => {
const r = dom.getBoundingClientRect()
dom.style.setProperty("--cv-offset-x", `${r.left}px`)
dom.style.setProperty("--cv-offset-y", `${r.top}px`)
}
syncOffset()
const ro = new ResizeObserver(syncOffset)
ro.observe(dom)
editorInstance.onDidDispose(() => ro.disconnect())
}
},
[applyGitChangeDecorations, applyHiddenAreas]
)