# Day 69 — Plumber Template

**Live demo:** https://templates.allanninal.dev/plumber/

Part of the [365 Templates](https://allanninal.dev) project — one free Astro template shipped every day.

---

## What's in the box

A production-ready Astro template for a local plumbing business. First in Sprint 3: Trade Services. Distinct visual register from all prior Sprint 3 fitness/wellness templates — Deep Water Navy + Safety Orange palette, Sora + Plus Jakarta Sans fonts.

**Sections:**
- Persistent 24/7 emergency phone bar (red, always visible)
- Sticky header with emergency phone + "Request Service" CTA
- Hero (navy bg, pipe SVG motif, dual CTAs, trust badges)
- Trust badge strip (Licensed & Insured | Master Plumber | Same-Day | 5-Star)
- Services grid (6 services: drain, water heater, leak, fixtures, pipe repair, emergency)
- Why Choose Us (4 columns: upfront pricing, same-day, 24/7, 15+ years)
- Service Area (4 zones, neighborhoods + zip codes — Charlotte NC metro)
- Transparent pricing (3 tiers: diagnostic, standard, emergency)
- Customer reviews (5 Google-style reviews)
- About the owner (Mike Harrington, Master Plumber, credentials)
- FAQ (8 questions, accordion)
- Contact form + emergency phone + address
- Final CTA band (navy, emergency phone prominent)
- Dark navy footer

**Persona:** Blue Ridge Plumbing, Charlotte NC. Replace all business data in `src/data/config.ts`.

---

## Stack

- [Astro](https://astro.build) 4.x (static output)
- [Tailwind CSS](https://tailwindcss.com) 3.x
- [Sora](https://fonts.google.com/specimen/Sora) + [Plus Jakarta Sans](https://fonts.google.com/specimen/Plus+Jakarta+Sans) via `@fontsource`
- Playwright + axe-core for accessibility testing
- Lighthouse CI (≥ 95 all categories)

---

## Getting started

```bash
# Clone and install
git clone https://github.com/<you>/<your-fork>.git
cd templates/plumber
npm install

# Dev server
npm run dev

# Production build
npm run build
```

### Environment variables

| Variable | Purpose | Required |
|----------|---------|----------|
| `PUBLIC_SITE_URL` | Canonical site URL | No (defaults to `https://templates.allanninal.dev`) |
| `PUBLIC_BASE_PATH` | Base path for asset URLs (e.g. `/plumber/`) | No (defaults to `/plumber/`) |
| `PUBLIC_TEMPLATE_HUB_URL` | Enables the download bar + analytics (author's deploy only) | No |
| `PUBLIC_EDITION` | Set to `pro` to activate Pro edition UI | No |

### Customization

1. Edit `src/data/config.ts` — business name, phone, address, owner bio, services, pricing, reviews, FAQ, service area
2. Replace `public/og-image.svg` and `public/favicon.svg` with your brand
3. Update colors in `src/styles/global.css` CSS custom properties
4. Point the contact form `action` in `src/pages/index.astro` to your Formspree endpoint

---

## Running tests

```bash
npm run test:a11y       # axe WCAG AA
npm run test:links      # link integrity + DOM checks
npm run test:lighthouse # Lighthouse ≥ 95 all categories
```

Tests use system Google Chrome — no `playwright install` needed.

---

## License

MIT — free for personal and commercial use. See [LICENSE](./LICENSE).

Made by [Allan Ninal](https://allanninal.dev) · [LinkedIn](https://www.linkedin.com/in/allanninal/) · Day 69 of 365
