# SmallEngine - Lead Capture for Small Engine Repair Shops

A lightweight, mobile-friendly lead capture app for small engine repair businesses. Customers submit their equipment details, photos, preferred service times, and contact information. Shop owners receive leads instantly with pricing estimates.

## Features

- **Equipment Details** — capture make, model, and equipment type (mower, snowblower, chainsaw, etc.)
- **Photo Upload** — mobile camera integration for equipment condition photos
- **Service Scheduling** — date/time preference selection
- **Contact Capture** — name, phone, email, address
- **Pricing Estimates** — configurable rate card displayed to customers
- **White-Label Ready** — configure per-shop branding, services, and pricing via JSON
- **Fully Static** — no server required; deploys to any static host for free

## Tech Stack

| Layer | Technology |
|-------|-----------|
| Framework | Vue 3 + TypeScript |
| Styling | Tailwind CSS |
| Build | Vite 8 |
| Hosting | Netlify / Cloudflare Pages / Vercel (free tier) |
| Form Backend | Formspree or Netlify Forms (free tier) |
| Image Upload | Cloudinary (free tier) |
| Mobile | PWA with camera access |

## Quick Start

```bash
# Install dependencies
yarn install

# Build for production
yarn build

# Preview production build
yarn preview
```

## Configuration

Each shop customizes the app by editing `shop.config.json`:

```json
{
  "shopName": "Joe's Small Engine Repair",
  "phone": "(555) 123-4567",
  "email": "joe@example.com",
  "logo": "/assets/logo.png",
  "primaryColor": "#16a34a",
  "services": [
    { "name": "Tune-Up", "priceRange": "$75 - $95" },
    { "name": "Blade Sharpening", "priceRange": "$25 - $35" },
    { "name": "Oil Change", "priceRange": "$40 - $55" }
  ],
  "equipmentTypes": ["Lawn Mower", "Snowblower", "Chainsaw", "Leaf Blower", "Generator"],
  "formBackend": "https://formspree.io/f/YOUR_FORM_ID"
}
```

## Deployment

### Netlify (recommended)

1. Fork this repository
2. Edit `shop.config.json` with your shop details
3. Connect the repo to [Netlify](https://netlify.com)
4. Set build command: `yarn build`
5. Set publish directory: `dist`
6. Deploy — your site is live

### Cloudflare Pages

1. Fork and configure `shop.config.json`
2. Connect to [Cloudflare Pages](https://pages.cloudflare.com)
3. Build command: `yarn build`, output: `dist`

### Manual / Any Static Host

```bash
yarn build
# Upload contents of dist/ to your host
```

## Project Structure

```
smallengine/
├── shop.config.json        # Shop-specific configuration
├── src/
│   ├── App.vue             # Root component
│   ├── main.ts             # App entry point
│   ├── components/         # Vue components
│   │   ├── LeadForm.vue    # Main lead capture form
│   │   ├── EquipmentStep.vue
│   │   ├── ScheduleStep.vue
│   │   ├── ContactStep.vue
│   │   └── PricingEstimate.vue
│   ├── types/              # TypeScript interfaces
│   └── composables/        # Shared logic (config loader, form submission)
├── public/                 # Static assets
├── index.html
├── tailwind.config.js
└── vite.config.ts
```

## Multi-Shop Scaling

Each repair shop gets their own instance by:
1. Forking this repository
2. Editing `shop.config.json`
3. Deploying to a free static host

No shared infrastructure, no databases, no server costs.

## License

MIT