mirror of
https://github.com/bulwarkmail/webmail.git
synced 2026-11-05 00:14:18 +00:00
fix: let a long submenu use the window's height, and draw one focus ring round the folder filter
This commit is contained in:
@@ -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>
|
||||
)}
|
||||
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user