diff --git a/src/vs/base/browser/ui/menu/menubar.ts b/src/vs/base/browser/ui/menu/menubar.ts index fd1935bf870..9c2dd35ded4 100644 --- a/src/vs/base/browser/ui/menu/menubar.ts +++ b/src/vs/base/browser/ui/menu/menubar.ts @@ -18,7 +18,7 @@ import { Emitter, Event } from '../../../common/event.js'; import { KeyCode, KeyMod, ScanCode, ScanCodeUtils } from '../../../common/keyCodes.js'; import { ResolvedKeybinding } from '../../../common/keybindings.js'; import { Disposable, DisposableStore, dispose, IDisposable } from '../../../common/lifecycle.js'; -import { isMacintosh, isWindows } from '../../../common/platform.js'; +import { isLinux, isMacintosh, isWindows } from '../../../common/platform.js'; import * as strings from '../../../common/strings.js'; import './menubar.css'; import * as nls from '../../../../nls.js'; @@ -1082,9 +1082,10 @@ export class MenuBar extends Disposable { menuHolder.style.opacity = '1'; menuHolder.style.pointerEvents = 'auto'; - // On Windows, append dropdown to document.body to avoid stacking context issues + // On Windows and Linux, append dropdown to document.body to avoid stacking context issues // where the dropdown renders behind the workbench content - if (isWindows) { + // Linux experiences the same stacking context issues as Windows + if (isWindows || isLinux) { const window = DOM.getWindow(this.container); window.document.body.appendChild(menuHolder); } else { diff --git a/src/vs/workbench/contrib/cortexide/browser/react/src/util/inputs.tsx b/src/vs/workbench/contrib/cortexide/browser/react/src/util/inputs.tsx index 9e9ea7c67d4..14c93cdec2e 100644 --- a/src/vs/workbench/contrib/cortexide/browser/react/src/util/inputs.tsx +++ b/src/vs/workbench/contrib/cortexide/browser/react/src/util/inputs.tsx @@ -4,6 +4,7 @@ *--------------------------------------------------------------------------------------*/ import React, { forwardRef, ForwardRefExoticComponent, MutableRefObject, RefAttributes, useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'; +import { createPortal } from 'react-dom'; import { IInputBoxStyles, InputBox } from '../../../../../../../base/browser/ui/inputbox/inputBox.js'; import { defaultCheckboxStyles, defaultInputBoxStyles, defaultSelectBoxStyles } from '../../../../../../../platform/theme/browser/defaultStyles.js'; import { SelectBox } from '../../../../../../../base/browser/ui/selectBox/selectBox.js'; @@ -1497,8 +1498,8 @@ export const VoidCustomDropdownBox = >({ - {/* Dropdown Menu */} - {isOpen && ( + {/* Dropdown Menu - Use portal to render to document.body to avoid stacking context issues on Linux */} + {isOpen && typeof document !== 'undefined' && createPortal(
>({ })}
- + , + document.body )} );