Mac: allow for more custom title bar styles

[bpasero]

On Mac OS, modern applications typically take over control of the title bar. Some examples:

Skype for Business:

Outlook:

VS Code so far is not leveraging this and thus the title appears like this:

Proposed solution introduces a new setting window.titleBarStyle that allows to switch to a custom title bar (and potentially also to a inline style as discussed in #12628).

[smlombardi]

Will this setting be in Insiders build soon?

[bpasero]

@smlombardi tomorrow 👍

[bgashler1]

@bpasero this is great. It's close to what I was planning on proposing for a conservative first step. Thanks! The only differences were choice of colors for the title bar (I matched the tab well and divided it up using a muted horizontal line) and a tighter grouping of the the traffic lights to fit within the width of the activity bar.

[bpasero]

@bgashler1 great. I was about to ask if you have ideas for which coloring to use. I just picked the ones for dark, light and high contrast theme.

They live in https://github.com/Microsoft/vscode/blob/master/src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css#L55

[jtlowe]

Could this feature be wrapped up in an extension instead? This could give more flexibility to customize the color of the titlebar.

[bpasero]

We are not planning to give extensions a way to put stuff there. The main reason is that this feature is not available on Linux and Windows at the moment.

[jtlowe]

OK. Then how about a more specific name for the settings property, so it is easily recognized as applying to mac only?

[bpasero]

@jtlowe the setting will not show up on Windows and Linux. And it will eventually be supported across all OS.

[smlombardi]

The app looks much nicer with this enabled, thanks for adding this.

[wprater]

Note that on macOS when "window.titleBarStyle": "custom" is set, the usual behavior allowing one to see the path tree (while holding down the command key and clicking) of the file in the titlebar is not preserved. I realize this is a "custom" titlebar, but it would still be nice to keep this behavior.

[smlombardi]

@wprater Perhaps an option to display the entire path in the title bar? I've seen that option in other editors.

[bpasero]

@wprater good point, I guess one thing I could do is open a context menu upon Cmd+click that contains entries for the path segments to open in the finder. What I will not be able to do is to show icons though...

[bpasero]

[bpasero]

Btw we do also have a new option to show the full path in the title bar:

"window.showFullPath": true

[wprater]

I think users will appreciate that. I've used it many times over the years to open a directory from the title bar.

[bpasero]

It should be in insiders now.

[bpasero]

Closing, this is done minus bugs.

[mikaoelitiana]

Great job!! I am loving it

[wprater]

Closing, this is done minus bugs.

where is the bug list? thought I recalled you spelling them out? just wanted to track #15098 (comment)

[bpasero]

@wprater but that one is fixed in current insider builds.

Outstanding bugs are two I can think of right now:

• on sierra it can lead to a native crash (Custom Title: VS Code crashes when closing second tab in fullscreen #15154)
• when dev tools are opened and docked into the window you cannot move the window (With Developer Tools open, -webkit-app-region:drag does not work electron/electron#3647)