rizaldy/rizaldy.club
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: add polyfill for broken tabindex on mac

Browse Source
This commit is contained in:
Jacky Zhao 2024-01-22 10:55:15 -08:00
parent 4edd27d3f9
commit 7ca491bc1d
1 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
quartz/components/scripts/search.inline.ts
View File

@ -134,7 +134,14 @@ document.addEventListener("nav", async (e: unknown) => {
const anchor = document.getElementsByClassName("result-card")[0] as HTMLInputElement | null const anchor = document.getElementsByClassName("result-card")[0] as HTMLInputElement | null
anchor?.click() anchor?.click()
} }
} else if (e.key === "ArrowDown") { } else if (e.key === "ArrowUp" || (e.shiftKey && e.key === "Tab")) {
e.preventDefault()
if (results?.contains(document.activeElement)) {
// If an element in results-container already has focus, focus previous one
const prevResult = document.activeElement?.previousElementSibling as HTMLInputElement | null
prevResult?.focus()
}
} else if (e.key === "ArrowDown" || e.key === "Tab") {
e.preventDefault() e.preventDefault()
// When first pressing ArrowDown, results wont contain the active element, so focus first element // When first pressing ArrowDown, results wont contain the active element, so focus first element
if (!results?.contains(document.activeElement)) { if (!results?.contains(document.activeElement)) {
@ -145,13 +152,6 @@ document.addEventListener("nav", async (e: unknown) => {
const nextResult = document.activeElement?.nextElementSibling as HTMLInputElement | null const nextResult = document.activeElement?.nextElementSibling as HTMLInputElement | null
nextResult?.focus() nextResult?.focus()
} }
} else if (e.key === "ArrowUp") {
e.preventDefault()
if (results?.contains(document.activeElement)) {
// If an element in results-container already has focus, focus previous one
const prevResult = document.activeElement?.previousElementSibling as HTMLInputElement | null
prevResult?.focus()
}
} }
} }