monadical/opencode
14
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix(app): better header item wrapping (#10831)

Browse Source
This commit is contained in:
Filip
2026-01-29 21:51:56 +01:00
committed by GitHub
parent fdd484d2c1
commit aa1d0f6167
2 changed files with 24 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/app/src/components/session/session-header.tsx
View File

@@ -130,7 +130,7 @@ export function SessionHeader() {
<Portal mount={mount()}> <Portal mount={mount()}>
<button <button
type="button" type="button"
class="hidden md:flex w-[320px] p-1 pl-1.5 items-center gap-2 justify-between rounded-md border border-border-weak-base bg-surface-raised-base transition-colors cursor-default hover:bg-surface-raised-base-hover focus-visible:bg-surface-raised-base-hover active:bg-surface-raised-base-active" class="hidden md:flex w-[320px] max-w-full min-w-0 p-1 pl-1.5 items-center gap-2 justify-between rounded-md border border-border-weak-base bg-surface-raised-base transition-colors cursor-default hover:bg-surface-raised-base-hover focus-visible:bg-surface-raised-base-hover active:bg-surface-raised-base-active"
onClick={() => command.trigger("file.open")} onClick={() => command.trigger("file.open")}
aria-label={language.t("session.header.searchFiles")} aria-label={language.t("session.header.searchFiles")}
> >

35
packages/app/src/components/titlebar.tsx
View File

@@ -132,12 +132,14 @@ export function Titlebar() {
} }
return ( return (
<header class="h-10 shrink-0 bg-background-base flex items-center relative" data-tauri-drag-region> <header
class="h-10 shrink-0 bg-background-base relative grid grid-cols-[auto_minmax(0,1fr)_auto] items-center"
data-tauri-drag-region
>
<div <div
classList={{ classList={{
"flex items-center w-full min-w-0": true, "flex items-center min-w-0": true,
"pl-2": !mac(), "pl-2": !mac(),
"pr-6": !windows(),
}} }}
onMouseDown={drag} onMouseDown={drag}
data-tauri-drag-region data-tauri-drag-region
@@ -218,20 +220,29 @@ export function Titlebar() {
</div> </div>
</div> </div>
<div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" data-tauri-drag-region /> <div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" data-tauri-drag-region />
<div class="flex-1 h-full" data-tauri-drag-region /> </div>
<div
id="opencode-titlebar-right" <div
class="flex items-center gap-3 shrink-0 flex-1 justify-end" class="min-w-0 flex items-center justify-center pointer-events-none lg:absolute lg:inset-0 lg:flex lg:items-center lg:justify-center"
data-tauri-drag-region data-tauri-drag-region
/> >
<div id="opencode-titlebar-center" class="pointer-events-auto w-full min-w-0 flex justify-center lg:w-fit" />
</div>
<div
classList={{
"flex items-center min-w-0 justify-end": true,
"pr-6": !windows(),
}}
onMouseDown={drag}
data-tauri-drag-region
>
<div id="opencode-titlebar-right" class="flex items-center gap-3 shrink-0 justify-end" data-tauri-drag-region />
<Show when={windows()}> <Show when={windows()}>
<div class="w-6 shrink-0" /> <div class="w-6 shrink-0" />
<div data-tauri-decorum-tb class="flex flex-row" /> <div data-tauri-decorum-tb class="flex flex-row" />
</Show> </Show>
</div> </div>
<div class="absolute inset-0 flex items-center justify-center pointer-events-none">
<div id="opencode-titlebar-center" class="pointer-events-auto" />
</div>
</header> </header>
) )
} }