diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css index 73b929170..2f5ecfa19 100644 --- a/apps/client/src/stylesheets/theme-next-dark.css +++ b/apps/client/src/stylesheets/theme-next-dark.css @@ -166,6 +166,9 @@ --protected-session-active-icon-color: #8edd8e; --sync-status-error-pulse-color: #f47871; + --center-pane-vert-layout-background-color-bgfx: #0c0c0c69; + --center-pane-horiz-layout-background-color-bgfx: #1e1e1ec7; + --right-pane-heading-color: gray; --root-background: var(--left-pane-background-color); diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css index 21c527993..121ee0dec 100644 --- a/apps/client/src/stylesheets/theme-next-light.css +++ b/apps/client/src/stylesheets/theme-next-light.css @@ -159,6 +159,9 @@ --protected-session-active-icon-color: #16b516; --sync-status-error-pulse-color: #ff5528; + --center-pane-vert-layout-background-color-bgfx: #ffffff75; + --center-pane-horiz-layout-background-color-bgfx: #ffffffd6; + --right-pane-heading-color: gray; --root-background: var(--left-pane-background-color); diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css index 5e375bbea..4e3ef494b 100644 --- a/apps/client/src/stylesheets/theme-next/shell.css +++ b/apps/client/src/stylesheets/theme-next/shell.css @@ -43,13 +43,19 @@ body.background-effects.platform-win32 { --tab-background-color: var(--window-background-color-bgfx); --new-tab-button-background: var(--window-background-color-bgfx); --active-tab-background-color: var(--launcher-pane-horiz-background-color); + --root-background: transparent; } body.background-effects.platform-win32.layout-vertical { --left-pane-background-color: var(--window-background-color-bgfx); + --center-pane-background-color-bgfx: var(--center-pane-vert-layout-background-color-bgfx); --background-material: mica; } +body.background-effects.platform-win32.layout-horizontal { + --center-pane-background-color-bgfx: var(--center-pane-horiz-layout-background-color-bgfx); +} + body.background-effects.platform-win32, body.background-effects.platform-win32 #root-widget { background: var(--window-background-color-bgfx) !important; @@ -59,6 +65,12 @@ body.background-effects.platform-win32.layout-horizontal #horizontal-main-contai body.background-effects.platform-win32.layout-vertical #vertical-main-container { background-color: var(--root-background); } + +/* TODO: optimize */ +body.background-effects.platform-win32 #center-pane:has(.type-contentWidget.visible .note-detail-content-widget-content.options) { + /* Settings page */ + --center-pane-background-color: var(--center-pane-background-color-bgfx); +} /* #endregion */ /* Matches when the left pane is collapsed */ @@ -1172,7 +1184,7 @@ body.layout-vertical .tab-row-widget-is-sorting .note-tab.note-tab-is-dragging . */ #center-pane { - background: var(--main-background-color); + background: var(--center-pane-background-color, var(--main-background-color)); } .vertical-layout #center-pane {