From d23af6d10cd5b4832904008cf438d43714c1b0c2 Mon Sep 17 00:00:00 2001
From: Carl Johnson <me@carlmjohnson.net>
Date: Thu, 5 Oct 2023 09:31:07 -0400
Subject: [PATCH] search.html: make outline blue, make everyone the default

---
 assets/js/utils/search-people.js |  2 +-
 layouts/partials/search.html     | 28 +++++++++++++++++++++-------
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/assets/js/utils/search-people.js b/assets/js/utils/search-people.js
index adc5966..534a346 100644
--- a/assets/js/utils/search-people.js
+++ b/assets/js/utils/search-people.js
@@ -28,7 +28,7 @@ async function debouncedSearch(
 
 export default function searchPeople() {
   return {
-    filterType: "expert",
+    filterType: "",
     filterExpertise: [],
     filterLocation: [],
     filterArea: [],
diff --git a/layouts/partials/search.html b/layouts/partials/search.html
index 7377dd7..21e9cae 100644
--- a/layouts/partials/search.html
+++ b/layouts/partials/search.html
@@ -12,7 +12,7 @@ <h2 class="text-g-9">
     <input
       id="search"
       type="search"
-      class="block w-full appearance-none rounded-full border-2 border-g-5 bg-white px-10 py-2 tracking-wider text-g-8 placeholder-g-5 placeholder-opacity-100"
+      class="block w-full appearance-none rounded-full border-2 border-g-5 bg-white px-10 py-2 tracking-wider text-g-8 placeholder-g-5 placeholder-opacity-100 outline-none ring-blue focus:ring-2"
       x-model="query"
       @keydown.escape="clear()"
       placeholder="Ex. “Jane Smith” “History” “Boulder”"
@@ -54,6 +54,7 @@ <h2 class="text-g-9">
     <div
       class="grid items-end gap-4 md:grid-cols-2"
       x-show="filterType === 'expert'"
+      x-cloak
     >
       {{ partial "combobox.html" (dict
         "options" (.GetPage "expertise").Pages
@@ -90,21 +91,34 @@ <h2 class="text-g-9">
   <div class="mt-2 flex flex-wrap gap-4">
     <label>
       <input
+        class="accent-blue"
         x-model="filterType"
         type="radio"
         name="type"
-        value="expert"
+        value=""
         checked
       />
-      <span class="ml-1">Community Members</span>
+      <span class="ml-1">Everyone</span>
     </label>
     <label>
-      <input x-model="filterType" type="radio" name="type" value="journalist" />
-      <span class="ml-1">Journalists</span>
+      <input
+        class="accent-blue"
+        x-model="filterType"
+        type="radio"
+        name="type"
+        value="expert"
+      />
+      <span class="ml-1">Community Members</span>
     </label>
     <label>
-      <input x-model="filterType" type="radio" name="type" value="" />
-      <span class="ml-1">Everyone</span>
+      <input
+        class="accent-blue"
+        x-model="filterType"
+        type="radio"
+        name="type"
+        value="journalist"
+      />
+      <span class="ml-1">Journalists</span>
     </label>
   </div>
   <p class="mt-1 text-g-7" x-text="resultsText"></p>