How to remove editor match bracket lines in VS Code? - visual-studio-code

I want to remove the distracting match bracket lines below.
The settings that I have used so far are:
{
"editor.renderLineHighlight": "none",
"editor.matchBrackets": "never"
}

On a similar issue:
Below is what I was looking for (removes vertical lines on left):
File: settings.json
Setting:
"editor.guides.indentation": false
Old that does not work anymore:
"editor.renderIndentGuides": false
More details: https://code.visualstudio.com/docs/getstarted/userinterface#_indent-guides

Thank rioV8 for your comments.
Add the following settings:
"bracketPairColorizer.showHorizontalScopeLine": false,
"bracketPairColorizer.showVerticalScopeLine": false

This worked for me:-
open settings.json CTRL + SHIFT + P and type "Open Settings (JSON)"
paste the following code at the bottom:-
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs": "active",
"editor.matchBrackets": "near",
"editor.guides.highlightActiveBracketPair": false,

Related

vscode is not respecting editor.quickSuggestions setttings

In vscode, I have the following setttings:
"editor.quickSuggestions": {
"other": true,
"comments": true,
"strings": true
},
"[markdown]": {
"editor.quickSuggestions": {
"other": true,
"comments": true,
"strings": true
},
I am debugging this issue for plugin Markdown Notes.
I believe at some point the settings value for editor.quickSuggestions changed from a boolean to the new mapping. In any case, in a document I have the text:
#draft
#d
And this used to autocomplete the tag text immediately, respecting the quickSuggestions preference.
Now, I don't get an automatic autocomplete, BUT I DO get the correct autocomplete values when I triggerSuggest (⌃Space by default).
So vscode DOES know the correct completion values, but it just will not respect the quickSuggestions settting.
Is there some other new setting I need to toggle to get quickSuggestions working correctly?
Maybe you have
{
"editor.suggestOnTriggerCharacters": true
}
set to false?

How to set the background color of the Find current line?

I successfully set the background color of the current line of the editor :
{
"terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\cmd.exe",
"atomKeymap.promptV3Features": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.formatOnPaste": true,
"editor.renderLineHighlight": "line",
"workbench.colorCustomizations": {
"editor.lineHighlightBackground": "#636363"
}
}
Now I am making the Find search ( Ctrl F ). I am surprised that the find line color is not the same as the color I set for the editor current line color ! How to set the Find line color ?
You should take a look at the official documentation. You can try them one by one if you can not figure out which one is your need.

VSCode. How do I remove padding between side bar and editor?

I somehow added padding to the left and right of my editor. Anyone know how I could remove it?
I've played around with view->editor layout but Single mode doesn't do the trick. And switching to the other views and back don't do anything either. I also can't drag the window beyond what is shown below.
my current settings.json, nothing in here should affect it.
{
"editor.tabSize": 2,
"editor.detectIndentation": false,
"window.zoomLevel": 1,
"editor.minimap.enabled": true,
"javascript.updateImportsOnFileMove.enabled": "always",
"[terraform]": {
"editor.formatOnSave": true
},
"breadcrumbs.enabled": true,
"[python]": {
"editor.insertSpaces": true,
"editor.tabSize": 4
},
"editor.renderWhitespace": "none"
}
Seems like it was answered on github. I just wasn't typing in the correct question. https://github.com/Microsoft/vscode/issues/53778
F1->Toggle Center Layout
In settings
"editor.glyphMargin": false

How to select tab-size in Visual Code Studio for pug lang?

It is possible to set lang-based tabe sizes in VSC like this:
"[sass]": {
"editor.tabSize": 2
},
"[html]": {
"editor.tabSize": 4
},
"[javascript]": {
"editor.tabSize": 2
}
But its doesnt work for pug language, where identation is always 4 spaces. It doesnt even overwrite with "editor.tabSize: 2". How do i make another value of tabsize for pug ?
Found a solution:
"[jade]": {
"editor.detectIndentation": false,
"editor.insertSpaces": true,
"editor.tabSize": 2
}
Jade was name of the Pug template before.
https://github.com/pugjs/pug/issues/2184

Is it possible to configure control + scroll-wheel to increase/decrease zoom in VS Code?

Similar to the default in the Visual Studio editors or Sublime, I would like to use control + scroll-wheel to change the font size / zoom level, rather than control-plus/minus. I did not see any option in the User or Workspace preferences.
Edit from Derek Morin:
If you want this to be the default behaviour, please upvote:
https://github.com/microsoft/vscode/issues/97137
You can edit settings.json and add this line:
"editor.mouseWheelZoom": true
Or go to settings CTRL + , or File > Preferences > Settings and search for:
mouseWheelZoom
in newer versions :
File -> preferences -> settings -> search for "mouse wheel zoom"
File > Preferences > Settings and search for:
mouseWheelZoom
✅ check this setting
Or,
go to settings CTRL + ,
Or,
Go the edit settings.json and add the below line inside the {parethesis}
"editor.mouseWheelZoom": true
For reference setting.json all preferences
{
"terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\wsl.exe",
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
"C_Cpp.updateChannel": "Insiders",
"terminal.integrated.shell.linux": "/bin/zsh",
"editor.fontFamily": "'Cascadia Code', Consolas, 'Courier New', monospace",
"editor.fontLigatures": true,
"editor.largeFileOptimizations": false,
"git.suggestSmartCommit": false,
"files.autoSave": "afterDelay",
"liveshare.audio.startCallOnShare": true,
"liveshare.presence": false,
"terminal.integrated.fontFamily": "MesloLGS NF",
"terminal.integrated.tabs.enabled": true,
"explorer.confirmDelete": false,
"tabnine.experimentalAutoImports": true,
"code-runner.runInTerminal": true,
"json.maxItemsComputed": 10000,
"quokka.darkTheme.error.decorationAttachmentRenderOptions": {
"border": null,
"borderColor": null,
"fontStyle": null,
"fontWeight": null,
"textDecoration": null,
"color": "#fe536a",
"backgroundColor": null,
"margin": "1.2em",
"width": null,
"height": null
},
"prettier.singleQuote": true,
"prettier.jsxSingleQuote": true,
"workbench.colorTheme": "Visual Studio Dark",
"workbench.iconTheme": "vscode-icons",
"editor.mouseWheelZoom": true
}
If you are using Autohotkey you can write a script that presses Ctrl + = when you scroll your mouse up with Ctrl and Ctrl + - when you scroll your mouse down while holding Ctrl key as follows:
#IfWinActive ahk_class Chrome_WidgetWin_1
^WheelUp::
Send ^{=}
return
^WheelDown::
Send ^{-}
return
In visual studio code :
File -> preferences -> settings -> search for "mouse wheel zoom" then tick the box
Is it possible to configure control + scroll-wheel to increase/decrease zoom in VS Code?
Or
Configure Ctrl+ scroll-wheel to increase/decrease zoom in VS Code.
Go to
1 : File > Preferences > Settings
2 : Type "mouseWheelZoom"
3 : select Zoom option :
if you need to zoom on : Ctrl+ Mousewheel (select the check-box)
enter code here
if you Do Not need to zoom on : Ctrl+ Mousewheel (unselect select the check-box)
Image-1 for: File > Preferences > Settings
Image-2 for: Type "mouseWheelZoom"
The main problem is how VSCode is built, with a Electron frame and Microsoft Monaco Editor which is built with TypeScript and such web techniques. Therefore VSCode behaves exactly like a browser window would do - zooming the whole application including sidebar etc.
Answered in Zoom only Text in Visual Studio Code
On Mac, while pressing the command key, slide two fingers upward to zoom out. Slide downward to zoom in.