From 61814734585728edfd662bdeebea9be04fa3a203 Mon Sep 17 00:00:00 2001
From: Will Faught <willfaught@users.noreply.github.com>
Date: Sat, 17 Dec 2022 11:05:44 -0800
Subject: [PATCH] Add section, article tags to search layout

---
 layouts/partials/paige-search.html | 83 ++++++++++++++++--------------
 1 file changed, 44 insertions(+), 39 deletions(-)

diff --git a/layouts/partials/paige-search.html b/layouts/partials/paige-search.html
index 7d6ae757..4d25f1b0 100644
--- a/layouts/partials/paige-search.html
+++ b/layouts/partials/paige-search.html
@@ -1,45 +1,48 @@
-<div class="container-fluid">
-    <form action="{{ .Page.RelPermalink }}" dir="auto" method="get">
-        <div class="justify-content-center mb-3 row">
-            <div class="col col-sm-8 col-md-7 col-lg-6 col-xl-5 col-xxl-4">
-                <input class="form-control" id="query" name="q" placeholder="{{ i18n `paige_search_input` }}" type="search">
+<section>
+    <div class="container-fluid">
+        <form action="{{ .Page.RelPermalink }}" dir="auto" method="get">
+            <div class="justify-content-center mb-3 row">
+                <div class="col col-sm-8 col-md-7 col-lg-6 col-xl-5 col-xxl-4">
+                    <input class="form-control" id="query" name="q" placeholder="{{ i18n `paige_search_input` }}" type="search">
+                </div>
             </div>
-        </div>
-        <div class="justify-content-center mb-3 row">
-            <div class="col col-auto">
-                <button class="btn btn-primary" type="submit">{{ i18n `paige_search_button` }}</button>
+            <div class="justify-content-center mb-3 row">
+                <div class="col col-auto">
+                    <button class="btn btn-primary" type="submit">{{ i18n `paige_search_button` }}</button>
+                </div>
+            </div>
+        </form>
+    </div>
+    <div id="paige-error" style="display: none">
+        <p class="text-center">
+            <i class="bi bi-exclamation-triangle display-6 text-danger">
+                <span class="visually-hidden">{{ i18n `paige_search_error` }}</span>
+            </i>
+        </p>
+    </div>
+    <div id="paige-nothing" style="display: none">
+        <p class="text-center">
+            <i class="bi bi-x-circle display-6 text-danger">
+                <span class="visually-hidden">{{ i18n `paige_search_nothing` }}</span>
+            </i>
+        </p>
+    </div>
+    <div id="paige-searching" style="display: none">
+        <div class="mb-3 text-center">
+            <div class="spinner-border text-primary" role="status">
+                <span class="visually-hidden">{{ i18n `paige_search_searching` }}</span>
             </div>
         </div>
-    </form>
-</div>
-<div id="paige-error" style="display: none">
-    <p class="text-center">
-        <i class="bi bi-exclamation-triangle display-6 text-danger">
-            <span class="visually-hidden">{{ i18n `paige_search_error` }}</span>
-        </i>
-    </p>
-</div>
-<div id="paige-nothing" style="display: none">
-    <p class="text-center">
-        <i class="bi bi-x-circle display-6 text-danger">
-            <span class="visually-hidden">{{ i18n `paige_search_nothing` }}</span>
-        </i>
-    </p>
-</div>
-<div id="paige-searching" style="display: none">
-    <div class="mb-3 text-center">
-        <div class="spinner-border text-primary" role="status">
-            <span class="visually-hidden">{{ i18n `paige_search_searching` }}</span>
-        </div>
     </div>
-</div>
-<div id="paige-something" style="display: none">
-    <p class="text-center">
-        <i class="bi bi-check-circle display-6 text-success">
-            <span class="visually-hidden">{{ i18n `paige_search_something` }}</span>
-        </i>
-    </p>
-</div>
+    <div id="paige-something" style="display: none">
+        <p class="text-center">
+            <i class="bi bi-check-circle display-6 text-success">
+                <span class="visually-hidden">{{ i18n `paige_search_something` }}</span>
+            </i>
+        </p>
+    </div>
+</section>
+<article id="paige-results" style="display: none"></article>
 <script crossorigin="anonymous" defer integrity="sha384-1LalyFI+BycKouEClZE5CoFnlLr+Kx8Wslc45o5NATVo+c2mEh02i8HNaaT7XOdQ" referrerpolicy="no-referrer" src="https://cdn.jsdelivr.net/gh/nextapps-de/flexsearch@0.7.31/dist/flexsearch.bundle.js"></script>
 <script>
 var errorElement = document.getElementById("paige-error");
@@ -47,6 +50,7 @@ var nothingElement = document.getElementById("paige-nothing");
 var queryElement = document.getElementById("query");
 var searchingElement = document.getElementById("paige-searching")
 var somethingElement = document.getElementById("paige-something");
+var resultsElement = document.getElementById("paige-results");
 
 if (queryElement !== null) {
     var queryText = decodeURIComponent((location.search.split("q=")[1] || "").split("&")[0]).replace(/\+/g, " ");
@@ -89,6 +93,7 @@ function search(queryText) {
                     if (!shown) {
                         shown = true;
                         show(somethingElement);
+                        show(resultsElement);
                     }
                     done[path] = true;
                     var page = pathPage[path];
@@ -102,7 +107,7 @@ function search(queryText) {
                         result.appendChild(document.createElement("br"));
                         result.innerHTML += page.description;
                     }
-                    somethingElement.appendChild(result);
+                    resultsElement.appendChild(result);
                 });
             });
             if (!shown) {