Give the title bar strip back its drag, and the rule its full height

The window's content runs the full height underneath the title bar, so
the shell covers the bar - and a webview covering the bar swallows the
gesture that moves the window. The strip standing in for it now says it
is a drag region.

That strip also moves inside each column instead of spanning both, so the
rule between the nav and the app runs the whole height of the window
rather than starting below the bar.
This commit is contained in:
2026-09-02 09:44:51 +02:00
parent aa19da48de
commit 0ae5746a30
3 changed files with 47 additions and 34 deletions
+5 -1
View File
@@ -15,6 +15,8 @@ interface Props {
onBack: () => void;
onForward: () => void;
onReload: () => void;
/** Height of the title bar the window's content runs underneath. */
chrome: number;
}
/**
@@ -29,7 +31,7 @@ export const navWidth = (collapsed: boolean) => (collapsed ? RAIL : PANEL);
export default function Nav({
config, activeId, collapsed, unread,
onSelect, onToggleCollapse, onOpenSettings, onToggleGroup,
onBack, onForward, onReload,
onBack, onForward, onReload, chrome,
}: Props) {
const groups = [...config.groups].sort((a, b) => a.order - b.order);
const inGroup = (id: string | null) =>
@@ -124,6 +126,7 @@ export default function Nav({
return (
<aside className={`${shell} items-center`} style={{ width: RAIL }}>
<div data-tauri-drag-region className="w-full shrink-0" style={{ height: chrome }} />
{/* Only the expander survives the rail's header. Back and forward are
a two-finger swipe and reload is ⌘R, so a toolbar here would be
clutter standing in for something nobody asked for. */}
@@ -178,6 +181,7 @@ export default function Nav({
return (
<aside className={shell} style={{ width: PANEL }}>
<div data-tauri-drag-region className="shrink-0" style={{ height: chrome }} />
<header className="flex items-center gap-0.5 border-b border-slate-200 px-1.5 py-2.5 dark:border-slate-800">
{controls}
<button