How to remove the red color indictors at the beginning of all the code? - visual-studio-code

When I updated Visual Studio Code, I am getting this annoying red indicator/highlighting before every line of code. Before the update, didn't have this issue. Does anyone know what is this and how to get rid of it?
I tried resetting and changing the theme but it didn't work.

I think this extension is causing your problem:
https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow
Try to disable/uninstall the "Indent-Rainbow" extension if it is installed.
For the "Trailing Spaces" extension, you can disable the highlighting option by adding this line to the settings.json file.
{
"trailing-spaces.highlightCurrentLine": false
}
You can find more settings here:
https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces

I had the same problem and I thought it must be some extension causing this and so I took a deeper look at all my extensions.
In my case there was an extension called 'trailing spaces' which was causing this.
the red highlighting disappeared as soon as I uninstalled it.
Try doing the same and if it doesn't work try to take a look at all of your extensions. (An easier way to do that would be to go over the extensions tab on the left navigation bar in settings menu).

On the bottom bar, to the right, just beside the "Ln XX and Col XX" you can choose "Select Indentation" to indent using spaces or tabs. Change that configuration or choose "detect indentation from content" and will solve the red background.

I just had to change the tab size from 4 to 2 (as configured within my eslint setup)

I kept the Indent Rainbow extension, but added this to my settings.json to disable the red highlights:
"indentRainbow.ignoreErrorLanguages": [
"markdown",
"python"

For my case it was an extension called Bracket Pair Colorizer

Related

Fix issue with VS Code: Border around all whitespaces in lines of code

All my whitespaces in VS code where code is written are being highlighted and I cant seem to understand where to change these settings.
In settings (open Command Palette CTRL+SHIFT+P and search for settings) menu search for Editor: Render Whitespace it is probably set to all instead of default selection. But i honestly have no idea why it is render with boxes and not dots or arrows, maybe it can be customized by using custom themes.
It was probably because of the theme the source was using from where I copied the source code. Replaced all these spaces with regular whitespace and now it's working fine.

How to hide the highlighted lines when the ".sql" file are opened in VSCode

Below is what it looks like when opened the ".sql" file, I want to hide those highlighted lines
I'm the creator of VSCode-sqltools. In fact as #joao-caxias mentioned, that was intentional. But some users didn't like it at all, so I've added a setting to enable/disable that behavior called sqltools.highlightQuery so you should be able to remove that if you want now.
I have found out that it comes with the SQL Tools extension
You could either uninstall it or revert back to 0.21.9 version. Not sure where the root cause for highlighting is.
You can go to SQLTools and click on the setting button. Then search highlight and uncheck the button for this setting.

Visual Studio Code missing dirty file indicator and highlight tabs doesn't work

When I have a dirty file in VS Code, I do not get the bullet in the file tab nor do I get the highlight bar above the tab. I turned on Highlight Modified Tabs in the settings with no effect. I also tried changing themes in case it was a color issue. I don't have any extensions that would interfere with these settings.
Has anyone experienced this? Do I need to completely uninstall VS Code?
I had the same issue and just solved it with this answer:
That was a hint. I realized what was the problem. Kind of weird. I had
modified the settings.json file manually, setting auto save to off,
but I realized that under the File menu at the top, Auto Save was
marked as active. My files were not auto saving, but VS detected as if
it were active. Unchecking Auto Save in the File menu did the trick.
https://github.com/Microsoft/vscode/issues/23950
I clicked File > [unchecked] Auto Save
This fixed it for me.

Indentation issue after pushing code from Brackets Editor to Github

For my code I'm using Brackets. In editor, code looks proper but after pushing it to github repository, indentations are messed up.
I'm using tab key to make indentation but in preferences there is set "use 2 spaces" after pressing tab key.
I've find out that Github is using 8 spaces for recognised tab keys. But still, it does not give me anything.
The biggest problem is when I use "one var statement".
I've also used jsbeautifier and it doesn't help me at all.
Here you can find an example: My Github code example
Does anybody had such a problem with brackets and github indentations?
Yes I had such problems.
These problems did not reappear when we moved to eslint inside of our IDE. The setup varies for each IDE. You can refer https://eslint.org/docs/rules/indent
If setting eslint is hard for you. Try bracket extensions like https://github.com/brackets-beautify/brackets-beautify . When used correctly it will beautify on save. Caution: Dont beautify code written by others or a team.

How to change the gutter background colour in VS Code?

All the VS Code default themes (and any others that I've seen) have a uniform background color between the main view and the gutter. This makes it really hard to tell if you're at the start of a line (or to click there). Is the cursor at the start of the line here?
This is especially annoying with Python where indentation matters and you can't simply auto-indent a block once your indentation is messed up.
I often find myself pasting a block only to find that I was one space away from the start of the line and the pasted block therefore being offset.
Simply setting the gutter to a light grey background would fix this problem but looking at the default theme files I can't see any settings for the gutter. I've also looked at a theme from the store (Material) which has a few keys relating to gutter colours but changing them did not do anything.
Is there any way to modify the gutter background colour in VS Code?
Update: Version 1.8 of VS Code comes with a new setting to render the line highlight which can help with this when set to 'gutter':
You can change the gutter's background color (or colour) in settings.json. This was added in May.
"workbench.colorCustomizations": {
"editorGutter.background": "#000000" // your color here
}
or you can add
"editor.rulers": [ 0 ]
This won't change the background but it will add a line between the gutter and the editor.
The problems is that the gutter pointers are just not enabled by default.
Open preferences, workspace settings and set
{
"editor.renderIndentGuides": true,
"editor.renderWhitespace": "all"
}
You should see the guidelines and whitespace, hope it helps.
For more settings like this check -> https://code.visualstudio.com/Docs/customization/userandworkspace
Please install 'Python For VSCode' extension to solve the indentation issue.