From 78440cfbc3d86961eec43f935d0d755ae912f2e5 Mon Sep 17 00:00:00 2001
From: George Powell <geohpowell@gmail.com>
Date: Tue, 10 Feb 2026 21:05:10 -0500
Subject: [PATCH] Fix infinite stats submission and improve mobile button
 layout

- Fix infinite loop in stats submission effect by adding statsData to early return condition
- Make bottom buttons (View Stats, Sign In/Out) full-width on small screens
- Buttons now stack vertically on mobile, side-by-side on medium+ screens

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 src/routes/+page.svelte | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 494ed87..f6eea9b 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -267,7 +267,7 @@
 			statsData,
 		});
 
-		if (!browser || !isWon || !anonymousId) {
+		if (!browser || !isWon || !anonymousId || statsData) {
 			console.log("Basic conditions not met");
 			return;
 		}
@@ -507,20 +507,20 @@
 				<Credits />
 			{/if}
 		</div>
-		<div class="mt-8 flex flex-col items-center gap-3">
-			<div class="flex gap-3">
-				<a 
+		<div class="mt-8 flex flex-col items-stretch md:items-center gap-3">
+			<div class="flex flex-col md:flex-row gap-3">
+				<a
 					href="/stats?{user ? `userId=${user.id}` : `anonymousId=${anonymousId}`}"
-					class="inline-flex items-center px-4 py-2 bg-amber-600 text-white rounded-lg hover:bg-amber-700 transition-colors text-sm font-medium shadow-md"
+					class="inline-flex items-center justify-center px-4 py-2 bg-amber-600 text-white rounded-lg hover:bg-amber-700 transition-colors text-sm font-medium shadow-md"
 				>
 					📊 View Stats
 				</a>
-				
+
 				{#if user}
-					<form method="POST" action="/auth/logout" use:enhance>
+					<form method="POST" action="/auth/logout" use:enhance class="w-full md:w-auto">
 						<button
 							type="submit"
-							class="inline-flex items-center px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors text-sm font-medium shadow-md"
+							class="inline-flex items-center justify-center w-full px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors text-sm font-medium shadow-md"
 						>
 							🚪 Sign Out
 						</button>
@@ -528,7 +528,7 @@
 				{:else}
 					<button
 						onclick={() => authModalOpen = true}
-						class="inline-flex items-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-sm font-medium shadow-md"
+						class="inline-flex items-center justify-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors text-sm font-medium shadow-md"
 					>
 						🔐 Sign In
 					</button>