From 3f438af3d88696d4f76d9b048e07aac6c42a8dc5 Mon Sep 17 00:00:00 2001
From: Josh Creek <8179928+jcreek@users.noreply.github.com>
Date: Wed, 12 Jul 2023 20:27:12 +0000
Subject: [PATCH] feat(*): Improve modal functionality

---
 src/components/Modal.svelte | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/src/components/Modal.svelte b/src/components/Modal.svelte
index 3cd4a87..279a580 100644
--- a/src/components/Modal.svelte
+++ b/src/components/Modal.svelte
@@ -19,12 +19,30 @@
 <div class="modal-overlay">
 	<div class="modal">
 		<h2>Enter Your Name</h2>
-		<input type="text" placeholder="Your Name" bind:value={userName} on:input={handleNameChange} />
+		<p>Try clicking on someone's card...</p>
+		<input
+			type="text"
+			placeholder="Your name"
+			bind:value={userName}
+			on:input={handleNameChange}
+			on:keydown={(event) => {
+				if (event.key === 'Enter') {
+					event.preventDefault();
+					handleSubmit();
+				}
+			}}
+		/>
 		<button on:click={handleSubmit}>Save</button>
 	</div>
 </div>
 
 <style>
+	p {
+		font-size: 12px;
+		font-style: italic;
+		color: gray;
+	}
+
 	/* Styles for the modal overlay */
 	.modal-overlay {
 		position: fixed;