Context menu text is too big when using Native titlebar style on system with KDE

[pacifi5t]

Type: Bug

Does this issue occur when all extensions are disabled?: Yes VS Code Version: 1.92 OS Version: Arch Linux with latest updates (08.02.2024)

Steps to Reproduce:

1. Open the editor
2. Try editing some file
3. Click right mouse button in the editor to trigger the context menu

The same happens when you click on the 'Manage' or 'Accounts' button in the bottom-left corner.

VS Code version: Code 1.92.0 (b1c0a14de1414fcdaa400695b4db1c0799bc3124, 2024-07-31T23:26:45.634Z) OS version: Linux x64 6.10.2-zen1-1-zen Modes:

System Info

|Item|Value| |---|---| |CPUs|AMD Ryzen 5 1600 Six-Core Processor (12 x 3300)| |GPU Status|2d_canvas: enabled
canvas_oop_rasterization: enabled_on
direct_rendering_display_compositor: disabled_off_ok
gpu_compositing: enabled
multiple_raster_threads: enabled_on
opengl: enabled_on
rasterization: enabled
raw_draw: disabled_off_ok
skia_graphite: disabled_off
video_decode: enabled
video_encode: disabled_software
vulkan: disabled_off
webgl: enabled
webgl2: enabled
webgpu: disabled_off
webnn: disabled_off| |Load (avg)|3, 2, 2| |Memory (System)|15.57GB (8.03GB free)| |Process Argv|| |Screen Reader|no| |VM|0%| |DESKTOP_SESSION|plasma| |XDG_CURRENT_DESKTOP|KDE| |XDG_SESSION_DESKTOP|KDE| |XDG_SESSION_TYPE|wayland|

Extensions (42)

Extension|Author (truncated)|Version ---|---|--- tsl-problem-matcher|amo|0.6.2 vscode-tailwindcss|bra|0.12.5 ruff|cha|2024.36.0 dart-code|Dar|3.94.0 flutter|Dar|3.94.0 vscode-markdownlint|Dav|0.55.0 vscode-eslint|dba|3.0.10 EditorConfig|Edi|0.16.4 prettier-vscode|esb|10.4.0 bloc|Fel|6.6.6 svg|joc|1.5.4 rainbow-csv|mec|3.12.0 mesonbuild|mes|1.25.1 git-graph|mhu|1.30.0 vscode-docker|ms-|1.29.1 debugpy|ms-|2024.10.0 python|ms-|2024.12.1 vscode-pylance|ms-|2024.7.1 jupyter|ms-|2024.7.0 jupyter-keymap|ms-|1.1.2 jupyter-renderers|ms-|1.0.19 vscode-jupyter-cell-tags|ms-|0.1.9 vscode-jupyter-slideshow|ms-|0.1.6 remote-containers|ms-|0.380.0 remote-ssh|ms-|0.112.0 remote-ssh-edit|ms-|0.86.0 cmake-tools|ms-|1.18.44 cpptools|ms-|1.21.5 extension-test-runner|ms-|0.0.11 remote-explorer|ms-|0.4.3 bun-vscode|ove|0.0.12 material-icon-theme|PKi|5.8.0 vscode-xml|red|0.27.1 vscode-yaml|red|1.15.0 rust-analyzer|rus|0.3.2053 lua|sum|3.10.1 svelte-vscode|sve|108.6.0 cmake|twx|0.0.17 vscode-lldb|vad|1.10.0 gitblame|wad|11.0.1 vscode-todo-highlight|way|1.0.5 markdown-all-in-one|yzh|3.6.2

[chapmanjacobd]

Yeah I really don't like the new context menu. This issue seems to be a duplicate of https://github.com/microsoft/vscode/issues/224515

[pacifi5t]

Yeah I really don't like the new context menu. This issue seems to be a duplicate of #224515

Oh, it really is. I saw this issue when I was looking for some existing ones, but I forgot to scroll to see the same problem in the issue you mentioned.

[akalankasakalasooriya]

Same happened to me. https://github.com/microsoft/vscode/issues/225033

[FranzKnut]

when using Native titlebar style

Thank you for providing a fix btw :)

[vladlabs]

Moreover colors from the current VSCode theme does not apply to it. My desctop UI menus are light and VSCode theme is dark. It was working on previous version before 1.92.0

[firavoyage]

here on ubuntu24 same happened. fuck

[PeepoFrog]

same issue, ubuntu 22.04

[ra50]

Same here on Mint 21.3. Menus too large, text too bold. Setting window.titleBarStyle to custom fixes it. But that should not be necessary. The way menus look with custom title bar should be the same with native title bar.

[luponata]

Same, Ubuntu 20.04.6 LTS

[BlueRexPY]

Same, Pop!_OS 22.04 LTS

[jesse-w1]

Same, Ubuntu 22.04.5 LTS

[aerograph]

Same, Ubuntu 22.04.5 LTS

VS-Code version 1.94.2 384ff7382de624fb94dbaf6da11977bba1ecd427

[ElHyperion]

Same on KDE Plasma 6.1.5, VS Code 1.95.0-1

The colours follow my system theme which is expected of a native dropdown, but its style is way too different and the background doesn't blur like my native dropdown does.

This is how the native menu looks like everywhere else on my desktop:

In VS Code:

[Shilionz]

Just suggestion. It would be great to separate the configuration of "window.titleBarStyle" into two distinct settings: "window.titleBarStyle" and "window.contextMenuStyle". This would allow users to choose a "custom" style for the context menu while keeping the title bar as the native style. Currently, setting "window.titleBarStyle" to "custom" causes the window decoration to be lost on Wayland, or some users may just prefer to retain the native title bar style.