Aaron Pham
2024-01-22 0403fa70aa24cd3c16fbd9caf434cdcd277f1a14
fix(search): use anchor element (closes #698) (#717)

* fix(search): use anchor element

This addresses #698 to allow search title to include links for SPA

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

* fix: formatter

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

* chore: move itemTile to `a`

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

* chore: remove nested a title

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

* chore(search): remove spaNavigate

since now searchResult is an `a` item

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

---------

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>
1 files modified
16 ■■■■ changed files
quartz/components/scripts/search.inline.ts 16 ●●●● patch | view | raw | blame | history
quartz/components/scripts/search.inline.ts
@@ -222,16 +222,16 @@
  const resultToHTML = ({ slug, title, content, tags }: Item) => {
    const htmlTags = tags.length > 0 ? `<ul>${tags.join("")}</ul>` : ``
    const button = document.createElement("button")
    button.classList.add("result-card")
    button.id = slug
    button.innerHTML = `<h3>${title}</h3>${htmlTags}<p>${content}</p>`
    button.addEventListener("click", () => {
      const targ = resolveRelative(currentSlug, slug)
      window.spaNavigate(new URL(targ, window.location.toString()))
    const itemTile = document.createElement("a")
    itemTile.classList.add("result-card")
    itemTile.id = slug
    itemTile.href = new URL(resolveRelative(currentSlug, slug), location.toString()).toString()
    itemTile.innerHTML = `<h3>${title}</h3>${htmlTags}<p>${content}</p>`
    itemTile.addEventListener("click", (event) => {
      if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return
      hideSearch()
    })
    return button
    return itemTile
  }
  function displayResults(finalResults: Item[]) {