Dialogs close from a button and rise from the bottom on phones
DModal draws a close button (✕, named by CloseText) beside its heading, in a header that stays in view while the box scrolls; a long list of who liked a post left only the thin margins around the box to tap out of it. A new ResponsiveBottom placement makes the box a sheet from the bottom below md and keeps it in the middle from md; the report, liked-by and boosted-by, edit history and public notice dialogs use it. Boxes are at most 100dvh tall, so a phone's browser bars don't cut them, and a bottom sheet leaves 3rem above itself and clears the home indicator. The report dialog gets a Cancel button. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw
This commit is contained in:
1 parent
87f3f2402a
commit
6731077191
7 files changed
+43
-10
No files matched your search
@@ -398,7 +398,7 @@
|
||||
}
|
||||
@if (isHistoryOpen)
|
||||
{
|
||||
<DModal IsOpen="true" IsOpenChanged="HistoryClosed" CloseText="@Localizer["Close"]" data-history-list>
|
||||
<DModal Placement="DModalPlacement.ResponsiveBottom" IsOpen="true" IsOpenChanged="HistoryClosed" CloseText="@Localizer["Close"]" data-history-list>
|
||||
<Heading>@Localizer["Edit history"]</Heading>
|
||||
<ChildContent>
|
||||
<ol class="flex flex-col gap-4 mt-3">
|
||||
|
||||
Reference in new issue
Block a user