From ad6e330a74bf9ba1778abef14df444c719a58de5 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Mon, 19 Dec 2022 17:05:04 -0800
Subject: [PATCH] improve form layout handling

---
 config.html  |  4 ++++
 css/form.css |  9 +++++++++
 login.html   | 12 ++++++++++--
 3 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/config.html b/config.html
index ede9c15..e5c3083 100644
--- a/config.html
+++ b/config.html
@@ -13,6 +13,10 @@
 			<form>
 				<fieldset id="user-configurable">
 					<legend>Change Configuration</legend>
+					<div class="labels-inputs">
+						<div id="labels"></div>
+						<div id="inputs"></div>
+					</div>
 					<div class="btn-group" id="form-actions">
 						<button id="cancel">CANCEL</button>
 						<button id="submit">SUBMIT</button>
diff --git a/css/form.css b/css/form.css
index d09f67d..f9bca47 100644
--- a/css/form.css
+++ b/css/form.css
@@ -22,4 +22,13 @@ input {
 
 button {
 	margin-top: 10px;
+}
+
+.labels-inputs {
+	display: flex;
+	column-gap: 10px;
+}
+
+.labels-inputs > div {
+	width: min-content;
 }
\ No newline at end of file
diff --git a/login.html b/login.html
index 1a3712d..3f67256 100644
--- a/login.html
+++ b/login.html
@@ -13,8 +13,16 @@
 			<form>
 				<fieldset>
 					<legend>Proxmox VE Login</legend>
-					<label for="username">Username: </label><input type="text" id="username" name="username"><br>
-					<label for="username">Password: </label><input type="password" id="password" name="password"><br>
+					<div class="labels-inputs">
+						<div>
+							<label for="username">Username:</label>
+							<label for="username">Password:</label>
+						</div>
+						<div>
+							<input type="text" id="username" name="username">
+							<input type="password" id="password" name="password">
+						</div>
+					</div>
 					<div class="btn-group">
 						<button id="submit">LOGIN</button>
 					</div>