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:
@@ -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]
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user