From ef28973b0683823d2f3e1cee128055b18530d522 Mon Sep 17 00:00:00 2001
From: Sam Nystrom <sam@samnystrom.dev>
Date: Tue, 12 Mar 2024 18:58:36 +0000
Subject: Style login and signup pages

---
 src/pages/LogIn.tsx  | 17 ++++++++++++-----
 src/pages/SignUp.tsx | 27 +++++++++++++++------------
 2 files changed, 27 insertions(+), 17 deletions(-)

(limited to 'src/pages')

diff --git a/src/pages/LogIn.tsx b/src/pages/LogIn.tsx
index c787dce..55b2109 100644
--- a/src/pages/LogIn.tsx
+++ b/src/pages/LogIn.tsx
@@ -18,16 +18,23 @@ export const LogIn = () => {
 	};
 
 	return (
+		<main>
 		<form onSubmit={onSubmit}>
+			<h1>Log In</h1>
+			<p>
+				Don't have an account? <a href="/signup">Sign up</a>
+			</p>
+			<hr />
 			<label>
-				Email:
-				<input type="text" value={email} onInput={e => email.value = e.target.value} />
+				Email
+				<input type="text" placeholder="Email" value={email} onInput={e => email.value = e.target.value} />
 			</label>
 			<label>
-				Password:
-				<input type="password" value={password} onInput={e => password.value = e.target.value} />
+				Password
+				<input type="password" placeholder="Password" value={password} onInput={e => password.value = e.target.value} />
 			</label>
-			<button>Log In</button>
+			<input type="submit" value="Continue" />
 		</form>
+		</main>
 	);
 };
\ No newline at end of file
diff --git a/src/pages/SignUp.tsx b/src/pages/SignUp.tsx
index 99cc7d6..b707b7d 100644
--- a/src/pages/SignUp.tsx
+++ b/src/pages/SignUp.tsx
@@ -26,28 +26,31 @@ export const SignUp = () => {
 	};
 
 	return (
-		<main class="container">
-			<article>
+		<main>
 				<form onSubmit={onSubmit}>
+					<h1>Sign Up</h1>
+					<p>
+						Already have an account? <a href="/login">Log in</a>
+					</p>
+					<hr />
 					<label>
-						Username:
-						<input type="text" value={username} onInput={e => username.value = e.target.value} />
+						Username
+						<input type="text" placeholder="Username" value={username} onInput={e => username.value = e.target.value} />
 					</label>
 					<label>
-						Email:
-						<input type="text" value={email} onInput={e => email.value = e.target.value} />
+						Email
+						<input type="text" placeholder="Email" value={email} onInput={e => email.value = e.target.value} />
 					</label>
 					<label>
-						Password:
-						<input type="password" value={password} onInput={e => password.value = e.target.value} />
+						Password
+						<input type="password" placeholder="Password" value={password} onInput={e => password.value = e.target.value} />
 					</label>
 					<label>
-						Confirm Password:
-						<input type="password" value={confirm} onInput={e => confirm.value = e.target.value} />
+						Confirm password
+						<input type="password" placeholder="Confirm password" value={confirm} onInput={e => confirm.value = e.target.value} />
 					</label>
-					<button>Sign Up</button>
+					<input type="submit" value="Continue" />
 				</form>
-			</article>
 		</main>
 	);
 };
\ No newline at end of file
-- 
cgit v1.2.3