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

tweak(app): match titlebar active bg to hover

Browse Source 
Use the ghost hover background for active/expanded titlebar actions and tighten titlebar popover gutters to 4px.
This commit is contained in:
David Hill
2026-02-17 13:59:13 +00:00
parent d31e9cff6a
commit a8669aba8f
2 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -383,7 +383,7 @@ export function SessionHeader() {
</Button>
<div class="self-stretch w-px bg-border-weak-base" />
<DropdownMenu
gutter={6}
gutter={4}
placement="bottom-end"
open={menu.open}
onOpenChange={(open) => setMenu("open", open)}
@@ -392,7 +392,7 @@ export function SessionHeader() {
as={IconButton}
icon="chevron-down"
variant="ghost"
class="rounded-none h-full w-[24px] p-0 border-none shadow-none data-[expanded]:bg-surface-raised-base-active"
class="rounded-none h-full w-[24px] p-0 border-none shadow-none data-[expanded]:bg-surface-raised-base-hover"
aria-label={language.t("session.header.open.menu")}
/>
<DropdownMenu.Portal>
@@ -458,7 +458,7 @@ export function SessionHeader() {
? language.t("session.share.popover.description.shared")
: language.t("session.share.popover.description.unshared")
}
gutter={6}
gutter={4}
placement="bottom-end"
shift={-64}
class="rounded-xl [&_[data-slot=popover-close-button]]:hidden"

4
packages/app/src/components/status-popover.tsx
View File

@@ -196,7 +196,7 @@ export function StatusPopover() {
triggerProps={{
variant: "ghost",
class:
"rounded-md h-[24px] pr-3 pl-0.5 gap-2 border border-border-weak-base bg-surface-panel shadow-none data-[expanded]:bg-surface-raised-base-active",
"rounded-md h-[24px] pr-3 pl-0.5 gap-2 border border-border-weak-base bg-surface-panel shadow-none data-[expanded]:bg-surface-raised-base-hover",
style: { scale: 1 },
}}
trigger={
@@ -215,7 +215,7 @@ export function StatusPopover() {
</div>
}
class="[&_[data-slot=popover-body]]:p-0 w-[360px] max-w-[calc(100vw-40px)] bg-transparent border-0 shadow-none rounded-xl"
gutter={6}
gutter={4}
placement="bottom-end"
shift={-136}
>