Is it possible to change default settings for the background color of highlighted expressions in the code editor?
When I place the cursor on a method, other places the method exists are grey backgrounded. The same background color appears by placing the cursor on a class. How can I change the background color of highlighted methods to red and the background color of highlighted classes to green?
What you are looking for is "Mark Occurrences". In Xtext these are computed by instances of IOccurrenceComputer. The default implementation is DefaultOccurrenceComputer. If you replace this instance with your own implementation (inside your module class using Guice) you can return your own Annotation's. You can then provide your own extensions to the annotations extension point from eclipse with colors of your choice.
Related
Could I configure the color (grey, by default) of Ghost Statements in Dafny. I mean, the current gray color is too dark, it is difficult to see the text in the classroom screen. I think a lighter gray would be better.
There are two options to fix this.
Don't use markGhostStatements. By default dafny.markGhostStatements is set to be true. Change extension setting to false.
Use markGhostStatements, but change background color. There is no configuration to set it. Probably file an issue at https://github.com/dafny-lang/ide-vscode to provide that configuration. You can locally build ide-vscode by setting this option. See images below for change in background color by setting GhostDecoration.
The February 2021 version brought a breaking change for the colors of autocomplete lists:
https://code.visualstudio.com/updates/v1_54#_updated-listtree-ui
Where we have the following settings for the colors of the focused item:
quickInputList.focusIconForeground
quickInputList.focusForeground
quickInputList.focusBackground
The three work fine.
However, when setting focusIconForeground, it seems that we can override the color of the icon... but what if I want to keep the original color of the icon, even when the item is focused?
For example, suppose I have the following settings:
"workbench.colorCustomizations": {
"[Default Light+]": {
"quickInputList.focusIconForeground": "#ff0000",
"quickInputList.focusForeground": "#000000",
"quickInputList.focusBackground": "#e0e0e0",
},
},
If so, this is the rendered autocomplete list:
See how the icon of the focused item is red. I want it to remain purple, its original color.
So, what setting can I use in quickInputList.focusIconForeground to keep the icon at its original color?
As a side note... I'm using "Default Light+" theme, but I noticed that many other themes (like "Quiet Light" and "Monokai") do exactly what I'm trying to do.
I had to dig into the actual source code of VSCode in order to find this. What happen is: the suggestion box icon is called product icon, which is actually a glyph icon font that can be themed. It ships with no color, because the color is defined by the active color theme.
When the suggestion box is rendered, VSCode checks if current theme has defined a color to the icon. If there is no color, a default color is given according to the icon type. However, if the color theme defined a color to the icon, this color is used, regardless of the icon type – that is, the theme overrides the color. The parameter for this color is editorSuggestWidget.selectedIconForeground, as noted in JayDev's answer. The code which does this can be seen here.
Now the theme I'm using, "Default Light+", does override this color, and there is no way to clear this overriding in VSCode settings file. Other themes do not override, and those themes show the original icon color, which is the behavior I want. So, what I had to do was simply modify the theme, inside VSCode installation folder, commenting out the offending line, which can be found here. For reference, in VSCode installation folder, it's line 28 of this file:
resources\app\extensions\theme-defaults\themes\light_vs.json
The line itself to be commented out is:
"list.activeSelectionIconForeground": "#FFF"
Another solution would simply be to create another theme, based off "Default Light+", with this fix. However, if the theme is updated in the future, I'd have to keep the pace, something I don't want to do. So, what I'm doing is adding this fix to this patch I wrote a while ago to automate other VSCode customizations.
Note: All source code references were taken off VSCode commit da77887 (June 10, 2021). These references may, obviously, change in the future.
I've set up custom colors for the tabs to make them easier to see active vs. inactive, but on some tabs - and I can't find a pattern to it, the customization doesn't stick. The foreground color is red or pink, and it should be light gray.
Settings JSON file is in the picture, and I can't find any other settings that refer to "tabs", so what am I missing?
Thanks!
I've broken it down for the items you have in your file using my own as an example with vibrant colors to help distinguish them:
My setting.json:
"workbench.colorCustomizations": {
"[Default Dark+]": {
"tab.activeBackground": "#0004ff",
"tab.activeForeground": "#e100ff",
"tab.inactiveBackground": "#00ff62",
"tab.inactiveForeground": "#00b7ff",
"tab.lastPinnedBorder": "#fafafa",
"tab.unfocusedActiveForeground": "#fbff00",
"tab.unfocusedActiveBackground": "#ff0000",
}
}
Corresponding components (it's best if you enlarge the image):
Notes:
Groupings matter - the properties only apply to the currently active/inactive group. A group is each active editor window. In my picture, there are two groups, with the active one on the left (in focus) and the inactive one on the right (out of focus). The tooltips to all of these properties state they apply to groupings. For example, tab.activeBackground's tool tip states the following:
Active tab background color in an active group
The tab.lastPinnedBorder property only applies to the last tab that was pinned (as the name would suggest). Personally I feel this is a bizarre option. If I were to pin a new tab, the white line would move to said tab.
The property names are slightly misleading. If it doesn't have the word "unfocused" in it, it means the active group (yet these property names do not contain the word "focused").
Make sure you have the correct theme selected in your settings that corresponds to the theme you are specifying in your JSON. In my example I have the [Default Dark+] theme selected in my settings (it's actually called Dark+ (default dark) in the drop down in the settings), thus my individual JSON properties are applied. I believe Dark+ is the default when you first install Visual Studio Code (unless it goes off of the systems preferred color theme - I'm not sure if it does).
I want to change the background of a specific scope (code.block) in VSCode as I do with sublime. sublimetext
Block comment has different background, hence it is easier to notice.
Although I made necessary modifications to relevant json file, and foreground colors displayed correctly, backgroundcolor is always overriden by the background of editor. the background field (ff0000 marked with red) changes correctly but the displayed background field (1d1a18 marked with green) is the background of the editor.
VSCode
I use meterial dark soda theme.
Anyone knows how to disable this setting.
You can't. Here's the issue tracking: #3429.
I'm creating a custom colour theme extension for Visual Studio Code and I can't find out how to customise the colours for certain parts of the user interface. The theme is complete, apart from customising the reference popup window.
Here is the popup window I'm trying to customise:
I wish to change the blue background and if possible, the blue border lines. I'm sure this can be done because some of the built-in themes do so. Does anyone have an idea what I would need to put into the colour theme file to achieve this?
I'm also looking for pointers to customise the status bar colour (at the base of the editor).
As far as I know, this is not possible.
Some of the built-in themes are build differently. Most themes are textmate style themes, but you can see here that some of the built-in themes are .json files and are somehow handled differently.
You can find the theme documentation here. Specifically, this part is relevant:
Besides the TextMate language grammar standard scopes, VS Code also
has custom theme settings which you can use to tune your own theme:
rangeHighlight: Background color of range highlighted, like by Quick open and Find features.
selectionHighlight: Background color of regions highlighted while selecting.
inactiveSelection: Background color of selections when not in focus.
wordHighlight: Background color of a symbol during read-access, like reading a variable.
wordHighlightStrong: Background color of a symbol during write-access, like writing to a variable.
findMatchHighlight: Background color of regions matching the search.
currentFindMatchHighlight: Background color of the current region matching the search.
findRangeHighlight: Background color of regions selected for search.
linkForeground: Color of links.
activeLinkForeground: Color of active links.
hoverHighlight: Background color when hovered.
referenceHighlight: Background color of a reference when finding all references.
guide: Color of the guides displayed to indicate nesting levels.
You can find an example VS Code theme here which includes the custom
settings.
As we can see here, there is no special override for the references pane.
We can, though, see in the code that the dark blue for dark themes and the light blue for light themes that you're seeing in the references pane is a default value set in code here.
The colours for the UI itself are stored in the following file (ubuntu): /usr/share/code/resources/app/out/vs/workbench/electron-browser/workbench.main.css
You can edit that, or wait for March 2017 where a new version will be released which will allow customising these colours more easily.
Revisiting this in Sept/2022 out of necessity, I confirmed VS Code 1.70 has native support for manipulating colors for the Go to References/Definitions and Peek... overlays.
Change the overlay background and border as follows, but there's lots of other settings too; see peekView*
"workbench.colorCustomizations": {
"peekViewEditor.background": "#01041a",
"peekViewResult.background": "#054c8a",
"peekView.border": "#04fafa"