How do I get whitespace to show in VSCode? - visual-studio-code

VSCode 1.30.2
I could swear I had this working in previous versions. But now selecting View>Toggle Render Whitespace does not show invisibles such as spaces, tabs, and returns.
My setting for Editor: Render Whitespace is 'all'.
What setting have I missed, or misconfigured? I've run out of places to look.

They can be a quite faint gray against certain editor backgrounds. Try:
"workbench.colorCustomizations": {
"editorWhitespace.foreground": "#ff0000"
}
to make sure you really don't have them.

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 remove the red color indictors at the beginning of all the 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

any way to have a light sidebar while keeping the editor dark?

Something like this:
I've always liked the way Sublime Text looked and I wasn't able to reproduce this sorta theme in VS Code. Editing the workbench settings does not really achieve the same result. I end up having a light text on a slightly darker sidebar: which is pretty hard to read.
These will get you closer:
"sideBar.foreground": "#000",
"sideBar.background": "#ccc",
// "gitDecoration.modifiedResourceForeground": "#000",
You may need to modify all the gitDecoration colors to work on a light background.
I haven't figured out a way to darken the arrows for the folders yet though. You would think they would be set by the sidebar.foreground property but apparently not.
And I just noticed that the sidebar properties also control the command palette colors!

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.

Netbeans: How to change error row highlighting color away from red

I've dug through every damn color setting under Tools> Options. Went through every Fonts & Color, Editor, PHP etc and I'll be damned if I can figure out how to change the background row highlighting for when you have an error. I've been able to change ever other color to fit my personal preference cept this one. Here's a screen shot of the problem:
I would like to change the background red to a dark red so the text is easier to ready.
Using Netbeans 7.4
Thank you for your time and consideration.
Edit: Per Ben's point, here's the current options and the code behind the panel to show it's not working:
Final update, here's the end result which is close enough:
By looking at your screenshots (correct me if I am wrong) I can see that you have set your current row highlighting to red:
Tools-> Options-> Fonts&Colors-> Highlighting(Tab)-> Highlight Caret Row
As far as I know you can't set different background highlighting options for errors. So what you can do is set the formatting options for errors:
Font: No need to explain this.
Foreground: This is the text color if you change this it will disregard all other formatting options that you may have set, so lets leave it as is.
Background: This is what you want to change so that text don't get lost in the formatting. If you scroll to the bottom you can also set custom colors.
Effects: Irrelevant
Effect Color: Disabled if effects is None and only applies to the effect.
As you can see I set mine to yellow just as an example.
As you can see in this screen shot my background highlighting is light grey as well as my string formatting. So it is impossible to read, but by changing the error formatting this is the result:
Alternatively you can just select another background highlighting color that suits your formatting better.
Try Fonts&Colors->Syntax->Error
You can also try setting the Annotations color for "Error", mine was set to a specific color (after importing a theme) instead of 'Inherited', making text unreadable in a similar way.
This was really annoying for me too and most answers didn't help. I think that I have figured it out.
In netbeans 12 you need to change two things.
Tools->Options->Fonts&Colors->Syntax->Java->Error->change background color. This will only change the background of the code in error and not the red background of the rest of the lines white space.
To fix the red on the whitespace.
Tools->Options->Fonts&Colors->Annotations->Error(the one with the exclamation point)->change background color
I selected inherited to have no whitespace highlighting.
enter image description here