From 24ccba74d43b17c9c3d0075f8cd11351969e72e9 Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Fri, 5 Aug 2022 06:17:43 +0300
Subject: [PATCH] Put type dropdown, regenerate button on same row. Regain
 screen space

---
 src/interface/web/index.html | 27 +++++++++++++++++++++------
 1 file changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/interface/web/index.html b/src/interface/web/index.html
index f6043ad0..f1b41af8 100644
--- a/src/interface/web/index.html
+++ b/src/interface/web/index.html
@@ -130,11 +130,13 @@
         <!--Add Text Box To Enter Query, Trigger Incremental Search OnChange -->
         <input type="text" id="query" onkeyup=incremental_search(event) autofocus="autofocus" placeholder="What is the meaning of life?">
 
-        <!--Add Dropdown to Select Query Type -->
-        <select id="type"></select>
+        <div id="options">
+            <!--Add Dropdown to Select Query Type -->
+            <select id="type"></select>
 
-        <!--Add Button To Regenerate -->
-        <button id="regenerate" onclick="regenerate()">Regenerate</button>
+            <!--Add Button To Regenerate -->
+            <button id="regenerate" onclick="regenerate()">Regenerate</button>
+        </div>
 
         <!-- Section to Render Results -->
         <div id="results"></div>
@@ -180,10 +182,24 @@
             font-weight: 200;
             color: #888;
         }
-        button {
+
+        #options {
+            padding: 0;
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+        }
+        #options > * {
+            padding: 15px;
             border-radius: 5px;
             border: 1px solid #ccc;
         }
+        #options > select {
+            margin-right: 5px;
+        }
+        #options > button {
+            margin-left: 5px;
+        }
+
         #query {
             font-size: larger;
         }
@@ -207,7 +223,6 @@
         #json {
             white-space: pre-wrap;
         }
-
         #results-markdown {
             text-align: left;
         }