Element-web: Make the system menu dark themed when using the dark theme

Created on 15 Feb 2019 · 5Comments · Source: vector-im/element-web

This might be hard, because Windows.

feature p1 cosmetic minor electron uux

Source

turt2live

Most helpful comment

screen shot 2019-02-15 at 01 08 54

There are some possible solutions on macOS:

Use the native dark theme API
Works only on Mojave and later.
Use the native bar tint API
Seems to work as far as Yosemite (afaik), is used by Sublime Text, Telegram, etc. Can be tinted with any color.
Ignore the title bar completely and add system buttons on top
Idk if there's an API for that, but it looks like most electron apps pick this one so it shouldn't be hard.

yangm97 on 15 Feb 2019

👍3

screen shot 2019-02-15 at 01 08 54

There are some possible solutions on macOS:

Use the native dark theme API
Works only on Mojave and later.
Use the native bar tint API
Seems to work as far as Yosemite (afaik), is used by Sublime Text, Telegram, etc. Can be tinted with any color.
Ignore the title bar completely and add system buttons on top
Idk if there's an API for that, but it looks like most electron apps pick this one so it shouldn't be hard.

yangm97 on 15 Feb 2019

👍3

This would be really, really, really appreciated!

starcraft66 on 15 Feb 2019

Upon further inspection, a quick and dirty way of getting this working on macOS 10.14+ is setting the NSRequiresAquaSystemAppearance to false in the application's Info.plist file as per https://developer.apple.com/documentation/appkit/nsappearancecustomization/choosing_a_specific_appearance_for_your_app.

However, electron also apparently has built-in APIs to manage the title bar colour: https://github.com/electron/electron/issues/13387

starcraft66 on 15 Feb 2019

would be nice