gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-03-03 21:58:09 +01:00
Code Issues Actions 15 Packages Projects Releases Wiki Activity

feat(desktop): integrate vibrancy

Browse Source
This commit is contained in:
Elian Doran 2026-01-26 23:21:40 +02:00
parent 120b767a68
commit 6856a98d50
No known key found for this signature in database
2 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
apps/client/src/desktop.ts
View File

@ -99,9 +99,8 @@ function initFullScreenDetection(currentWindow: Electron.BrowserWindow) {
} }
function initTransparencyEffects(style: CSSStyleDeclaration, currentWindow: Electron.BrowserWindow) { function initTransparencyEffects(style: CSSStyleDeclaration, currentWindow: Electron.BrowserWindow) {
const material = style.getPropertyValue("--background-material");
if (window.glob.platform === "win32") { if (window.glob.platform === "win32") {
const material = style.getPropertyValue("--background-material");
// TriliumNextTODO: find a nicer way to make TypeScript happy – unfortunately TS did not like Array.includes here
const bgMaterialOptions = ["auto", "none", "mica", "acrylic", "tabbed"] as const; const bgMaterialOptions = ["auto", "none", "mica", "acrylic", "tabbed"] as const;
const foundBgMaterialOption = bgMaterialOptions.find((bgMaterialOption) => material === bgMaterialOption); const foundBgMaterialOption = bgMaterialOptions.find((bgMaterialOption) => material === bgMaterialOption);
if (foundBgMaterialOption) { if (foundBgMaterialOption) {
@ -110,7 +109,11 @@ function initTransparencyEffects(style: CSSStyleDeclaration, currentWindow: Elec
} }
if (window.glob.platform === "darwin") { if (window.glob.platform === "darwin") {
currentWindow.setVibrancy("under-window"); const bgMaterialOptions = [ "popover", "tooltip", "titlebar", "selection", "menu", "sidebar", "header", "sheet", "window", "hud", "fullscreen-ui", "content", "under-window", "under-page" ] as const;
const foundBgMaterialOption = bgMaterialOptions.find((bgMaterialOption) => material === bgMaterialOption);
if (foundBgMaterialOption) {
currentWindow.setVibrancy(foundBgMaterialOption);
}
} }
} }

22
apps/client/src/stylesheets/theme-next/shell.css
View File

@ -46,7 +46,11 @@ body.background-effects.platform-win32 {
--background-material: tabbed; --background-material: tabbed;
} }
body.background-effects.theme-supports-background-effects.platform-win32 { body.background-effects.platform-darwin {
--background-material: under-window;
}
body.background-effects.theme-supports-background-effects {
--launcher-pane-horiz-border-color: var(--launcher-pane-horiz-border-color-bgfx); --launcher-pane-horiz-border-color: var(--launcher-pane-horiz-border-color-bgfx);
--launcher-pane-horiz-background-color: var(--launcher-pane-horiz-background-color-bgfx); --launcher-pane-horiz-background-color: var(--launcher-pane-horiz-background-color-bgfx);
--launcher-pane-vert-background-color: var(--launcher-pane-vert-background-color-bgfx); --launcher-pane-vert-background-color: var(--launcher-pane-vert-background-color-bgfx);
@ -60,29 +64,29 @@ body.background-effects.platform-win32.layout-vertical {
--background-material: mica; --background-material: mica;
} }
body.background-effects.theme-supports-background-effects.platform-win32.layout-vertical { body.background-effects.theme-supports-background-effects.layout-vertical {
--left-pane-background-color: var(--window-background-color-bgfx); --left-pane-background-color: var(--window-background-color-bgfx);
--center-pane-background-color-bgfx: var(--center-pane-vert-layout-background-color-bgfx); --center-pane-background-color-bgfx: var(--center-pane-vert-layout-background-color-bgfx);
--right-pane-background-color: var(--right-pane-background-color-bgfx); --right-pane-background-color: var(--right-pane-background-color-bgfx);
} }
body.background-effects.theme-supports-background-effects.platform-win32.layout-horizontal { body.background-effects.theme-supports-background-effects.layout-horizontal {
--center-pane-background-color-bgfx: var(--center-pane-horiz-layout-background-color-bgfx); --center-pane-background-color-bgfx: var(--center-pane-horiz-layout-background-color-bgfx);
--gutter-color: var(--left-pane-background-color); --gutter-color: var(--left-pane-background-color);
} }
body.background-effects.theme-supports-background-effects.platform-win32, body.background-effects.theme-supports-background-effects,
body.background-effects.theme-supports-background-effects.platform-win32 #root-widget { body.background-effects.theme-supports-background-effects #root-widget {
background: var(--window-background-color-bgfx) !important; background: var(--window-background-color-bgfx) !important;
} }
body.background-effects.theme-supports-background-effects.platform-win32.layout-horizontal #horizontal-main-container, body.background-effects.theme-supports-background-effects.layout-horizontal #horizontal-main-container,
body.background-effects.theme-supports-background-effects.platform-win32.layout-vertical #vertical-main-container { body.background-effects.theme-supports-background-effects.layout-vertical #vertical-main-container {
background-color: var(--root-background); background-color: var(--root-background);
} }
/* Note split with background effects */ /* Note split with background effects */
body.background-effects.theme-supports-background-effects.platform-win32 #center-pane .note-split.bgfx { body.background-effects.theme-supports-background-effects #center-pane .note-split.bgfx {
--note-split-background-color: var(--center-pane-background-color-bgfx); --note-split-background-color: var(--center-pane-background-color-bgfx);
} }
@ -1054,7 +1058,7 @@ body.layout-horizontal .tab-row-widget-container {
overflow: hidden; overflow: hidden;
} }
body.desktop:not(.background-effects.platform-win32) #root-widget.horizontal-layout { body.desktop:not(.background-effects) #root-widget.horizontal-layout {
background-color: var(--root-background) !important; background-color: var(--root-background) !important;
} }