Line under the function showing scope

Question

I don't know exactly the name of this, so I don't know what I'm searching for. I saw in some programming videos that when the cursor is inside a function it shows a line that goes under the function and then down until the end of the function scope (like in the image below).

is this an extention or a setting? how can i enable it? Can someone please help me?

Answer 1

This was apparently implemented recently (2021/22). I'm running v1.68.1 and it is available. The new setting is actually called bracketPairsHorizontal. If that is false, the horizontal line won't show.

Edit your settings.json file and add the following:

// Bracket-pair guides
"editor.guides.bracketPairs": true,
"editor.guides.bracketPairsHorizontal": true,       // shows horizontal line
"editor.guides.highlightActiveBracketPair": true,   // highlight both horizontal and vertical lines

// Bracket-pair colorization
"editor.bracketPairColorization.enabled": false, 
"editor.bracketPairColorization.independentColorPoolPerBracketType": true,

// Indentation lines
"editor.guides.indentation": true                   // shows vertical lines

Some settings depend on each other, ex. bracketPairs will override indentation.
Result with above settings: