Settings: layout bug

[warpdesign]

• VSCode Version: 1.28-insider (2558a72)
• OS Version: OSX 10.12.6

Steps to Reproduce:

1. Split the editor like in the first screenshot
2. Open the settings panel

The categories overwrite each setting, making the panel barely readable.

The weird thing is that reducing the Settings tab width fixes the problem, because it's reaching a media query limit I guess.

Does this issue occur when all extensions are disabled?: Yes

First screenshot:

Second screenshot (reduced tab width):

My screen resolution: 27" 2560x1440 with default OSX scale.

[roblourens]

Can you update Insiders and try again? There were some layout changes in the last build and I can't repro.

If so, is it easy to repro or just at a certain width? Do you see it only in search mode or also in non-search mode?

[warpdesign]

@roblourens I updated to build fe8d9d2 But there are still bugs:

[roblourens]

I still can't repro this, can you come up with steps to repro the issue from a clean state?

Or if you can inspect that TOC element in chrome devtools and show me how it's getting over there, that would be very helpful.

[warpdesign]

Opening VSCode, splitting it in 3 columns, selecting the middle column and opening preferences is enough to trigger the layer bug.

Here is the inspector on the TOC element:

[warpdesign]

After more tests it seems it's related to the theme I'm using: this only happens with the Nord theme.

I was pretty sure I had tried with extensions disabled :/

I opened up an issue there: nordtheme/visual-studio-code#101

[roblourens]

So weird! I can repro with Nord too. I see the issue, tbh, I don't know why it doesn't look that way all the time.

[warpdesign]

That was fast! :)