From cd4924b4e3895691d99d52ce0d252dd2a6f4f246 Mon Sep 17 00:00:00 2001
From: BBaoVanC <bbaovanc@bbaovanc.com>
Date: Sat, 4 Jul 2026 01:39:03 -0500
Subject: [PATCH] WIP

Things to figure out:

- Why is isso breaking when I add the modal (TODO: try individual
  components and see if that still breaks Isso; just to investigate)
- Can we use the modal trigger but have that just go to a custom page,
  or should it just build the search menu at the top of the current page
  (not an overlay like the all-in-one searchbox you can add; I mean
  actually it just goes to the top of the body and puts the search menu
  and filtering stuff there)
- Dark mode
---
 layouts/_partials/head.html | 17 +++++------------
 layouts/_partials/top.html  |  3 +++
 layouts/search.html         |  3 ---
 3 files changed, 8 insertions(+), 15 deletions(-)
 delete mode 100644 layouts/search.html

diff --git a/layouts/_partials/head.html b/layouts/_partials/head.html
index 747c8f2..f3fa891 100644
--- a/layouts/_partials/head.html
+++ b/layouts/_partials/head.html
@@ -68,20 +68,13 @@
             >
     </script>
 
-    {{ if eq .Layout "search" }}
-        {{ with resources.Get "css/search.css" | fingerprint "sha512" }}
-            <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
-        {{ end }}
-
-        <link rel="stylesheet" type="text/css" href="{{ absURL "pagefind/pagefind-ui.css" }}" crossorigin="anonymous">
-        <script src="{{ absURL "pagefind/pagefind-ui.js" }}" crossorigin="anonymous"></script>
-        <script>
-            window.addEventListener('DOMContentLoaded', (event) => {
-                new PagefindUI({ element: "#search-box", showSubResults: true });
-            });
-        </script>
+    {{ with resources.Get "css/search.css" | fingerprint "sha512" }}
+        <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
     {{ end }}
 
+    <link rel="stylesheet" type="text/css" href="{{ absURL "pagefind/pagefind-component-ui.css" }}" crossorigin="anonymous">
+    <script src="{{ absURL "pagefind/pagefind-component-ui.js" }}" type="module" crossorigin="anonymous"></script>
+
     {{ with .Site.Params.faviconSVG }}
         <link rel="icon" href="{{ . | absURL }}" />
     {{ end }}
diff --git a/layouts/_partials/top.html b/layouts/_partials/top.html
index a32aa22..fa7e53c 100644
--- a/layouts/_partials/top.html
+++ b/layouts/_partials/top.html
@@ -5,6 +5,9 @@
         </a>
     </div>
 
+    <pagefind-modal-trigger></pagefind-modal-trigger>
+    <pagefind-modal></pagefind-modal>
+
     <nav class="top-navbar" aria-label="{{ i18n "aria_navbar" }}">
         {{ with .Site.Home }}
             <a class="top-navbar-item{{ if $.IsHome }} top-navbar-item--active{{ end }}" href="{{ .Permalink | absLangURL }}">{{ .Title | markdownify }}</a>
diff --git a/layouts/search.html b/layouts/search.html
deleted file mode 100644
index 3c798ed..0000000
--- a/layouts/search.html
+++ /dev/null
@@ -1,3 +0,0 @@
-{{ define "main" }}
-    <div id="search-box"></div>
-{{ end }}