mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-14 06:40:50 +00:00
fix(auth): lift the register submit button and add a branded not-found page
Promote the register page's submit button to the 44 px tap-target floor (size="lg" + min-h-11 + w-full) so the primary action stays finger-tap reachable on a narrow viewport. Add a new branded not-found.tsx page. The previous implicit fallback was Next.js's bare framework text; this introduces a lighter wrapper than ErrorDetails (404 is not an application error) — Logo, headline, explanatory paragraph, and a single "Back to dashboard" link. The wrapper carries min-h-dvh and safe-area-inset-top so the panel anchors centred under iOS Safari's animated URL bar and stays clear of the notch. Apply the same dvh + safe-area pattern on the root-layout global error boundary and lift its inline button heights to 44 px. Wrap the ErrorDetails panel in a min-h-dvh flex column so server-error pages also centre instead of hugging the notch.
This commit is contained in:
1 parent
fc8a58557a
commit
de0c16338f
4 files changed
+81
-8
No files matched your search
@@ -74,7 +74,12 @@ export function ErrorDetails({
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mx-auto w-full max-w-xl space-y-4 p-6">
|
||||
// v1.4.27 MB6 — `min-h-dvh flex flex-col justify-center` makes
|
||||
// the error panel anchor in the middle of the available viewport
|
||||
// even when this component is mounted at the root layout. Without
|
||||
// it the panel hugged the top edge under the notch on
|
||||
// small-screen devices.
|
||||
<div className="mx-auto flex min-h-dvh w-full max-w-xl flex-col justify-center space-y-4 p-6">
|
||||
<h1 className="text-xl font-semibold">{t("errorBoundary.title")}</h1>
|
||||
<p className="text-muted-foreground text-sm">
|
||||
{t("errorBoundary.description")}
|
||||
|
||||
Reference in new issue
Block a user