fix: let a long submenu use the window's height, and draw one focus ring round the folder filter

This commit is contained in:
Linus Rath
2026-11-04 05:35:44 +01:00
parent d8b2488f88
commit 059015c8d1
2 changed files with 7 additions and 5 deletions
+5 -4
View File
@@ -189,8 +189,9 @@ export function MoveFolderList({
<div data-move-folder-list="">
{showFilter && (
<div className={cn("sticky top-0 z-10 bg-background", panel ? "px-4 py-2" : "px-2 pt-1 pb-1")}>
<label className="flex items-center gap-2 rounded-md border border-border px-2 focus-within:ring-2 focus-within:ring-ring">
<Search className="h-4 w-4 shrink-0 text-muted-foreground" />
{/* The field is the whole box, so the app's focus ring goes round all of it. */}
<div className="relative">
<Search className="pointer-events-none absolute start-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
<input
ref={inputRef}
type="text"
@@ -205,10 +206,10 @@ export function MoveFolderList({
}}
placeholder={t("filter_placeholder")}
aria-label={t("filter_placeholder")}
className={cn("min-w-0 flex-1 bg-transparent text-sm focus:outline-none", panel ? "h-10" : "h-8")}
className={cn("focus-inset w-full min-w-0 rounded-md border border-border bg-transparent ps-8 pe-2 text-sm", panel ? "h-10" : "h-8")}
data-testid="move-filter"
/>
</label>
</div>
</div>
)}
+2 -1
View File
@@ -781,7 +781,8 @@ export function ContextMenuSubMenu({
className="min-w-[180px] max-w-[min(20rem,calc(100vw-20px))] bg-background rounded-md shadow-lg border border-border"
role="menu"
>
<div className="py-1 max-h-[min(300px,calc(100vh-40px))] overflow-y-auto">
{/* As tall as the window allows (it's moved up to fit), then it scrolls. */}
<div className="py-1 max-h-[calc(100vh-22px)] overflow-y-auto">
{children}
</div>
</SubMenuPanel>