Vscode: Add border options to `selectionBackground`

[evandrocoan]

• VSCode Version: 1.14.1:
• OS Version: Windows 10 build 15063

Add border options to selectionBackground and findMatchBackground. They would be called like selectionBorder and findMatchBorder. You cannot find them on:

1. https://code.visualstudio.com/docs/getstarted/theme-color-reference

Currently the selection has no border:

Would be awesome if it has borders like Sublime Text selections:

Reproduces without extensions: Yes

---

Related issues:

1. https://github.com/Microsoft/vscode/issues/8050 additional options for editor.selectionHighlight

[ro31337]

+1

[johnpapa]

Moving here as per @aeschli and @chrisdias

This looks awesome! :)

Selection Highlight and Find Match

Expose border, and background for selectionHighlight and findMatch

/*
  This puts a thin yellow border around the found items like Sublime did it
*/
.monaco-editor .findMatch,
.monaco-editor .selectionHighlight {
  border-top: 0.1px solid #f7ecb5;
  border-bottom: 0.1px solid #f7ecb5;
  background: transparent;
}

https://github.com/Microsoft/vscode/issues/38990

[aeschli]

I added border options for most of the text decorations (findMatch, wordHighlight...). Not for selection as this needs more work to look good.

[Enteleform]

+1

This would make it much easier to create a high-visibility style for the active selection.

On a related note, the lack of selectionForeground for non-high-contrast themes is definitely a detriment to achieving the same effect.

---

Also, I just noticed that the selection & selectionHighlight properties have kind of an odd behavior in relation to addSelectionToNextFindMatch.

When using addSelectionToNextFindMatch, the selection & selectionHighlight properties are both applied to each additionally selected match. I would expect selection properties to activate and selectionHighlight properties to deactivate in this case. The expected behavior is exhibited in the second half of the GIF, when multiple selections are made simultaneously.

 
Here is the same sequence of actions in SublimeText:

[blacktop]

+1 please!

[kanlukasz]

I miss this too much

[FrancisVila]

Here"s an extra take on this old issue:
The following image illustrates the problem. Here editor.selectionhighlightborder works, but not editor.selectionBorder.

The arrow is on the currently seleted item: the AAFFAA of editor.selectionBorder. It is _not bordered_, when this is where you want to point out the current selection, which is the most important item in the whole editor: where things will happen if you hit keys on the keyboard.

The AAFFAA of editor.selectionHighlightBorder _is_ bordered. This _is_ important, but _much less_ than editor.selectionborder. It's there to say "hey, the one you've got selected isn't the only one, if you're thinking of editing this one, don't forget all the rest".

If we have to choose, I would vote for borders on editor.selectionBorder, not editor.selectionHighlightBorder .

[blacktop]

This would make some themes MUCH more readable.

[haakonstorm]

Bump

[rebornix]

/duplicate of https://github.com/microsoft/vscode/issues/21898 , let's track it there.