CODEWITHSUNDEEP
visual-studio-codevscode-extensions
Dmitry Vornychev
Dmitry Vornychev

Reputation: 615

Is there any way to visually change representation for particular editor in VS Code?

I often simultaneously open similar files placed in different locations, like Dockerfile - one in my project and one in example folder. This confuses me because I often try to edit wrong file. I made an extension which colorize files outside current workspace, but I was able to change color only for text background, not editor's one. That does solve the problem, but still looks imperfect and interfere with VS Code's own text background changes, like when selecting text.

Is there any way to change editor color only for specific files without doing some magic through Custom CSS? Or is there any other way to visually separate these files?

My first attempt on that problem was to play with "editor.rulers" option - if set in User settings for [10,20,30,40,50] and for [100] in workspace folder that visually change representation for non-workspace files, but actually looks awkward.

I am aware of "workbench.colorCustomizations": {"editor.background": ...} option, but this one change background for all editors; I didn't find a way to make it different for two editors opened in same VS Code instance.

Also there is always a solution to open more than one instance of VS Code for each workspace folder, each with its own theme, but this results in bad performance on slow machines; and I didn't found how to open more than one instance for same workspace folder.

Upd. This is how looks with my Workspace Watchdog extension. Visually separate files with Workspace Watchdog extension

Upvotes: 2

Views: 196

Answers (1)

André Casal
André Casal

Reputation: 1208

You can distinguish the files using breadcrumbs. Insert the following into your settings.json file (Ctrl+, or CMD+,):

"breadcrumbs.enabled": true,
"breadcrumbs.filePath": "on",
"breadcrumbs.symbolPath": "off",
"breadcrumbs.symbolSortOrder": "position"

Check out the screenshot below. enter image description here

I've created a video on it.

Hope it helps!

Upvotes: 3

Related Questions