From 4703b77dd4873b23eaaa1a51733692c12fee832b Mon Sep 17 00:00:00 2001
From: Sebastiaan de Schaetzen <sebastiaan.de.schaetzen@gmail.com>
Date: Thu, 14 Nov 2024 08:52:05 +0100
Subject: [PATCH] Make text input more flexible

---
 static/style.css       | 4 +++-
 templates/index.gohtml | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/static/style.css b/static/style.css
index c2f2d8e..ceabcb9 100644
--- a/static/style.css
+++ b/static/style.css
@@ -20,8 +20,10 @@ body {
 
 .message-box {
 	margin: 64px 0 64px;
+	display: flex;
+	gap: 8px;
 }
 
 .message-input {
-	width: 100%;
+	flex-grow: 1;
 }
diff --git a/templates/index.gohtml b/templates/index.gohtml
index 95b5aea..a2af7a8 100644
--- a/templates/index.gohtml
+++ b/templates/index.gohtml
@@ -25,7 +25,7 @@
     </div>
 
     <form class="message-box" id="message-box" ws-send hx-on::ws-before-send="this.reset();">
-        <input id="message-input" name="message" type="text" placeholder="Type a message">
+        <input class="message-input" name="message" type="text" placeholder="Type a message">
         <input type="submit" value="Send">
     </form>
 </div>