From bde78a6841a909ddd722a0b10dc115bd3e94c475 Mon Sep 17 00:00:00 2001
From: Robert Wagner <rwwagner90@gmail.com>
Date: Mon, 24 Aug 2026 22:01:56 -0400
Subject: [PATCH] feat: add about, contact, and privacy pages

Trust anchor pages that crawlers and AI agents check before
recommending a site, each with substantive content in the existing
site design (new shared ContentPage layout), linked from the footer.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 landing/src/components/Footer.astro   | 10 ++++-
 landing/src/layouts/ContentPage.astro | 29 ++++++++++++++
 landing/src/pages/about.astro         | 49 +++++++++++++++++++++++
 landing/src/pages/contact.astro       | 47 ++++++++++++++++++++++
 landing/src/pages/privacy.astro       | 57 +++++++++++++++++++++++++++
 landing/test/dist.test.ts             |  8 ++++
 landing/test/trust-pages.e2e.test.ts  | 28 +++++++++++++
 7 files changed, 227 insertions(+), 1 deletion(-)
 create mode 100644 landing/src/layouts/ContentPage.astro
 create mode 100644 landing/src/pages/about.astro
 create mode 100644 landing/src/pages/contact.astro
 create mode 100644 landing/src/pages/privacy.astro
 create mode 100644 landing/test/trust-pages.e2e.test.ts

diff --git a/landing/src/components/Footer.astro b/landing/src/components/Footer.astro
index c719a59b9..3d1769839 100644
--- a/landing/src/components/Footer.astro
+++ b/landing/src/components/Footer.astro
@@ -35,7 +35,15 @@ import ShepherdWink from '../images/shepherd-head-wink.svg';
       </span>
     </div>
 
-    <div class="flex items-center">
+    <nav
+      class="flex flex-wrap font-heading items-center justify-center mt-4 text-sm uppercase w-full md:mt-0 md:w-auto"
+    >
+      <a class="mr-4 hover:text-navy-light" href="/about">About</a>
+      <a class="mr-4 hover:text-navy-light" href="/contact">Contact</a>
+      <a class="mr-4 hover:text-navy-light" href="/privacy">Privacy</a>
+    </nav>
+
+    <div class="flex items-center mt-4 md:mt-0">
       <a
         class="footer-icon mr-4 w-6"
         href="https://github.com/shipshapecode/shepherd"
diff --git a/landing/src/layouts/ContentPage.astro b/landing/src/layouts/ContentPage.astro
new file mode 100644
index 000000000..45e022ace
--- /dev/null
+++ b/landing/src/layouts/ContentPage.astro
@@ -0,0 +1,29 @@
+---
+import Base from './Base.astro';
+import Header from '../components/Header.astro';
+import Footer from '../components/Footer.astro';
+import { SITE_TITLE } from '../consts';
+
+interface Props {
+  title: string;
+  description: string;
+  heading: string;
+}
+
+const { title, description, heading } = Astro.props;
+---
+
+<Base overrideTitle={title} overrideDescription={description}>
+  <Header title={SITE_TITLE} />
+  <main class="flex justify-center w-full">
+    <div class="max-w-3xl my-12 px-4 w-full">
+      <h1 class="font-heading text-4xl uppercase">{heading}</h1>
+      <div
+        class="content-page font-body mt-6 space-y-4 text-xl [&_a]:underline [&_a:hover]:text-navy-light [&_h2]:font-heading [&_h2]:mt-8 [&_h2]:text-2xl [&_h2]:uppercase [&_ul]:list-disc [&_ul]:pl-6"
+      >
+        <slot />
+      </div>
+    </div>
+  </main>
+  <Footer />
+</Base>
diff --git a/landing/src/pages/about.astro b/landing/src/pages/about.astro
new file mode 100644
index 000000000..144bf1f6e
--- /dev/null
+++ b/landing/src/pages/about.astro
@@ -0,0 +1,49 @@
+---
+import ContentPage from '@layouts/ContentPage.astro';
+---
+
+<ContentPage
+  title="About Shepherd.js"
+  description="What Shepherd.js is, who maintains it, and how it is licensed."
+  heading="About Shepherd"
+>
+  <p>
+    Shepherd is an open-source JavaScript library for guiding users through your
+    app. It lets you build product tours, user onboarding flows, trainings, and
+    feature announcements as a sequence of steps — dialogs that attach to
+    elements in your interface, highlight them with a modal overlay, and walk
+    users through what to do next. Steps are positioned by
+    <a href="https://floating-ui.com/">Floating UI</a>, so they never end up off
+    screen or cropped by an overflow.
+  </p>
+
+  <p>
+    Shepherd ships with full keyboard navigation support, focus trapping, and
+    a11y compliance via aria attributes, and its minimal default styles make it
+    easy to match your product's look and feel. It works with React, Ember,
+    Angular, Vue.js, ES Modules, or plain JavaScript, and is used in production
+    by companies such as Google, Ally, and CodePen.
+  </p>
+
+  <h2>Who maintains Shepherd</h2>
+
+  <p>
+    Shepherd is maintained by <a href="https://shipshape.io">Ship Shape</a>, a
+    software consultancy specializing in web app development. Development
+    happens in the open on
+    <a href="https://github.com/shipshapecode/shepherd">GitHub</a>, where you
+    can report issues, propose changes, and follow releases. The library is
+    published to npm as
+    <a href="https://www.npmjs.com/package/shepherd.js">shepherd.js</a>.
+  </p>
+
+  <h2>Licensing</h2>
+
+  <p>
+    Shepherd is free for open-source, personal, and non-commercial projects
+    under the AGPL-3.0 license. Commercial licenses fund the ongoing maintenance
+    of the library, documentation, and community — see
+    <a href="/pricing">pricing</a> for details, or read the
+    <a href="https://docs.shepherdjs.dev/">documentation</a> to get started.
+  </p>
+</ContentPage>
diff --git a/landing/src/pages/contact.astro b/landing/src/pages/contact.astro
new file mode 100644
index 000000000..86b019370
--- /dev/null
+++ b/landing/src/pages/contact.astro
@@ -0,0 +1,47 @@
+---
+import ContentPage from '@layouts/ContentPage.astro';
+---
+
+<ContentPage
+  title="Contact — Shepherd.js"
+  description="How to reach the Shepherd.js team: email, GitHub, and Discord."
+  heading="Contact"
+>
+  <p>
+    Shepherd is maintained by <a href="https://shipshape.io">Ship Shape</a>.
+    Whether you have a question about using the library, want to report a bug,
+    are interested in a commercial license, or would like help building tours
+    for your product, here is the best way to reach us:
+  </p>
+
+  <ul>
+    <li>
+      <strong>Email:</strong>
+      <a href="mailto:ahoy@shipshape.io">ahoy@shipshape.io</a> — licensing, consulting,
+      and general inquiries. This is the fastest route for commercial questions.
+    </li>
+    <li>
+      <strong>GitHub:</strong>
+      <a href="https://github.com/shipshapecode/shepherd/issues">
+        github.com/shipshapecode/shepherd/issues
+      </a> — bug reports and feature requests for the library itself.
+    </li>
+    <li>
+      <strong>Discord:</strong>
+      <a href="https://discord.gg/EGcDW5NSud">join our Discord server</a> — community
+      chat and support from other Shepherd users and maintainers.
+    </li>
+    <li>
+      <strong>LinkedIn:</strong>
+      <a href="https://www.linkedin.com/company/ship-shape/">Ship Shape</a> — company
+      updates.
+    </li>
+  </ul>
+
+  <p>
+    For documentation, guides, and the full API reference, visit
+    <a href="https://docs.shepherdjs.dev/">docs.shepherdjs.dev</a>. For
+    licensing tiers and purchasing a commercial license, see
+    <a href="/pricing">pricing</a>.
+  </p>
+</ContentPage>
diff --git a/landing/src/pages/privacy.astro b/landing/src/pages/privacy.astro
new file mode 100644
index 000000000..64c58a83d
--- /dev/null
+++ b/landing/src/pages/privacy.astro
@@ -0,0 +1,57 @@
+---
+import ContentPage from '@layouts/ContentPage.astro';
+---
+
+<ContentPage
+  title="Privacy Policy — Shepherd.js"
+  description="How the shepherdjs.dev website handles analytics, payments, and personal data."
+  heading="Privacy Policy"
+>
+  <p>
+    This policy describes how the shepherdjs.dev website, operated by
+    <a href="https://shipshape.io">Ship Shape</a>, handles data. It applies to
+    this website only — not to applications that embed the Shepherd library.
+  </p>
+
+  <h2>What we collect</h2>
+
+  <p>
+    shepherdjs.dev is a static marketing and documentation site. We do not
+    require accounts, and we do not collect personal information to browse the
+    site. We use <a href="https://posthog.com/">PostHog</a> for product analytics,
+    which records anonymous usage data such as pages viewed, referring site, and browser
+    and device type. This helps us understand which parts of the site and documentation
+    are useful. PostHog may use cookies or local storage to distinguish visitors;
+    data is processed on PostHog's US cloud.
+  </p>
+
+  <h2>Payments</h2>
+
+  <p>
+    Commercial license purchases are processed by
+    <a href="https://polar.sh/">Polar</a>, our checkout provider. Your payment
+    details are entered on and processed by Polar — they are never sent to or
+    stored on shepherdjs.dev. Polar shares with us only the information needed
+    to fulfill your license, such as your name, email address, and order
+    details.
+  </p>
+
+  <h2>The Shepherd library</h2>
+
+  <p>
+    The Shepherd JavaScript library itself, installed in your own applications,
+    does not collect, transmit, or store any data about your users. It runs
+    entirely in the browser of the application that embeds it.
+  </p>
+
+  <h2>Your choices and contact</h2>
+
+  <p>
+    You can block analytics with standard browser tooling (content blockers, Do
+    Not Track) without affecting your ability to use this site. If you have
+    questions about this policy, or want data we may hold about you (such as
+    order records) accessed or deleted, email
+    <a href="mailto:ahoy@shipshape.io">ahoy@shipshape.io</a>. We will update
+    this page if our practices change.
+  </p>
+</ContentPage>
diff --git a/landing/test/dist.test.ts b/landing/test/dist.test.ts
index c347a2945..efb39151d 100644
--- a/landing/test/dist.test.ts
+++ b/landing/test/dist.test.ts
@@ -46,4 +46,12 @@ describe.skipIf(!staticDir)('build output', () => {
     expect(functionRoutes).toContain('^/$');
     expect(functionRoutes).toContain('^/index\\.md/?$');
   });
+
+  it('includes the trust pages in the sitemap', () => {
+    const sitemap = readFileSync(join(staticDir!, 'sitemap-0.xml'), 'utf-8');
+
+    expect(sitemap).toContain('<loc>https://www.shepherdjs.dev/about/</loc>');
+    expect(sitemap).toContain('<loc>https://www.shepherdjs.dev/contact/</loc>');
+    expect(sitemap).toContain('<loc>https://www.shepherdjs.dev/privacy/</loc>');
+  });
 });
diff --git a/landing/test/trust-pages.e2e.test.ts b/landing/test/trust-pages.e2e.test.ts
new file mode 100644
index 000000000..62c044fc0
--- /dev/null
+++ b/landing/test/trust-pages.e2e.test.ts
@@ -0,0 +1,28 @@
+import { describe, expect, it } from 'vitest';
+
+import { visibleText } from './helpers';
+import { TEST_BASE_URL } from './setup/dev-server';
+
+describe('trust anchor pages', () => {
+  for (const path of ['/about', '/contact', '/privacy']) {
+    it(`serves ${path} with at least 500 characters of content`, async () => {
+      const response = await fetch(`${TEST_BASE_URL}${path}`);
+      const html = await response.text();
+
+      expect(response.status).toBe(200);
+      expect(html).toMatch(/<h1[\s>]/);
+      expect(visibleText(html).length).toBeGreaterThan(500);
+    });
+  }
+
+  it('links the trust pages from the footer', async () => {
+    const response = await fetch(`${TEST_BASE_URL}/`, {
+      headers: { Accept: 'text/html' }
+    });
+    const html = await response.text();
+
+    expect(html).toContain('href="/about"');
+    expect(html).toContain('href="/contact"');
+    expect(html).toContain('href="/privacy"');
+  });
+});