You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
Dim or otherwise indicate "inactive" editor/terminal #30522
One of the best features of VS Code is the built-in terminal. However, I often begin typing in the editor when in fact I think I'm in the terminal - and vice versa. To alleviate this issue, it would be helpful to visually indicate which portion of the IDE is "active" vs. "inactive". A subtle dimming effect might just do the trick.
"terminal.integrated.cursorBlinking": true, this is how I tell where the focus is. The terminal cursor is also hollow when it's not focused which helps.
The high contrast theme adds a border around the terminal when it's focused:
Probably not much of a workaround but worth mentioning 😉
Benjamin Pasero (@bpasero)Isidor Nikolic (@isidorn)alexandrudima what are your thoughts on maybe having an option something like "workbench.focusBorder": "everywhere" which would draw the focus border around whatever is focused. Right not a border is not drawn when focusing the editor and panels. This could be useful to give an extra visual cue on which part of the workbench is focused. It would also be particularly nice when working with the workbench.action.navigate* commands.
We used to show the border around the explorer not that long ago which i actually liked. A border around the terminal and editor would be nice too.
Alternatively an option to dim the non-active view as proposed by the OP.
I do have blinking cursor set currently and when I'm on my macbook it's usually in a close enough proximity (visually) so that I see it but when I'm on my two large external displays at fullscreen it's easy to miss the blinking cursor if you're looking elsewhere and working quickly.
The high contrast mode makes my eyes bleed haha. None the less, that's great to point out here.
I do not like the border (in fact I even get annoyed by our blue focus ring so I disabled it via theme customization). I would prefer a solution that does not introduce ugly borders.
Yeah dimming might be better. We have this problem already today where when having multiple editors open side by side it is not clear which editor is active.
Reacted by Isidor Nikolic, Jason Hulbert, Stuart, Mat Munn, David Baughman, Daniel Enrique, Ryan Boehning, Robert, oatmealb and Emil Valeev
The issue with this is If I enable this setting and If I do some changes in editor and click on other file from the explorer it just move the focus from the editor
Oh, damn, I hadn't even thought of this. Yeah, that's not exactly how I was picturing it, either. That said, Abhijit Chikane (@abhijit-chikane), I think it's worth turning it on and living with it for a few weeks. It may turn out to be intuitive, or it may not. And if it's not, we can always open another feature request! 😛
There's been a bunch of feedback from the team during the test round. I'll be announcing the feature in the release notes' experimental section and this is the plan for upcoming improvements #191775. Feedback is welcome of course!
Nice - I didn’t realize it was documented. Will definitely pass that along, thanks! And we do indeed make a devtool - you should check us out sometime!
Oh, how funny, and man, what a throwback! I remember the day our head of design was figuring out how to make the "Sentry" on that hot dog swag.
In any case, we have an electron SDK as well as freestanding browser and node SDKs (which, full disclosure, I helped maintain for a few years) should y'all ever be interested. 🙂
Activity
jasonhulbert commentedon Jul 12, 2017
Of course, this would be best suited as an option and, since it could be jarring to current users, not the default behavior.
Personally, I could also see this being useful in split-editor views as well.
Tyriar commentedon Jul 12, 2017
Some things that could help you with this:
"terminal.integrated.cursorBlinking": true, this is how I tell where the focus is. The terminal cursor is also hollow when it's not focused which helps.The high contrast theme adds a border around the terminal when it's focused:
Probably not much of a workaround but worth mentioning 😉
Benjamin Pasero (@bpasero) Isidor Nikolic (@isidorn) alexandrudima what are your thoughts on maybe having an option something like
"workbench.focusBorder": "everywhere"which would draw the focus border around whatever is focused. Right not a border is not drawn when focusing the editor and panels. This could be useful to give an extra visual cue on which part of the workbench is focused. It would also be particularly nice when working with theworkbench.action.navigate*commands.We used to show the border around the explorer not that long ago which i actually liked. A border around the terminal and editor would be nice too.
Alternatively an option to dim the non-active view as proposed by the OP.
jasonhulbert commentedon Jul 12, 2017
Daniel Imms (@Tyriar) thanks for the response!
I do have blinking cursor set currently and when I'm on my macbook it's usually in a close enough proximity (visually) so that I see it but when I'm on my two large external displays at fullscreen it's easy to miss the blinking cursor if you're looking elsewhere and working quickly.
The high contrast mode makes my eyes bleed haha. None the less, that's great to point out here.
+1 on the focus border you have suggested.
Thanks again
bpasero commentedon Jul 12, 2017
I do not like the border (in fact I even get annoyed by our blue focus ring so I disabled it via theme customization). I would prefer a solution that does not introduce ugly borders.
jasonhulbert commentedon Jul 12, 2017
Benjamin Pasero (@bpasero) What are you thoughts on the dimming effect? Possibly with an optional "amount"?
iTerm is an example of this:
Tyriar commentedon Jul 12, 2017
I prefer borders personally 😛
bpasero commentedon Jul 12, 2017
Yeah dimming might be better. We have this problem already today where when having multiple editors open side by side it is not clear which editor is active.
71 remaining items
lobsterkatie commentedon Aug 22, 2023
Oh, damn, I hadn't even thought of this. Yeah, that's not exactly how I was picturing it, either. That said, Abhijit Chikane (@abhijit-chikane), I think it's worth turning it on and living with it for a few weeks. It may turn out to be intuitive, or it may not. And if it's not, we can always open another feature request! 😛
Tyriar commentedon Aug 22, 2023
Also a little tip, you can double click to select the file in the explorer and focus the editor
Tyriar commentedon Aug 29, 2023
FYI I'm planning on moving this back to live under
accessibility., see #191618 and some discussion about the feature in #191610Tyriar commentedon Aug 30, 2023
There's been a bunch of feedback from the team during the test round. I'll be announcing the feature in the release notes' experimental section and this is the plan for upcoming improvements #191775. Feedback is welcome of course!
lobsterkatie commentedon Aug 30, 2023
I like your system of making an issue specifically for internal testing and then linked issues for feedback! I may suggest it to our product team. 🙂
Tyriar commentedon Aug 30, 2023
Katie Byers (@lobsterkatie) this is our "endgame" week where the whole team turn into testers for a bit https://github.com/microsoft/vscode/wiki/Development-Process#end-game, it certainly works pretty well when building devtools 👍
lobsterkatie commentedon Aug 30, 2023
Nice - I didn’t realize it was documented. Will definitely pass that along, thanks! And we do indeed make a devtool - you should check us out sometime!
Tyriar commentedon Aug 31, 2023
Katie Byers (@lobsterkatie) ah I think I've heard ads for Sentry and been at the same conferences. I remember seeing https://blog.sentry.io/three-reasons-to-meat-us-at-github-universe/ 😉
lobsterkatie commentedon Aug 31, 2023
Oh, how funny, and man, what a throwback! I remember the day our head of design was figuring out how to make the "Sentry" on that hot dog swag.
In any case, we have an electron SDK as well as freestanding browser and node SDKs (which, full disclosure, I helped maintain for a few years) should y'all ever be interested. 🙂
Dim unfocused
Add enabled dim unfocused setting, tweak enabled setting
Don't add dim unfocused element if not used
Dim unfocused