From 9455d0de078c693f0ea3c999fcedf2657b81eca2 Mon Sep 17 00:00:00 2001
From: Greg Newman <greg@gregnewman.org>
Date: Fri, 10 Feb 2023 09:10:58 -0500
Subject: [PATCH] :bug: fixes click away

Sometimes you just need sleep!
---
 static/css/styles.css                         | 29 +++----------------
 .../includes/search_command_palatte.html      |  4 +--
 2 files changed, 6 insertions(+), 27 deletions(-)

diff --git a/static/css/styles.css b/static/css/styles.css
index 59aa44c3..2969f420 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -945,10 +945,6 @@ input[type=file] {
   z-index: 50;
 }
 
-.z-20 {
-  z-index: 20;
-}
-
 .order-1 {
   order: 1;
 }
@@ -1237,10 +1233,6 @@ input[type=file] {
   height: 3rem;
 }
 
-.max-h-80 {
-  max-height: 20rem;
-}
-
 .max-h-96 {
   max-height: 24rem;
 }
@@ -1365,11 +1357,6 @@ input[type=file] {
           user-select: none;
 }
 
-.scroll-py-2 {
-  scroll-padding-top: 0.5rem;
-  scroll-padding-bottom: 0.5rem;
-}
-
 .list-disc {
   list-style-type: disc;
 }
@@ -1947,10 +1934,6 @@ input[type=file] {
   font-family: 'Cairo', sans-serif;
 }
 
-.font-sans {
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-}
-
 .text-5xl {
   font-size: 3rem;
   line-height: 1;
@@ -2012,10 +1995,6 @@ input[type=file] {
   font-weight: 300;
 }
 
-.font-semibold {
-  font-weight: 600;
-}
-
 .uppercase {
   text-transform: uppercase;
 }
@@ -2166,9 +2145,9 @@ input[type=file] {
   background-color: rgb(255 159 0 / var(--tw-bg-opacity));
 }
 
-.hover\:text-gray-900:hover {
+.hover\:text-orange:hover {
   --tw-text-opacity: 1;
-  color: rgb(17 24 39 / var(--tw-text-opacity));
+  color: rgb(255 159 0 / var(--tw-text-opacity));
 }
 
 .hover\:text-white:hover {
@@ -2176,9 +2155,9 @@ input[type=file] {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
-.hover\:text-orange:hover {
+.hover\:text-gray-900:hover {
   --tw-text-opacity: 1;
-  color: rgb(255 159 0 / var(--tw-text-opacity));
+  color: rgb(17 24 39 / var(--tw-text-opacity));
 }
 
 .focus\:text-charcoal:focus {
diff --git a/templates/libraries/includes/search_command_palatte.html b/templates/libraries/includes/search_command_palatte.html
index 3b64f56c..7c61a91e 100644
--- a/templates/libraries/includes/search_command_palatte.html
+++ b/templates/libraries/includes/search_command_palatte.html
@@ -8,8 +8,8 @@
 >
   <div class="fixed inset-0 bg-black bg-opacity-70 transition-opacity"></div>
 
-  <div class="fixed inset-0 z-10 overflow-y-auto p-4 sm:p-6 md:p-20">
-    <div class="mx-auto max-w-2xl transform divide-y divide-gray-500 divide-opacity-20 overflow-hidden rounded-xl bg-charcoal shadow-2xl transition-all">
+  <div class="fixed inset-0 overflow-y-auto p-4 sm:p-6 md:p-20">
+    <div class="mx-auto max-w-2xl transform divide-y divide-gray-500 divide-opacity-20 overflow-hidden rounded-xl bg-charcoal shadow-2xl transition-all" x-on:click.away="showSearch = false">
       <div class="relative">
         <!-- Heroicon name: outline/magnifying-glass -->
         <svg class="pointer-events-none absolute top-3.5 left-4 h-5 w-5 text-gray-500" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">