Allow searching by path, and display paths in results.

Author: paveloom

config.toml

@@ -28,6 +28,6 @@ anchors = "off"
 include_title = true
 include_description = true
 include_date = false
-include_path = false
+include_path = true
 include_content = true
 index_format = "fuse_json"

sass/_search.scss

@@ -46,6 +46,10 @@
   margin: 0;
 }
 
+#search-container:focus-within {
+  width: 100%;
+}
+
 #search-container:focus-within > #search-input {
   outline: 1px solid;
   border-color: var(--color-text);

static/search.js

@@ -23,7 +23,7 @@ class Search {
     const a = document.createElement("a");
     a.setAttribute("class", "search-results-item");
     a.setAttribute("href", result.item.url);
-    a.textContent = result.item.title;
+    a.textContent = result.item.path;
 
     // Update the focus on result items only via keyboard or when a cursor is
     // moved. This allows us to use a keyboard for searching even when a cursor
@@ -151,7 +151,7 @@ class Search {
     }
 
     this.fuse = new Fuse(allData, {
-      keys: ["title", "description", "body"],
+      keys: ["title", "description", "body", "path"],
       ignoreLocation: true,
       useExtendedSearch: true,
     });