fix: account for rect with zoom values applied
parent
c6828b3140
commit
b52ebaf45a
|
@ -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 = {
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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 */
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue