diff --git a/.gitignore b/.gitignore index 4ca67841..a984e33e 100644 --- a/.gitignore +++ b/.gitignore @@ -3,3 +3,4 @@ /resources/_gen/ .hugo_build.lock __pycache__/ +node_modules/ diff --git a/Makefile b/Makefile index fc6dda12..eddd7b87 100644 --- a/Makefile +++ b/Makefile @@ -1,6 +1,8 @@ OC ?= ../oc # not public/: a running `hugo server` renders there, with its live-reload script BUILD ?= build +# search index generator (https://pagefind.app), fetched by npx on first use +PAGEFIND ?= npx -y pagefind@1 # test server: the web share of barbel-lescar, mounted from the file manager (smb://barbel-lescar/web) DEPLOY_DIR ?= /run/user/$(shell id -u)/gvfs/smb-share:server=barbel-lescar,share=web/oldcomputers DEPLOY_URL ?= https://barbel.synology.me/oldcomputers/ @@ -10,9 +12,10 @@ DEPLOY_URL ?= https://barbel.synology.me/oldcomputers/ content: ## regenerate content/ and static/media/ from the extraction repo python3 $(OC)/scripts/05_hugo.py --target $(CURDIR) -build: ## build the site into $(BUILD)/ +build: ## build the site and its search index into $(BUILD)/ rm -rf $(BUILD) hugo --panicOnWarning --minify -d $(BUILD) + $(PAGEFIND) --site $(BUILD) check: build ## build, then verify every internal link and image python3 tools/check_links.py $(BUILD) diff --git a/README.md b/README.md index 9a89a197..1f88b6f7 100644 --- a/README.md +++ b/README.md @@ -29,10 +29,19 @@ banner, date, author and summary (`summary:` in the front matter, or the text be ``, or the first lines); all posts are listed under News. Posts are never touched by `make content`. +## Search + +Search runs in the visitor's browser on an index generated by [Pagefind](https://pagefind.app/) +at the end of `make build` (fetched by `npx`, so Node.js is needed to build). The header box +sends to `/search/`, where results can be filtered by section. Content pages are indexed +(`data-pagefind-body` on `
` in `layouts/baseof.html`); lists, taxonomy pages and the +visitor-comments tabs are not. `hugo server` has no index: use `make build` and serve `build/` +to try the search locally. + ## Usage make content # regenerate from ../oc (OC=path to use another location) - make build # build into build/ + make build # build into build/, with the search index make check # build + verify every internal link and image make serve # preview on http://localhost:1313 make deploy # build and copy to the test server (share must be mounted; see DEPLOY_DIR/DEPLOY_URL) diff --git a/assets/css/main.css b/assets/css/main.css index 1253aa73..e65dfd45 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -129,3 +129,32 @@ table { border-collapse: collapse; } .post-summary p:last-child { margin-bottom: 0; } .post-banner { display: block; width: 100%; max-height: 420px; object-fit: cover; margin: 0 0 16px; border-radius: 4px; } @media (max-width: 600px) { .post-summary { grid-template-columns: 1fr; } } + +.site-header .search { margin-left: auto; } +.site-header .search input { + width: 180px; + max-width: 100%; + padding: 4px 10px; + border: 1px solid transparent; + border-radius: 14px; + background: rgba(255, 255, 255, 0.12); + color: inherit; + font: inherit; + font-size: 0.9rem; +} +.site-header .search input::placeholder { color: inherit; opacity: 0.6; } +.site-header .search input:focus { outline: none; border-color: var(--accent); background: rgba(255, 255, 255, 0.2); } +/* Pagefind result list, in the site colours */ +#search { + --pagefind-ui-primary: var(--accent); + --pagefind-ui-text: var(--text); + --pagefind-ui-background: var(--panel); + --pagefind-ui-border: var(--line); + --pagefind-ui-tag: var(--bg); + --pagefind-ui-border-width: 1px; + --pagefind-ui-border-radius: 4px; + --pagefind-ui-image-border-radius: 2px; + --pagefind-ui-font: inherit; + --pagefind-ui-scale: 0.85; +} +#search mark { background: none; color: inherit; font-weight: 700; } diff --git a/content/search.md b/content/search.md new file mode 100644 index 00000000..f3d4922b --- /dev/null +++ b/content/search.md @@ -0,0 +1,4 @@ +--- +title: Search +layout: search +--- diff --git a/layouts/_partials/machine-header.html b/layouts/_partials/machine-header.html index 880ff5d4..48c0d4ac 100644 --- a/layouts/_partials/machine-header.html +++ b/layouts/_partials/machine-header.html @@ -2,13 +2,13 @@ {{ $m := .machine }} {{ $labels := dict "photos" "Photos" "adverts" "Adverts" "hardware" "Hardware" "connectors" "Connectors" "software" "Software" "emulators" "Emulators" "links" "Links" "docs" "Docs" "videos" "Videos" "comments" "Comments" }}
-

+

Museum {{ with $m.GetTerms "categories" }}{{ range first 1 . }} › {{ .LinkTitle }}{{ end }}{{ end }} {{ with $m.Params.company }}{{ with site.GetPage . }} › {{ .Title }}{{ end }}{{ end }}

{{ with $m.Params.logo }}{{ end }}{{ $m.Title }}

-
-
+ {{/* search index: content pages only (not lists), filterable by section; see layouts/search.html */}} + {{ $indexed := and .IsPage (ne .Layout "search") (ne .Params.tab "comments") }} + {{ $section := "" }}{{ with .FirstSection }}{{ if not .IsHome }}{{ $section = .Title }}{{ end }}{{ end }} + {{ if eq .Section "machine-tabs" }}{{ $section = "Museum" }}{{ end }} + {{ block "main" . }}{{ end }}