mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-10 13:22:14 +00:00
fix(ui): mobile stacked intake history, icon-collapse bulk bar, ResponsiveSheet parity, tap-target floor
Intake history stayed a 4-5 column table with two full datetime columns on mobile, forcing sideways scroll of a primary history surface; add the stacked card-list split below md (the measurement-list pattern) and lift the row kebab off a hard 32px box onto the size-11/size-9 floor. The documents bulk-action bar wrapped five labelled buttons into a 2-3 row floating slab at 360px; collapse to icon-only (aria-label carries the name) below sm, matching the document-detail-sheet footer's established pattern. Two coach/medication modals were still on raw Dialog while every sibling had moved to ResponsiveSheet: the schedule-era editor and the document attachment picker. Both now share the bottom-sheet-on-mobile primitive; the era editor's submit button associates to its form via the native `form` attribute since the footer slot sits outside the form's DOM subtree (the log-intake-dialog precedent). Tap-target floor: side-effect entry chips and the coach attachment-pill remove control were below the 44px floor; the chips get a min-h-11 flex-center, the pill remove gets an invisible hit-slop instead of growing the pill's visual footprint. Two insights empty-state CTAs were missing the existing `ctaSize="lg"` treatment already used by their sibling empty states.
This commit is contained in:
1 parent
66fe69b493
commit
5532a42ff6
7 files changed
+565
-397
No files matched your search
@@ -75,11 +75,23 @@ export function DocumentBulkBar({
|
||||
</p>
|
||||
|
||||
<div className="ml-auto flex flex-wrap items-center justify-end gap-1.5">
|
||||
{/* v1.30 mobile audit (DO-1) — five labelled buttons wrapped into a
|
||||
2–3-row floating slab at ~360 px. Below `sm` every verb collapses
|
||||
to icon-only (`aria-label` carries the accessible name; the
|
||||
visible label returns at `sm+`) — the `document-detail-sheet`
|
||||
footer's established icon-collapse pattern. */}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="outline" size="sm" disabled={busy}>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={busy}
|
||||
aria-label={t("documents.bulk.setKind")}
|
||||
>
|
||||
<Tag className="size-4" aria-hidden />
|
||||
{t("documents.bulk.setKind")}
|
||||
<span className="hidden sm:inline">
|
||||
{t("documents.bulk.setKind")}
|
||||
</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="end">
|
||||
@@ -98,9 +110,16 @@ export function DocumentBulkBar({
|
||||
{episodes.length > 0 ? (
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="outline" size="sm" disabled={busy}>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={busy}
|
||||
aria-label={t("documents.bulk.linkCondition")}
|
||||
>
|
||||
<FolderPlus className="size-4" aria-hidden />
|
||||
{t("documents.bulk.linkCondition")}
|
||||
<span className="hidden sm:inline">
|
||||
{t("documents.bulk.linkCondition")}
|
||||
</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="end">
|
||||
@@ -122,9 +141,10 @@ export function DocumentBulkBar({
|
||||
disabled={busy}
|
||||
onClick={onShare}
|
||||
data-slot="document-bulk-share"
|
||||
aria-label={t("documents.bulk.share")}
|
||||
>
|
||||
<Share2 className="size-4" aria-hidden />
|
||||
{t("documents.bulk.share")}
|
||||
<span className="hidden sm:inline">{t("documents.bulk.share")}</span>
|
||||
</Button>
|
||||
|
||||
{/* Solid destructive (matching the detail sheet's Delete) — the
|
||||
@@ -135,9 +155,10 @@ export function DocumentBulkBar({
|
||||
size="sm"
|
||||
disabled={busy}
|
||||
onClick={onDelete}
|
||||
aria-label={t("documents.bulk.delete")}
|
||||
>
|
||||
<Trash2 className="size-4" aria-hidden />
|
||||
{t("documents.bulk.delete")}
|
||||
<span className="hidden sm:inline">{t("documents.bulk.delete")}</span>
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
@@ -145,9 +166,12 @@ export function DocumentBulkBar({
|
||||
size="sm"
|
||||
className="text-muted-foreground"
|
||||
onClick={onClear}
|
||||
aria-label={t("documents.selection.clear")}
|
||||
>
|
||||
<X className="size-3.5" aria-hidden />
|
||||
{t("documents.selection.clear")}
|
||||
<span className="hidden sm:inline">
|
||||
{t("documents.selection.clear")}
|
||||
</span>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in new issue
Block a user