feat(mica): define material at CSS level

This commit is contained in:
Elian Doran
2024-12-07 10:02:56 +02:00
parent 5d07c3049d
commit 5a5a3ab508
2 changed files with 9 additions and 9 deletions

View File

@@ -50,17 +50,16 @@ function initOnElectron() {
const electronRemote = utils.dynamicRequire("@electron/remote");
const currentWindow = electronRemote.getCurrentWindow();
const style = window.getComputedStyle(document.body);
initTransparencyEffects(currentWindow);
initTransparencyEffects(style, currentWindow);
if (options.get("nativeTitleBarVisible") !== "true") {
initTitleBarButtons(currentWindow);
initTitleBarButtons(style, currentWindow);
}
}
function initTitleBarButtons(currentWindow) {
const style = window.getComputedStyle(document.body);
function initTitleBarButtons(style, currentWindow) {
if (window.glob.platform === "win32") {
const applyWindowsOverlay = () => {
const color = style.getPropertyValue("--native-titlebar-background");
@@ -84,10 +83,9 @@ function initTitleBarButtons(currentWindow) {
}
}
function initTransparencyEffects(currentWindow) {
function initTransparencyEffects(style, currentWindow) {
if (window.glob.platform === "win32") {
const isHorizontalLayout = (options.get("layoutOrientation") === "horizontal");
const backgroundMaterial = isHorizontalLayout ? "tabbed" : "mica";
currentWindow.setBackgroundMaterial(backgroundMaterial);
const material = style.getPropertyValue("--background-material");
currentWindow.setBackgroundMaterial(material);
}
}

View File

@@ -419,6 +419,7 @@ body.electron.platform-win32 {
--tab-background-color: transparent;
--active-tab-background-color: var(--launcher-pane-background-color);
--native-titlebar-background: #00000000;
--background-material: tabbed;
}
@media (prefers-color-scheme: dark) {
@@ -431,6 +432,7 @@ body.electron.platform-win32 {
body.electron.platform-win32.layout-vertical {
--left-pane-background-color: transparent;
--launcher-pane-background-color: rgba(255, 255, 255, 0.055);
--background-material: mica;
}
body.electron.platform-win32,