From 7e3e38ee18df215a00fe5ff521eee3dd66c1c066 Mon Sep 17 00:00:00 2001
From: Jonathan Dunn <jonathandunn@Jonathans-MacBook-Air.local>
Date: Mon, 1 Apr 2024 10:14:45 -0400
Subject: [PATCH] made gui look a little nicer

---
 installer/client/gui/index.html               |  6 ++--
 .../client/gui/static/stylesheet/style.css    | 32 ++++++++++++++++---
 2 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/installer/client/gui/index.html b/installer/client/gui/index.html
index b1c1ca2..d84095f 100644
--- a/installer/client/gui/index.html
+++ b/installer/client/gui/index.html
@@ -46,8 +46,10 @@
     </nav>
     <main>
       <div class="container" id="my-form">
-        <select class="form-control" id="patternSelector"></select>
-        <select class="form-control" id="modelSelector"></select>
+        <div class="selector-container">
+          <select class="form-control" id="patternSelector"></select>
+          <select class="form-control" id="modelSelector"></select>
+        </div>
         <textarea
           rows="5"
           class="form-control"
diff --git a/installer/client/gui/static/stylesheet/style.css b/installer/client/gui/static/stylesheet/style.css
index 92dcd00..2d30ce9 100644
--- a/installer/client/gui/static/stylesheet/style.css
+++ b/installer/client/gui/static/stylesheet/style.css
@@ -37,14 +37,27 @@ body {
   border: 1px solid #555; /* Adjusted border color */
   padding: 10px; /* Added padding for better text visibility */
 }
-#patternSelector {
+
+.selector-container {
+  display: flex;
+  gap: 10px;
   margin-bottom: 10px;
-  background-color: #424242; /* Darker shade for textarea */
-  color: #e0e0e0; /* Light text for readability */
-  border: 1px solid #555; /* Adjusted border color */
-  padding: 10px; /* Added padding for better text visibility */
+}
+
+#patternSelector,
+#modelSelector {
+  flex: 1;
+  background-color: #424242;
+  color: #e0e0e0;
+  border: 1px solid #555;
+  padding: 10px;
   height: 40px;
 }
+.light-theme #modelSelector {
+  background-color: #fff;
+  color: #333;
+  border: 1px solid #ddd;
+}
 
 @media (min-width: 768px) {
   .container {
@@ -78,6 +91,7 @@ body {
 .hidden {
   display: none;
 }
+
 .drag-over {
   background-color: #505050; /* Slightly lighter than the regular background for visibility */
   border: 2px dashed #007bff; /* Dashed border with the primary button color for emphasis */
@@ -123,6 +137,7 @@ body.light-theme .navbar-toggler-icon {
     padding: 0.25rem 0.5rem; /* Adjust padding for the toggle button */
   }
 }
+
 #responseContainer {
   position: relative; /* Needed for absolute positioning of the child button */
 }
@@ -158,6 +173,7 @@ body.light-theme .navbar-toggler-icon {
 #copyButton:focus {
   outline: none;
 }
+
 #patternCreatedMessage {
   margin-top: 10px;
   padding: 10px;
@@ -177,8 +193,14 @@ body.light-theme .navbar-toggler-icon {
   color: #333;
   border: 1px solid #ddd;
 }
+
 #patternCreator textarea {
   background-color: #424242;
   color: #e0e0e0;
   border: 1px solid #555;
 }
+#patternCreator input {
+  background-color: #424242;
+  color: #e0e0e0;
+  border: 1px solid #555;
+}