From 41c67f15c0cbe82f0a3468da0172fc6f6fef0bf2 Mon Sep 17 00:00:00 2001
From: Fen Dweller <chemicalcrux@gmail.com>
Date: Mon, 16 May 2022 12:53:06 -0500
Subject: [PATCH] Move search into the filter menu; space buttons out

---
 macrovision.css  | 27 +++++++++++----------------
 macrovision.html | 10 ++++------
 2 files changed, 15 insertions(+), 22 deletions(-)

diff --git a/macrovision.css b/macrovision.css
index f0ead086..875d9642 100644
--- a/macrovision.css
+++ b/macrovision.css
@@ -304,13 +304,16 @@ body.show-extra-options .options-block.options-block-optional {
 }
 
 .menubar-group {
-    display: flex;
-    flex-direction: row;
+    display: grid;
+    grid-template-rows: 1fr;
+    grid-auto-flow: column;
+    gap: 5px;
+    padding: 5px 0px;
 }
 
 .menubar-group button {
-    width: 48pt;
-    height: 48pt;
+    width: 64pt;
+    height: 64pt;
 }
 
 .menubar-group input {
@@ -814,8 +817,9 @@ button {
 
 .popout-menu {
     display: none;
-    flex-direction: column;
-    flex-wrap: nowrap;
+    grid-template-columns: 1fr;
+    gap: 5px;
+    overflow-x: none;
     overflow-y: scroll;
     max-height: 80vh;
     justify-content: start;
@@ -864,7 +868,7 @@ button {
 
 
 .popout-menu.visible {
-    display: flex;
+    display: grid;
 }
 
 .menu-button {
@@ -964,9 +968,6 @@ button {
     align-items: center;
     justify-content: space-between;
     padding: 10px 20px 10px 10px;
-    border-color: #222;
-    border-width: 5px;
-    border-style: solid;
     max-width: 400pt;
 }
 
@@ -1064,9 +1065,6 @@ body.screenshot-mode .scroll-button {
     justify-content: left space-between;
     padding: 10px 20px 10px 10px;
     background: gray;
-    border-color: darkslategray;
-    border-width: 5px;
-    border-style: solid;
 }
 
 .filter-holder.enabled {
@@ -1086,9 +1084,6 @@ body.screenshot-mode .scroll-button {
     justify-content: left;
     padding: 10px 20px 10px 10px;
     background: gray;
-    border-color: darkslategray;
-    border-width: 5px;
-    border-style: solid;
     text-decoration: none;
     user-select: none;
     -webkit-user-select: none;
diff --git a/macrovision.html b/macrovision.html
index d31d97ed..fdda1a02 100644
--- a/macrovision.html
+++ b/macrovision.html
@@ -59,7 +59,9 @@
     
   </div>
   <div class="popout-menu" id="filters-menu">
-    
+    <span class="menubar-group" id="search">
+      <input id="search-box" type="text" placeholder="Search by name">
+    </span>
   </div>
   <div class="popout-menu" id="info-menu">
     <a class="info-holder" target="_blank" href="https://www.notion.so/Macrovision-5c7f9377424743358ddf6db5671f439e">
@@ -84,17 +86,13 @@
         <i class="fas fa-cogs"></i>
       </button>
       <button id="toggle-filters">
-        <i class="fas fa-filter"></i>
+        <i class="fas fa-search"></i>
       </button>
       <button id="toggle-info">
         <i class="fas fa-info-circle"></i>
       </button>
     </span>
     <span class="menubar-group" id="spawners">
-
-      <span class="menubar-group" id="search">
-        <input id="search-box" type="text" placeholder="Search...">
-      </span>
     </span>
     <span class="menubar-group">
       <button id="copy-screenshot">