Skip to content

Commit

Chat on a phone: the list and its new-message button follow the real top and tab bar heights; the new-message sheet keeps clear of the home indicator without extra padding

syntaqxcommitted Parent9fae0d2Browse files
2 files+3−30/2 viewed
+1−1
282282 </button>
283283 )}
284284 <Dialog open={open} onOpenChange={setOpen}>
285− <DialogContent className="max-w-md gap-0 p-0" showClose={false}>
285+ <DialogContent className="max-w-md gap-0 p-0 max-sm:pb-[env(safe-area-inset-bottom)]" showClose={false}>
286286 {open && <NewMessage slug={slug} onDone={() => setOpen(false)} />}
287287 </DialogContent>
288288 </Dialog>
+2−2
6060 return (
6161 <>
6262 {/* A phone: the list of conversations, full screen. */}
63− <div className="h-[calc(100dvh-3.5rem-3.5rem-env(safe-area-inset-bottom)-env(safe-area-inset-top))] md:hidden">
63+ <div className="h-[calc(100dvh-var(--topbar-h)-var(--tabbar-h))] md:hidden">
6464 <ChatSidebar slug={params.owner.toLowerCase()} heading={false} />
65− <div className="fixed right-4 bottom-[calc(3.5rem+env(safe-area-inset-bottom)+1rem)] z-30">
65+ <div className="fixed right-4 bottom-[calc(var(--tabbar-h)+1rem)] z-30">
6666 <NewMessageButton slug={params.owner.toLowerCase()} variant="fab" />
6767 </div>
6868 </div>