Add frameless window with custom drag regions (Obsidian-style)

Remove native macOS titlebar via decorations:false + titleBarStyle:overlay.
Add -webkit-app-region:drag to panel headers (Sidebar, NoteList, Editor tab
bar, Inspector) with no-drag on interactive elements. Sidebar header gets
78px left padding for macOS traffic light buttons.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
lucaronin
2026-02-15 10:00:29 +01:00
parent 9c49c3eea9
commit 9d29959fba
9 changed files with 898 additions and 55 deletions

View File

@@ -29,6 +29,14 @@
color: #383858;
}
/* Drag strip for frameless window (shown when no tabs are open) */
.editor__drag-strip {
height: 48px;
flex-shrink: 0;
-webkit-app-region: drag;
app-region: drag;
}
/* Tab bar */
.editor__tab-bar {
display: flex;
@@ -36,6 +44,8 @@
border-bottom: 1px solid #2a2a4a;
overflow-x: auto;
flex-shrink: 0;
-webkit-app-region: drag;
app-region: drag;
}
.editor__tab-bar::-webkit-scrollbar {
@@ -55,6 +65,8 @@
max-width: 180px;
flex-shrink: 0;
transition: all 0.1s;
-webkit-app-region: no-drag;
app-region: no-drag;
}
.editor__tab:hover {