Missing panel borders

[arcticicestudio]

Even though Nord follows a flat style concept, there are some components that require a kind of visual separator to other components in form of borders. Therefore the VS Code themes uses a subtle color for components like the sidebar and bottom panel that renders elements like the builtin shell terminal. The converter currently does not take the borders into account so VS components like the (dockable) side panels (e.g. the "Solution Explorer") so there is no visual separation between the editor.

VS with "Nord" theme where panel borders are missing or using the same color like the panels.

In comparison the builtin "Dark" theme has borders.

As an example the "Nord" theme in VS Code has borders for panels.

Other VS components like the search box also has no borders.

I've checked the Nord VS Code theme and found the following keys to be responsible for border styles of the mentioned components:

• editorOverviewRuler.border - color of the overview ruler (builtin "minimap") border which could be used for the side entries that toggle the side panels (e.g. "Solution Explorer" or "Notifications").
• panel.border - the main key for all borders of panels. From the key documentation:

  Panel border color to separate the panel from the editor. Panels are shown below the editor area and contain views like output and integrated terminal.

• sash.hoverBorder - also an important key that is used to style the "sash" (wider border) that appears when users hover over a side panel border and stay there like 1 second in order to visualize that this component can be resized.
• sideBar.border - a key especially for the side bar (renders components like the "Explorer" and "Search" and is not controlled by the panel.border key)
• statusBar.border - like sideBar.border a key especially for the status bar component.

Reproduction Steps

1. Set Nord as active theme.
2. Open any side panel, e.g. "Solution Explorer"
3. Validate that there are no borders that separate the component to the editor.

Expected Behavior

I expected that one or more of the described VS Code theme keys are used to render borders for VS side panels to achieve a visual separation between the editor.

Environment

Converter version: commit 34bbde361cb3511f7b6ae99dd2689c1825cca60e VS version: 17.0.0 Preview 3 Theme(s) used: Nord

(Possible) Release Impact

This issue is kind of a medium to high annoyance, but I think it's fine to release the theme without borders and improve the style in a future version.

[ketttY]

Hi @arcticicestudio, thank you for sharing the feedback! With https://github.com/microsoft/theme-converter-for-vs/pull/109, we added some mappings for the border. Attached is a sample screenshot for Nord. Wondering what do you think?