graham/ghall.space
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add search page

Browse Source
This commit is contained in:
Graham Hall
2025-11-20 23:03:43 -05:00
parent 84113e55d9
commit 03a15f0347
9 changed files with 78 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.astro/content-assets.mjs
+2 -2
View File
@@ -1,10 +1,10 @@
import __ASTRO_IMAGE_IMPORT_3KcDr from "src/assets/blog/my-ai-portrait.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fcreating-a-dating-profile-with-ai.md";
import __ASTRO_IMAGE_IMPORT_1G57ng from "src/assets/blog/ileopard/mac-os-10-1.png?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md";
import __ASTRO_IMAGE_IMPORT_Z1ESWoO from "src/assets/blog/ileopard/itunes-7.gif?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md";
import __ASTRO_IMAGE_IMPORT_rrnp from "src/assets/blog/ileopard/ileopard-2-0-1.png?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md";
import __ASTRO_IMAGE_IMPORT_3KcDr from "src/assets/blog/my-ai-portrait.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fcreating-a-dating-profile-with-ai.md";
import __ASTRO_IMAGE_IMPORT_Zi2DqH from "src/assets/blog/gunpla/box.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md";
import __ASTRO_IMAGE_IMPORT_1OkzEl from "src/assets/blog/gunpla/all-the-parts.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md";
import __ASTRO_IMAGE_IMPORT_FYQiW from "src/assets/blog/gunpla/final.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md";
export default new Map([["src/assets/blog/ileopard/mac-os-10-1.png?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md", __ASTRO_IMAGE_IMPORT_1G57ng], ["src/assets/blog/ileopard/itunes-7.gif?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md", __ASTRO_IMAGE_IMPORT_Z1ESWoO], ["src/assets/blog/ileopard/ileopard-2-0-1.png?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md", __ASTRO_IMAGE_IMPORT_rrnp], ["src/assets/blog/my-ai-portrait.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fcreating-a-dating-profile-with-ai.md", __ASTRO_IMAGE_IMPORT_3KcDr], ["src/assets/blog/gunpla/box.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md", __ASTRO_IMAGE_IMPORT_Zi2DqH], ["src/assets/blog/gunpla/all-the-parts.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md", __ASTRO_IMAGE_IMPORT_1OkzEl], ["src/assets/blog/gunpla/final.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md", __ASTRO_IMAGE_IMPORT_FYQiW]]);
export default new Map([["src/assets/blog/my-ai-portrait.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fcreating-a-dating-profile-with-ai.md", __ASTRO_IMAGE_IMPORT_3KcDr], ["src/assets/blog/ileopard/mac-os-10-1.png?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md", __ASTRO_IMAGE_IMPORT_1G57ng], ["src/assets/blog/ileopard/itunes-7.gif?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md", __ASTRO_IMAGE_IMPORT_Z1ESWoO], ["src/assets/blog/ileopard/ileopard-2-0-1.png?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2022%2Fileopard-a-retrospective.md", __ASTRO_IMAGE_IMPORT_rrnp], ["src/assets/blog/gunpla/box.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md", __ASTRO_IMAGE_IMPORT_Zi2DqH], ["src/assets/blog/gunpla/all-the-parts.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md", __ASTRO_IMAGE_IMPORT_1OkzEl], ["src/assets/blog/gunpla/final.jpg?astroContentImageFlag=&importer=src%2Fcontent%2Fblog%2F2023%2Fmy-gunpla-adventure.md", __ASTRO_IMAGE_IMPORT_FYQiW]]);
.astro/data-store.json
+1 -1
View File
File diff suppressed because one or more lines are too long
astro.config.mjs
+6 -1
View File
@@ -3,6 +3,7 @@ import alpinejs from "@astrojs/alpinejs";
// https://astro.build/config
import mdx from "@astrojs/mdx";
import { defineConfig } from "astro/config";
import pagefind from "astro-pagefind";
// https://astro.build/config
export default defineConfig({
@@ -16,7 +17,11 @@ export default defineConfig({
},
},
},
integrations: [mdx(), alpinejs({ entrypoint: "/src/entrypoint" })],
integrations: [
mdx(),
alpinejs({ entrypoint: "/src/entrypoint" }),
pagefind(),
],
redirects: {
"/posts/[...slug]": "/blog/[...slug]",
"/blog": "/blog/page/1",
src/assets/svg/magnifying-glass.svg
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor"><!--!Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 617 B

src/components/Header/Header.astro
+2
View File
@@ -8,6 +8,7 @@ import Nav from "./Nav.astro";
<a href="/">ghall.space</a>
<div>
<Nav />
<Drawer />
</div>
</div>
@@ -39,6 +40,7 @@ import Nav from "./Nav.astro";
.container > div {
display: flex;
gap: 20px;
align-items: center;
}
a {
src/components/Header/Nav.astro
+2 -10
View File
@@ -1,9 +1,5 @@
---
import { navLinks } from "../../data/nav-links";
const { pathname } = Astro.url;
const pathComponents = pathname.split("/").slice(1);
---
<nav>
@@ -11,12 +7,7 @@ const pathComponents = pathname.split("/").slice(1);
{
navLinks.map((link) => (
<li>
<a
href={`/${link.path}`}
class={pathComponents[0] === link.path ? "selected" : null}
>
{link.label}
</a>
<a href={`/${link.path}`}>{link.label}</a>
</li>
))
}
@@ -31,6 +22,7 @@ const pathComponents = pathname.split("/").slice(1);
gap: 10px;
font-size: 1.15rem;
font-weight: 600;
align-items: center;
}
a {
src/data/nav-links.ts
+1
View File
@@ -7,4 +7,5 @@ export const navLinks: NavLink[] = [
{ label: "Blog", path: "blog/page/1" },
{ label: "Now", path: "now" },
{ label: "Projects", path: "projects" },
{ label: "Search", path: "search" },
];
src/global.css
+3
View File
@@ -22,6 +22,7 @@
--red: #d20f39;
--orange: #fe640b;
--text: #4c4f69;
--highlight: #ffeebd;
--background: #fffdf5;
--radius: 5px;
--border: 1px solid #ced3f1;
@@ -127,6 +128,8 @@ kbd {
border: none;
line-height: 1;
aspect-ratio: square;
height: 24px;
width: 24px;
}
.icon-button:active {
src/pages/search.astro
+60
View File
@@ -0,0 +1,60 @@
---
import Layout from "@layouts/Layout.astro";
import SearchField from "astro-pagefind/components/Search";
---
<Layout title="Search">
<div class="search-container">
<h2>Looking for something?</h2>
<SearchField
id="search"
className="pagefind-ui"
uiOptions={{ showImages: false }}
/>
</div>
</Layout>
<style is:global>
.search-container {
min-height: 60vh;
}
.pagefind-ui {
font-family: "Noto Serif", serif !important;
color: var(--text) !important;
}
.pagefind-ui__search-input,
.pagefind-ui__button {
color: var(--text) !important;
border: var(--border) !important;
background-color: var(--background) !important;
}
.pagefind-ui__button:hover {
opacity: 0.75;
}
.pagefind-ui__search-clear {
color: var(--red) !important;
background-color: var(--background) !important;
}
.pagefind-ui__result-excerpt > mark {
background-color: var(--highlight);
}
.pagefind-ui__result-link {
color: var(--blue) !important;
text-decoration: none !important;
}
.pagefind-ui__result-link:hover {
opacity: 0.75;
}
.pagefind-ui__result {
border: none !important;
border-bottom: var(--border) !important;
}
</style>