Moved Logout Button

src/app/(app)/page.tsx

@@ -15,13 +15,7 @@ function Mobile() {
 			<h1 className="text-3xl sm:text-4xl font-bold tracking-[-.01em] text-center sm:text-left">
 				{isAuthenticated ? `Welcome, ${session.username} !!` : ""}
 			</h1>
-			{isAuthenticated ? (
+			{!isAuthenticated ? (
-				<div>
-					<button type="button" className="btn bg-surface-500">
-						<a href="/auth/logout">Logout</a>
-					</button>
-				</div>
-			) : (
 				<div className="flex gap-4">
 					<button type="button" className="btn bg-surface-500">
 						<a href="/auth/login?screen_hint=signup">Sign up</a>
@@ -30,7 +24,7 @@ function Mobile() {
 						<a href="/auth/login?screen_hint=login">Log in</a>
 					</button>
 				</div>
-			)}
+			) : null}
 		</main>
 	);
 }

src/app/(app)/profile/page.tsx

@@ -44,7 +44,7 @@ function Mobile() {
 	}
 
 	return (
-		<div className="px-6 py-10 max-w-full lg:max-w-1/2 mx-auto font-sans text-neutral-100">
+		<div className="px-6 py-10 my-10 max-w-full lg:max-w-1/2 mx-auto font-sans text-neutral-100">
 			<div className="bg-[color:var(--color-surface-600)]/70 backdrop-blur-md rounded-xl px-6 py-5 my-6 shadow-sm">
 				<h1 className="text-2xl sm:text-3xl font-bold tracking-[-.01em] text-center">
 					Hi, {username || ""}!!
@@ -119,6 +119,11 @@ function Mobile() {
 					Don't forget you have a 400mg caffeine limit and 30.5g sugar limit!
 				</p>
 			</div>
+			<div>
+				<button type="button" className="btn bg-surface-800 w-full">
+					<a href="/auth/logout">Logout</a>
+				</button>
+			</div>
 		</div>
 	);
 }