Fix Pagefind not loading
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

This commit is contained in:
Kaan Barmore-Genç 2024-05-17 23:02:18 -05:00
parent efebfa3889
commit 7d93c9d88b
Signed by: kaan
GPG key ID: B2E280771CD62FCF
2 changed files with 18 additions and 3 deletions

View file

@ -8,7 +8,5 @@
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
<link href="/pagefind/pagefind-ui.css" rel="stylesheet" />
<script src="/pagefind/pagefind-ui.js"></script>
</body>
</html>

View file

@ -9,9 +9,21 @@
import List from 'phosphor-svelte/lib/List';
import { afterNavigate } from '$app/navigation';
onMount(() => {
function loadPagefind() {
// @ts-ignore
new PagefindUI({ element: '#search', showSubResults: true });
}
onMount(() => {
try {
console.debug('Pagefind loaded, not waiting');
loadPagefind();
console.debug('Pagefind not loaded, waiting for DOMContentLoaded');
} catch (e) {
window.addEventListener('DOMContentLoaded', () => {
loadPagefind();
});
}
});
let expanded = false;
@ -21,6 +33,11 @@
});
</script>
<svelte:head>
<link href="/pagefind/pagefind-ui.css" rel="stylesheet" />
<script async src="/pagefind/pagefind-ui.js"></script>
</svelte:head>
<header>
<a class="logo" href="/">
<picture>