How to set VSCode debug console foreground color? - visual-studio-code

I've tried these, but none of them seem to work:
"workbench.colorCustomizations": {
"consoleView.foreground":"#000",
"debug.console.foreground": "#000",
"debugConsole.foreground" : "#000",
"debugConsole.infoForeground" : "#000",
"debugConsole.warningForeground" : "#000",
"debugConsole.errorForeground" : "#000",
"debugConsole.sourceForeground" : "#000",
}

Related

how can i make todo highlight extension work

I downloaded the todo highlight extension. what should I write in json file for it to work? I copied the whole code from marketplace visual studio com but it doesn't work.
what exactly do you have written in this file? (I don't even care about the colors and stuff I just want the highlight to work.)
{
"todohighlight.isEnable": true,
"todohighlight.isCaseSensitive": true,
"todohighlight.keywords": [
"DEBUG:",
"REVIEW:",
{
"text": "NOTE:",
"color": "#ff0000",
"backgroundColor": "yellow",
"overviewRulerColor": "grey"
},
{
"text": "HACK:",
"color": "#000",
"isWholeLine": false,
},
{
"text": "TODO:",
"color": "red",
"border": "1px solid red",
"borderRadius": "2px", //NOTE: using borderRadius along with `border` or you will see nothing change
"backgroundColor": "rgba(0,0,0,.2)",
//other styling properties goes here ...
}
],
"todohighlight.keywordsPattern": "TODO:|FIXME:|\\(([^)]+)\\)", //highlight `TODO:`,`FIXME:` or content between parentheses
"todohighlight.defaultStyle": {
"color": "red",
"backgroundColor": "#ffab00",
"overviewRulerColor": "#ffab00",
"cursor": "pointer",
"border": "1px solid #eee",
"borderRadius": "2px",
"isWholeLine": true,
//other styling properties goes here ...
},
"todohighlight.include": [
"**/*.js",
"**/*.jsx",
"**/*.ts",
"**/*.tsx",
"**/*.html",
"**/*.php",
"**/*.css",
"**/*.scss"
],
"todohighlight.exclude": [
"**/node_modules/**",
"**/bower_components/**",
"**/dist/**",
"**/build/**",
"**/.vscode/**",
"**/.github/**",
"**/_output/**",
"**/*.min.*",
"**/*.map",
"**/.next/**"
],
"todohighlight.maxFilesForSearch": 5120,
"todohighlight.toggleURI": false
}

What is the VS Code workbench.colorCustomizations code for the search result highlighting after manually highlighting the same text?

What is the workbench color customization for the ____t in this image?
enter image description here
Here is my settings.json:
{
"workbench.colorTheme": "Hyper Dracula",
"workbench.colorCustomizations": {
"tab.activeBackground": "#282a36",
"tab.border": "#282a36",
"tab.hoverBackground": "#282a36",
"editor.selectionBackground": "#44475a",
"editor.selectionHighlightBackground": "#135564"
},
"editor.tokenColorCustomizations": {
"comments": "#FF9900"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"window.zoomLevel": 1,
"editor.formatOnSave": true,
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"sync.gist": "20cf55b3a5eb6aa675ee54477c73dd4d",
"security.workspace.trust.untrustedFiles": "open",
"workbench.startupEditor": "none",
"editor.rename.enablePreview": false
}
It looks like you are talking about a const variable name in javascript. You can use the Scopes inspector from the Command Palette to see it has the scope of variable.other.constant.js. You would use that in your settings like this:
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "variable.other.constant.js",
"settings": {
"foreground": "#FF0000",
"fontStyle": "bold"
}
}
]
}
However, that will change the styling of all const variable names, not just const _______t. If you want to style only const _______t you will need to use an extension like Highlight to target specific text.
In your settings:
"highlight.regexes": {
"(const\\s+)(_+\\w+)(\\s*=.*)": { // note double-escaping
"decorations": [
{},
{
"overviewRulerColor": "#ffcc00",
"backgroundColor": "#ffcc00",
"color": "#1f1f1f",
"fontWeight": "bold"
},
{}
]
}
would target (_+\\w+) - some number of underscores before a \w for example that follows a const and precedes = .* in regex terms.

Extrude land in MapBox

I am trying to emphasize the fact that the land is higher than the water in my map so wanted to add an extrusion to the land layer. I thought taking the https://docs.mapbox.com/mapbox-gl-js/example/3d-buildings/ of the one with buildings and changing the layer source to 'land' would work but it didn't. Is this something specific to building layers or am I doing something wrong? Here is my layer definition in my style JSON:
{
"id": "3d-land",
"source": "composite",
"source-layer": "land", # Changed this from building
"filter": ["==", "extrude", "true"],
"type": "fill-extrusion",
"minzoom": 0,
"paint": {
"fill-extrusion-color": "#000",
"fill-extrusion-height": [
"interpolate", ["linear"], ["zoom"],
15, 0,
18.0, 30.0
],
"fill-extrusion-base": [
"interpolate", ["linear"], ["zoom"],
15, 0,
18.0, ["get", "min_height"]
],
"fill-extrusion-opacity": 0.8
}
}
First reason is as the console says, "land" does not exist on source "composite". "land" layer is background layer which is exist separately in the style. You cannot use fill-extrusion for background layer. You may want to use layers which use "compose" source.
The other reason is from filter. "filter": ["==", "extrude", "true"] means filtering if the value of layer's property called "extrude" is "true". land layer doesn't have a property extrude so it's always false.
So, the result of fix would be looks like:
map.addLayer(
{
id: "3d-landcover",
source: "composite",
"source-layer": "landcover",
"type": "fill-extrusion",
"minzoom": 0,
"paint": {
"fill-extrusion-color": "#000",
"fill-extrusion-height": [
"interpolate", ["linear"], ["zoom"],
15, 0,
18.0, 30.0
],
"fill-extrusion-base": [
"interpolate", ["linear"], ["zoom"],
15, 0,
18.0, ["get", "min_height"]
],
"fill-extrusion-opacity": 0.8
}
}
);
As the first reason, all the layers except water should be added as above if you want to make the land higher than water. it's not very effective.

Is there any way to change background color of comments in VScode?

I would like to change the color of the comments so that it can be highlighted. I prefer to change background-color most of the time. I found the color setting in setting.json. it looks like this.
"editor.tokenColorCustomizations": {
"textMateRules": [
{
"scope": "comment",
"settings": {
"fontStyle": "bold",
"foreground": "#FFD83B"
}
}
]
}
It does change but it seems like there is no "background" option in "settings". it says "Token background colors are currently not supported."
so I only can change the text color, not the background. is there any way I can set background color of comments in VSCode?
There isn't any way to do that built-in. You could look through the extensions - search for comment - to see if any of them do that.
Alternatively, one way to do it would be to use an extension like highlight. You can style anything you can capture with a regex. In settings.json:
"highlight.regexes": {
"(//\\s*)(\\sTODO\\s)(\\s*?:?)(.*)": [
{},
{
"overviewRulerColor": "#ffcc00", // does this work?
// "backgroundColor": "#aaa",
"color": "#fff",
"fontWeight": "bold",
"letterSpacing": "2.5px",
"outline": "1px solid #aaa",
// "border": "1px solid #fff",
// "before": {
// "backgroundColor": "#fff",
// "contentText": " *** ",
// "fontWeight": "bold",
// "margin": "10px"
// // "width": "20px"
// }
},
{},
{
"color": "#999",
"fontStyle": "italic",
"letterSpacing": "1px"
}
],
"(//\\s*)(-+\\s+//)": [
{
"color": "#000",
"backgroundColor": "#aaa",
"outline": "2px solid #aaa",
"fontWeight": "bold",
},
{
"overviewRulerColor": "#ffcc00",
"backgroundColor": "#aaa",
"color": "#000",
"fontWeight": "bold",
// "letterSpacing": "2.5px",
"outline": "2px solid #aaa",
// "border": "1px solid #fff",
// "before": {
// "backgroundColor": "#fff",
// "contentText": " *** ",
// "fontWeight": "bold",
// "margin": "10px"
// // "width": "20px"
// }
},
]
},
yields:
For styling options, see https://code.visualstudio.com/api/references/vscode-api#DecorationRenderOptions

I am building a bubble chart in AM-Charts but facing issues in plotting String values on X-axis

I am new to AM-charts, I am building a bubble chart in AM-charts http://www.amcharts.com/demos/bubble-chart/.
I want to plot following data in bubble chart where name should be appear on X-axis and job should be on Y-axis.
[{"name":"abc","jobs":15, "value":63500},{{"name":"pqr","jobs":15, "value":33000}}]
My bubble chart configuration is as follows-
{
"type": "xy",
"theme": "light",
"titles": [
{
"text": title,
"size": 16
}
],
"balloon": {
"fixedPosition": true,
},
"dataProvider": [{"name":"abc","job":15, "value":63500},{{"name":"pqr","job":15, "value":33000}}],
"valueAxes": [
{
"position": "bottom",
"axisAlpha": 0
},
{
"minMaxMultiplier": 1.2,
"axisAlpha": 0,
"position": "left"
}
],
"startDuration": 1.5,
"graphs": [
{
"balloonText": "Name: <b>[[name]]</b> Jobs: <b>[[job]]</b><br>value: <b>[[value]]</b>",
"bullet": "round",
"bulletBorderAlpha": 0.2,
"bulletAlpha": 0.8,
"lineAlpha": 0,
"fillAlphas": 0,
"valueField": "value",
"xField": "name",
"yField": "job",
"maxBulletSize": 50,
"minBulletSize": 20
}
],
"marginLeft": 46,
"marginBottom": 35,
"export": {
"enabled": true
},
"chartScrollbar": {
"offset": 15,
"scrollbarHeight": 5
}
}
I am not able to see bubble chart with this configuration. No error or warning in console.
Can anyone please suggest me some solution to fix this issue?
Thanks in advance.