From d8ca000da11d4dd13149eebbb65a8a1bbf8e3481 Mon Sep 17 00:00:00 2001
From: arkon <arkon.85@hotmail.com>
Date: Mon, 19 Jan 2026 15:07:52 +0100
Subject: [PATCH] refactor(ui): move save/cancel buttons inline with session
 name

Shortens the session options modal by putting the name input
and action buttons on the same row at the top.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 src/web/public/index.html | 11 ++++-------
 src/web/public/styles.css |  7 ++++++-
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/web/public/index.html b/src/web/public/index.html
index af87c2ec..e04f9563 100644
--- a/src/web/public/index.html
+++ b/src/web/public/index.html
@@ -189,9 +189,10 @@
           <button class="modal-close" onclick="app.closeSessionOptions()">&times;</button>
         </div>
         <div class="modal-body">
-          <div class="form-row">
-            <label>Session Name</label>
-            <input type="text" id="sessionNameInput" placeholder="Enter session name...">
+          <div class="form-row-inline">
+            <input type="text" id="sessionNameInput" placeholder="Session name...">
+            <button class="btn-toolbar" onclick="app.closeSessionOptions()">Cancel</button>
+            <button class="btn-toolbar btn-primary" onclick="app.saveSessionOptions()">Save</button>
           </div>
 
           <!-- Respawn Settings Section -->
@@ -286,10 +287,6 @@
             </div>
           </div>
         </div>
-        <div class="form-actions">
-          <button class="btn-toolbar" onclick="app.closeSessionOptions()">Cancel</button>
-          <button class="btn-toolbar btn-primary" onclick="app.saveSessionOptions()">Save Name</button>
-        </div>
       </div>
     </div>
 
diff --git a/src/web/public/styles.css b/src/web/public/styles.css
index c57de317..cd7be31d 100644
--- a/src/web/public/styles.css
+++ b/src/web/public/styles.css
@@ -1026,8 +1026,13 @@ body {
 
 .form-row-inline {
   display: flex;
-  gap: 1rem;
+  gap: 0.5rem;
   margin-bottom: 0.75rem;
+  align-items: center;
+}
+
+.form-row-inline input[type="text"] {
+  flex: 1;
 }
 
 .form-col {