mirror of
https://github.com/wavetermdev/waveterm.git
synced 2024-12-22 16:48:23 +01:00
Use Window Controls Overlay API for native-like experience on Windows and Linux (#240)
This PR implements the [Window Controls Overlay API](https://web.dev/articles/window-controls-overlay) to let us hide the menu bar on Windows and Linux and directly embed the window controls in our tab bar. With #239 merged, we no longer need the menu bar on these platforms. The overlaid window controls are transparent so they will take on the background from the app. I've updated the tab bar to flow properly using the API's CSS environment variables. At some point, we may want to update the logic around the symbolColor so that it can ensure a proper contrast between the background and the symbols in the window controls. For now, setting them to white works for all the backgrounds we currently support. ![image (2)](https://github.com/user-attachments/assets/7610f10b-9696-435c-9a2d-a435bee9fadb) https://github.com/user-attachments/assets/8d19b512-5281-42b9-8abb-ccb9b850061f
This commit is contained in:
parent
4a782f2747
commit
edfe711eda
@ -332,7 +332,14 @@ function createBrowserWindow(
|
||||
};
|
||||
winBounds = ensureBoundsAreVisible(winBounds);
|
||||
const winOpts: Electron.BrowserWindowConstructorOptions = {
|
||||
titleBarStyle: "hiddenInset",
|
||||
titleBarStyle: unamePlatform === "darwin" ? "hiddenInset" : "hidden",
|
||||
titleBarOverlay:
|
||||
unamePlatform !== "darwin"
|
||||
? {
|
||||
symbolColor: "white",
|
||||
color: "#00000000",
|
||||
}
|
||||
: false,
|
||||
x: winBounds.x,
|
||||
y: winBounds.y,
|
||||
width: winBounds.width,
|
||||
|
@ -17,6 +17,7 @@
|
||||
user-select: none;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: env(titlebar-area-width);
|
||||
|
||||
.tabs-wrapper {
|
||||
transition: var(--tabs-wrapper-transition);
|
||||
|
Loading…
Reference in New Issue
Block a user