feat(search): add additional keybinding for navigating search results

Add support for ctrl-n and ctrl-p to simulate scrolling similar to vim

Signed-off-by: Aaron Pham <contact@aarnphm.xyz>

docs/showcase.md

@@ -27,6 +27,5 @@ Want to see what Quartz can do? Here are some cool community gardens:
 - [Ellie's Notes](https://ellie.wtf)
 - [🥷🏻🌳🍃 Computer Science & Thinkering Garden](https://notes.yxy.ninja)
 - [Eledah's Crystalline](https://blog.eledah.ir/)
-- [🌓 Projects & Privacy - FOSS, tech, law](https://be-far.com)
 
 If you want to see your own on here, submit a [Pull Request adding yourself to this file](https://github.com/jackyzha0/quartz/blob/v4/docs/showcase.md)!

quartz/components/scripts/graph.inline.ts

@@ -550,19 +550,6 @@ document.addEventListener("nav", async (e: CustomEventMap["nav"]) => {
   addToVisited(simplifySlug(slug))
   await renderGraph("graph-container", slug)
 
-  // Function to re-render the graph when the theme changes
-  const handleThemeChange = () => {
-    renderGraph("graph-container", slug)
-  }
-
-  // event listener for theme change
-  document.addEventListener("themechange", handleThemeChange)
-
-  // cleanup for the event listener
-  window.addCleanup(() => {
-    document.removeEventListener("themechange", handleThemeChange)
-  })
-
   const container = document.getElementById("global-graph-outer")
   const sidebar = container?.closest(".sidebar") as HTMLElement
 

quartz/components/scripts/search.inline.ts

@@ -242,7 +242,11 @@ document.addEventListener("nav", async (e: CustomEventMap["nav"]) => {
         await displayPreview(anchor)
         anchor.click()
       }
-    } else if (e.key === "ArrowUp" || (e.shiftKey && e.key === "Tab")) {
+    } else if (
+      e.key === "ArrowUp" ||
+      (e.shiftKey && e.key === "Tab") ||
+      (e.ctrlKey && e.key === "p")
+    ) {
       e.preventDefault()
       if (results?.contains(document.activeElement)) {
         // If an element in results-container already has focus, focus previous one
@@ -255,7 +259,7 @@ document.addEventListener("nav", async (e: CustomEventMap["nav"]) => {
         if (prevResult) currentHover = prevResult
         await displayPreview(prevResult)
       }
-    } else if (e.key === "ArrowDown" || e.key === "Tab") {
+    } else if (e.key === "ArrowDown" || e.key === "Tab" || (e.ctrlKey && e.key === "n")) {
       e.preventDefault()
       // The results should already been focused, so we need to find the next one.
       // The activeElement is the search bar, so we need to find the first result and focus it.