diff --git a/apps/client/src/stylesheets/theme-next-dark.css b/apps/client/src/stylesheets/theme-next-dark.css index f4848739e..8e92f4900 100644 --- a/apps/client/src/stylesheets/theme-next-dark.css +++ b/apps/client/src/stylesheets/theme-next-dark.css @@ -170,6 +170,9 @@ --protected-session-active-icon-color: #8edd8e; --sync-status-error-pulse-color: #f47871; + --classic-toolbar-vert-layout-background-color: var(--main-background-color); + --classic-toolbar-horiz-layout-background-color: var(--main-background-color); + --center-pane-vert-layout-background-color-bgfx: #0c0c0c69; --center-pane-horiz-layout-background-color-bgfx: #1e1e1ec7; diff --git a/apps/client/src/stylesheets/theme-next-light.css b/apps/client/src/stylesheets/theme-next-light.css index 0f71df9c3..1bc72a3e2 100644 --- a/apps/client/src/stylesheets/theme-next-light.css +++ b/apps/client/src/stylesheets/theme-next-light.css @@ -162,6 +162,9 @@ --protected-session-active-icon-color: #16b516; --sync-status-error-pulse-color: #ff5528; + --classic-toolbar-vert-layout-background-color: var(--main-background-color); + --classic-toolbar-horiz-layout-background-color: var(--main-background-color); + --center-pane-vert-layout-background-color-bgfx: #ffffff75; --center-pane-horiz-layout-background-color-bgfx: #ffffffd6; diff --git a/apps/client/src/stylesheets/theme-next/base.css b/apps/client/src/stylesheets/theme-next/base.css index e3468421e..f77696dc0 100644 --- a/apps/client/src/stylesheets/theme-next/base.css +++ b/apps/client/src/stylesheets/theme-next/base.css @@ -50,7 +50,7 @@ --tab-bar-height: 50px; --tab-height: 36px; - --tab-first-item-horiz-offset: 1px; + --tab-first-item-horiz-offset: 0; --new-tab-button-size: 24px; --center-pane-border-radius: 10px; diff --git a/apps/client/src/stylesheets/theme-next/shell.css b/apps/client/src/stylesheets/theme-next/shell.css index e3e92cd7d..f1e9c181b 100644 --- a/apps/client/src/stylesheets/theme-next/shell.css +++ b/apps/client/src/stylesheets/theme-next/shell.css @@ -1029,7 +1029,7 @@ body.layout-vertical.electron.platform-darwin .tab-row-container { } body.layout-horizontal .tab-row-container { - padding-top: calc((var(--tab-bar-height) - var(--tab-height))); + padding-top: calc(var(--tab-bar-height) - var(--tab-height)); } /* Define extra drag areas for Electron windows */ @@ -1069,8 +1069,9 @@ body.desktop:not(.background-effects.platform-win32) #root-widget.horizontal-lay border-bottom-color: transparent; } -.tab-row-widget .note-tab .note-tab-wrapper { +:root div.tab-row-widget div.note-tab div.note-tab-wrapper { height: var(--tab-height) !important; + border-radius: 8px; transition: background 75ms ease-in, box-shadow 75ms ease-in; @@ -1221,13 +1222,35 @@ body.layout-vertical .tab-row-widget-is-sorting .note-tab.note-tab-is-dragging . top: 0; } +/* + * CLASSIC FORMATTING TOOLBAR + */ + +#rest-pane > .classic-toolbar-widget { + margin-bottom: 2px; + border-start-start-radius: var(--center-pane-border-radius); +} + +body.layout-vertical #rest-pane > .classic-toolbar-widget { + background: var(--classic-toolbar-vert-layout-background-color); +} + +body.layout-horizontal #rest-pane > .classic-toolbar-widget { + background: var(--classic-toolbar-horiz-layout-background-color); +} + +.classic-toolbar-widget:not(.hidden-ext) + #vertical-main-container { + /* Remove the center panel border radius when the toolbar is visible */ + --center-pane-border-radius: 0; +} + /* * CENTER PANE */ /* The first visible note split */ .vertical-layout #center-pane .note-split:not(.visible ~ .visible) { - border-radius: var(--center-pane-border-radius) 0 0 0; + border-start-start-radius: var(--center-pane-border-radius); } #center-pane .note-split {