Skip to content
9 changes: 7 additions & 2 deletions src/components/clinical-dashboard/global-search-shell.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -476,7 +476,12 @@ function GlobalStandaloneSearchShellClient({
return (
<div
className={cn(
"min-h-dvh max-sm:fixed max-sm:inset-0 max-sm:h-dvh max-sm:overflow-hidden bg-[color:var(--background)] text-[color:var(--text)]",
// Phone shell height comes from inset-0 alone, never 100dvh: iOS Safari
// re-resolves dvh lazily when its toolbar collapses/expands (especially
// with body scrolling disabled like here), leaving a dead band between
// the clipped shell and the toolbar. Fixed insets track the live
// viewport through the whole transition, so content stays edge to edge.
"sm:min-h-dvh max-sm:fixed max-sm:inset-0 max-sm:overflow-hidden bg-[color:var(--background)] text-[color:var(--text)]",
shouldShowDesktopSidebar && "md:grid md:grid-cols-[5.25rem_minmax(0,1fr)]",
shouldShowDesktopSidebar &&
"motion-safe:transition-[grid-template-columns] motion-safe:duration-200 motion-safe:ease-out",
Expand Down Expand Up @@ -514,7 +519,7 @@ function GlobalStandaloneSearchShellClient({
</div>
) : null}

<div className="flex min-h-dvh min-w-0 flex-col max-sm:h-dvh max-sm:min-h-0 max-sm:overflow-hidden">
<div className="flex min-w-0 flex-col max-sm:h-full max-sm:min-h-0 max-sm:overflow-hidden sm:min-h-dvh">
<div className={mobileChromeVisible ? undefined : "hidden lg:block"}>
<MasterSearchHeader
documents={[]}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1438,7 +1438,7 @@ export function MasterSearchHeader({
closeButtonClassName="grid h-11 w-11 shrink-0 place-items-center rounded-xl border border-[color:var(--border)] bg-[color:var(--surface)] text-[color:var(--text-muted)] shadow-[var(--shadow-inset)] transition hover:border-[color:var(--border-strong)] hover:bg-[color:var(--surface-subtle)] hover:text-[color:var(--text)] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--focus)]"
contentClassName={cn(
"bg-[color:var(--surface-lux)]",
scopeSheetFullscreen ? "max-h-dvh" : "max-h-[min(84dvh,42rem)]",
scopeSheetFullscreen ? "max-h-full" : "max-h-[min(84dvh,42rem)]",
"sm:max-h-[min(88dvh,44rem)] sm:max-w-xl",
)}
bodyClassName={cn(
Expand Down
2 changes: 1 addition & 1 deletion src/components/clinical-dashboard/settings-dialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,7 @@ export function SettingsDialog({
contentClassName="w-full max-w-none border-[color:var(--border-lux)] bg-[color:var(--background)] font-sans shadow-none lg:max-w-[900px] lg:bg-[color:var(--surface-lux)] lg:shadow-[var(--shadow-lux)]"
bodyClassName="p-0"
>
<div className="relative grid h-dvh max-h-dvh min-h-0 overflow-hidden lg:h-auto lg:max-h-[min(86dvh,820px)] lg:grid-cols-[250px_minmax(0,1fr)]">
<div className="relative grid h-full max-h-full min-h-0 overflow-hidden lg:h-auto lg:max-h-[min(86dvh,820px)] lg:grid-cols-[250px_minmax(0,1fr)]">
{closeButton}
<aside className="hidden border-r border-[color:var(--border-lux)] bg-[color:var(--surface)]/72 px-4 pb-5 pt-16 lg:flex lg:flex-col">
<nav aria-label="Settings sections" className="grid gap-1.5">
Expand Down
7 changes: 5 additions & 2 deletions src/components/ui/sheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -226,10 +226,13 @@ export function Sheet({
"flex min-w-0 w-full flex-col overflow-hidden border border-[color:var(--border-lux)] bg-[color:var(--surface-raised)] text-[color:var(--text)] shadow-[var(--shadow-elevated)] pb-safe",
"transition duration-200 motion-reduce:transition-none sm:duration-150",
placement === "left"
? "h-full max-h-dvh max-w-[min(22rem,calc(100vw-1rem))] rounded-r-2xl border-y-0 border-l-0 pt-safe sm:max-h-dvh sm:max-w-[22rem] sm:rounded-l-none sm:rounded-r-2xl sm:pb-0"
? "h-full max-h-full max-w-[min(22rem,calc(100vw-1rem))] rounded-r-2xl border-y-0 border-l-0 pt-safe sm:max-h-dvh sm:max-w-[22rem] sm:rounded-l-none sm:rounded-r-2xl sm:pb-0"
: cn(
defaultSheetIsFullscreen
? "h-dvh max-h-dvh rounded-none border-0 motion-safe:animate-pop-in sm:max-w-none sm:rounded-none lg:h-auto lg:max-h-[calc(100dvh-3rem)] lg:rounded-2xl lg:border lg:border-[color:var(--border-lux)] lg:pb-0 lg:motion-safe:animate-dialog-rise"
? // Fullscreen panels size from the inset-0 backdrop (h-full), not
// 100dvh: iOS Safari resolves dvh stale across toolbar
// collapse, which strands a dead band under the sheet.
"h-full max-h-full rounded-none border-0 motion-safe:animate-pop-in sm:max-w-none sm:rounded-none lg:h-auto lg:max-h-[calc(100dvh-3rem)] lg:rounded-2xl lg:border lg:border-[color:var(--border-lux)] lg:pb-0 lg:motion-safe:animate-dialog-rise"
: cn(
"sm:max-w-lg sm:rounded-2xl sm:pb-0 sm:motion-safe:animate-dialog-rise",
defaultSheetIsTopAligned
Expand Down