Leilukin/leilukin-site
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bundle CSS of search field to <head>

Browse Source
This commit is contained in:
Leilukin 2025-05-09 16:42:40 +08:00
parent 244663c384
commit 9c17643bf9
2 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/_includes/layouts/base.vto
View File

@ -16,6 +16,11 @@
{{ if hasTooltips }} {{ if hasTooltips }}
<link rel="stylesheet" href="/assets/css/tooltips.css"> <link rel="stylesheet" href="/assets/css/tooltips.css">
{{ /if }} {{ /if }}
{{ if externalCss }}
{{ for file of externalCss }}
<link rel="stylesheet" href="{{ externalCss }}">
{{ /for }}
{{ /if }}
<style>{{ getBundle "css" }}</style> <style>{{ getBundle "css" }}</style>
<!-- Favicon --> <!-- Favicon -->
{{ favicon }} {{ favicon }}

6
src/pages/search.vto
View File

@ -1,11 +1,11 @@
--- ---
title: Search title: Search
externalCss: "/pagefind/pagefind-ui.css"
eleventyComputed: eleventyComputed:
desc: Search {{ sitemeta.siteName }}. desc: Search {{ sitemeta.siteName }}.
--- ---
<p>Looking for something on my website? If you have JavaScript enabled, you can use the search field below, which is powered by the static search library <a href="https://pagefind.app/">Pagefind</a>. Your search query will not be recorded anywhere.</p> <p>Looking for something on my website? If you have JavaScript enabled, you can use the search field below, which is powered by the static search library <a href="https://pagefind.app/">Pagefind</a>. Your search query will not be recorded anywhere.</p>
<link href="/pagefind/pagefind-ui.css" rel="stylesheet">
<script src="/pagefind/pagefind-ui.js"></script> <script src="/pagefind/pagefind-ui.js"></script>
<div id="search"></div> <div id="search"></div>
<script> <script>
@ -19,7 +19,7 @@ eleventyComputed:
<p>Looks like you have JavaScript disabled. This search field requires JavaScript to function.</p> <p>Looks like you have JavaScript disabled. This search field requires JavaScript to function.</p>
</noscript> </noscript>
<style> {{- css }}
:root { :root {
--pagefind-ui-scale: 1; --pagefind-ui-scale: 1;
--pagefind-ui-font: var(--ff-default); --pagefind-ui-font: var(--ff-default);
@ -33,4 +33,4 @@ eleventyComputed:
.pagefind-ui__search-input.svelte-e9gkc3::placeholder { .pagefind-ui__search-input.svelte-e9gkc3::placeholder {
opacity:.6; opacity:.6;
} }
</style> {{ /css }}