pagefind v1.5.0

.htmltest.yml

@@ -10,6 +10,7 @@ IgnoreURLs:
 - "^/reference/api/hub/.*$"
 - "^/reference/api/engine/v.+/#.*$"
 - "^/reference/api/registry/.*$"
+- "^/pagefind/.*$"
 IgnoreDirs:
 - "registry/configuration"
 - "compose/compose-file" # temporarily ignore until upstream is fixed

Dockerfile

@@ -7,7 +7,7 @@ ARG HTMLTEST_VERSION=0.17.0
 ARG VALE_VERSION=3.11.2
 ARG HUGO_VERSION=0.154.2
 ARG NODE_VERSION=22
-ARG PAGEFIND_VERSION=1.3.0
+ARG PAGEFIND_VERSION=1.5.0-beta.1
 
 # base defines the generic base stage
 FROM golang:${GO_VERSION}-alpine${ALPINE_VERSION} AS base

assets/css/pagefind.css

@@ -0,0 +1,25 @@
+/* Pagefind Component UI Customizations */
+
+/* Dark mode variables for modal */
+.dark pagefind-modal {
+  --pf-text: var(--color-gray-100);
+  --pf-text-secondary: var(--color-gray-300);
+  --pf-text-muted: var(--color-gray-400);
+  --pf-background: var(--color-gray-900);
+  --pf-border: var(--color-gray-700);
+  --pf-border-focus: var(--color-blue-400);
+  --pf-hover: var(--color-gray-800);
+}
+
+/* Highlight marks in results */
+pagefind-results mark {
+  background-color: var(--color-yellow-200);
+  color: inherit;
+  padding: 0 0.125rem;
+  border-radius: 0.125rem;
+}
+
+.dark pagefind-results mark {
+  background-color: rgba(255, 204, 72, 0.3);
+  color: white;
+}

assets/css/style.css

@@ -38,6 +38,7 @@
   @import "global.css";
 }
 @import "utilities.css";
+@import "pagefind.css";
 @import "syntax-dark.css";
 @import "syntax-light.css";
 @import "components.css";

content/_index.md

@@ -2,4 +2,6 @@
 title: Home
 description: Docker Documentation is the official Docker library of resources, manuals, and guides to help you containerize applications.
 keywords: Docker, documentation, manual, guide, reference, api, samples
+aliases:
+  - /search/
 ---

docs_engineer.yml

@@ -290,6 +290,7 @@ agents:
 
     toolsets:
       - type: filesystem
+      - type: fetch
       - type: shell
       - type: todo
       - type: script

layouts/_default/baseof.html

@@ -63,6 +63,7 @@
         {{ if ne .Params.sitemap false }}data-pagefind-body{{- end }}
         class="dark:bg-background-dark w-full min-w-0 bg-white p-8"
       >
+        {{ partial "pagefind-meta.html" . }}
         {{ block "main" . }}
         {{ end }}
       </div>

layouts/partials/breadcrumbs.html

@@ -1,19 +1,13 @@
 <nav
   id="breadcrumbs"
-  {{- $breadcrumbTitles := slice }}
   data-pagefind-ignore
   class="breadcrumbs mb-4 flex min-w-0 items-center gap-2 text-gray-400 dark:text-gray-300"
 >
   {{ range .Ancestors.Reverse }}
-    {{ $breadcrumbTitles = $breadcrumbTitles | append .LinkTitle }}
     <a href="{{ .Permalink }}" class="link truncate"
       >{{ markdownify .LinkTitle }}</a
     >
     <span>/</span>
   {{- end }}
-  <span
-    data-pagefind-meta="breadcrumbs:{{ collections.Delimit $breadcrumbTitles " / " }}"
-    class="truncate"
-    >{{ markdownify .LinkTitle }}</span
-  >
+  <span class="truncate">{{ markdownify .LinkTitle }}</span>
 </nav>

layouts/partials/head.html

@@ -5,6 +5,7 @@
   <link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink }}" />
 {{ end -}}
 {{ partial "utils/css.html" "-" }}
+<link href="/pagefind/pagefind-component-ui.css" rel="stylesheet">
 {{- if hugo.IsProduction -}}
   <script
     src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js"

layouts/partials/pagefind-meta.html

@@ -0,0 +1,10 @@
+{{/* Pagefind metadata - must be inside data-pagefind-body */}}
+{{- $description := partial "utils/description.html" . -}}
+{{- $keywords := partialCached "utils/keywords.html" . . -}}
+{{- $breadcrumbs := slice -}}
+{{- range .Ancestors.Reverse -}}
+  {{- $breadcrumbs = $breadcrumbs | append .LinkTitle -}}
+{{- end -}}
+{{- with $description }}<meta data-pagefind-meta="description:{{ . }}">{{ end }}
+{{- with $keywords }}<meta data-pagefind-meta="keywords:{{ delimit . ", " }}">{{ end }}
+{{- with $breadcrumbs }}<meta data-pagefind-meta="breadcrumbs:{{ delimit . " / " }}">{{ end }}