fix: account for rect with zoom values applied

pull/234970/head
deepak1556 2024-12-02 21:11:58 +09:00
parent c6828b3140
commit b52ebaf45a
No known key found for this signature in database
GPG Key ID: FCF39462ECA97661
4 changed files with 8 additions and 27 deletions

View File

@ -275,16 +275,11 @@ export class ContextView extends Disposable {
if (DOM.isHTMLElement(anchor)) {
const elementPosition = DOM.getDomNodePagePosition(anchor);
// In areas where zoom is applied to the element or its ancestors, we need to adjust the size of the element
// e.g. The title bar has counter zoom behavior meaning it applies the inverse of zoom level.
// Window Zoom Level: 1.5, Title Bar Zoom: 1/1.5, Size Multiplier: 1.5
const zoom = DOM.getDomNodeZoomLevel(anchor);
around = {
top: elementPosition.top * zoom,
left: elementPosition.left * zoom,
width: elementPosition.width * zoom,
height: elementPosition.height * zoom
top: elementPosition.top,
left: elementPosition.left,
width: elementPosition.width,
height: elementPosition.height
};
} else if (isAnchor(anchor)) {
around = {

View File

@ -1011,7 +1011,6 @@ export class MenuBar extends Disposable {
customMenu.buttonElement.classList.add('open');
const titleBoundingRect = customMenu.titleElement.getBoundingClientRect();
const titleBoundingRectZoom = DOM.getDomNodeZoomLevel(customMenu.titleElement);
if (this.options.compactMode?.horizontal === HorizontalDirection.Right) {
menuHolder.style.left = `${titleBoundingRect.left + this.container.clientWidth}px`;
@ -1020,7 +1019,7 @@ export class MenuBar extends Disposable {
menuHolder.style.right = `${windowWidth - titleBoundingRect.left}px`;
menuHolder.style.left = 'auto';
} else {
menuHolder.style.left = `${titleBoundingRect.left * titleBoundingRectZoom}px`;
menuHolder.style.left = `${titleBoundingRect.left}px`;
}
if (this.options.compactMode?.vertical === VerticalDirection.Above) {
@ -1029,7 +1028,7 @@ export class MenuBar extends Disposable {
} else if (this.options.compactMode?.vertical === VerticalDirection.Below) {
menuHolder.style.top = `${titleBoundingRect.top}px`;
} else {
menuHolder.style.top = `${titleBoundingRect.bottom * titleBoundingRectZoom}px`;
menuHolder.style.top = `${titleBoundingRect.bottom}px`;
}
customMenu.buttonElement.appendChild(menuHolder);

View File

@ -321,19 +321,7 @@ export class HoverWidget extends Widget implements IHoverWidget {
this._hover.containerDomNode.classList.remove('right-aligned');
this._hover.contentsDomNode.style.maxHeight = '';
const getZoomAccountedBoundingClientRect = (e: HTMLElement) => {
const zoom = dom.getDomNodeZoomLevel(e);
const boundingRect = e.getBoundingClientRect();
return {
top: boundingRect.top * zoom,
bottom: boundingRect.bottom * zoom,
right: boundingRect.right * zoom,
left: boundingRect.left * zoom,
};
};
const targetBounds = this._target.targetElements.map(e => getZoomAccountedBoundingClientRect(e));
const targetBounds = this._target.targetElements.map(e => e.getBoundingClientRect());
const { top, right, bottom, left } = targetBounds[0];
const width = right - left;
const height = bottom - top;

View File

@ -230,8 +230,7 @@
margin-left: 4px;
}
.monaco-workbench .part.titlebar > .titlebar-container.counter-zoom .menubar .menubar-menu-button > .menubar-menu-items-holder.monaco-menu-container,
.monaco-workbench .part.titlebar > .titlebar-container.counter-zoom .monaco-toolbar .dropdown-action-container {
.monaco-workbench .part.titlebar > .titlebar-container.counter-zoom .menubar .menubar-menu-button > .menubar-menu-items-holder.monaco-menu-container {
zoom: var(--zoom-factor); /* helps to position the menu properly when counter zooming */
}