From e2c9052d4746b8ac0a4049eff01018a7123c6f73 Mon Sep 17 00:00:00 2001
From: oppiliappan <me@oppi.li>
Date: Fri, 18 Sep 2026 18:13:11 +0100
Subject: [PATCH] web/verify: centre the email verification result in a Card

Signed-off-by: oppiliappan <me@oppi.li>
---
 web/src/routes/verify/email/+page.svelte | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/web/src/routes/verify/email/+page.svelte b/web/src/routes/verify/email/+page.svelte
index 4cbf7b4c4..9a5b001d7 100644
--- a/web/src/routes/verify/email/+page.svelte
+++ b/web/src/routes/verify/email/+page.svelte
@@ -2,6 +2,7 @@
 	import { page } from "$app/state";
 	import { VerificationError, verifyEmailByToken } from "$lib/api/emails";
 	import Button from "$lib/components/ui/Button.svelte";
+	import Card from "$lib/components/ui/Card.svelte";
 	import MailCheck from "$icon/mail-check";
 	import TriangleAlert from "$icon/triangle-alert";
 	import Settings from "$icon/settings";
@@ -36,9 +37,11 @@
 	});
 </script>
 
-<div class="flex min-h-64 w-full items-center justify-center">
-	<div
-		class="flex w-full max-w-md flex-col items-center gap-4 rounded-sm border border-border-default p-8 text-center"
+<div class="flex min-h-[70svh] w-full items-center justify-center px-4 py-8">
+	<Card
+		shadow
+		padding="none"
+		class="flex w-full max-w-md flex-col items-center gap-4 p-8 text-center"
 	>
 		{#if state.kind === "verifying"}
 			<span class="typography-paragraph-regular text-foreground-muted"
@@ -60,5 +63,5 @@
 			<p class="typography-paragraph-regular text-foreground-muted">{state.message}</p>
 			<Button icon={Settings} href="/settings/emails">Go to email settings</Button>
 		{/if}
-	</div>
+	</Card>
 </div>
-- 
2.51.2