# DLEAG Website

Nuxt 3 implementation of the DLEAG (Developing Leaders through Equity in Athletics for Girls) marketing site — a non-profit youth sports league serving Newark, Fremont, and Union City, CA.

## Stack

- **Nuxt 3** (Vue 3, TypeScript, SSR)
- **@nuxtjs/google-fonts** — self-hosted Barlow Condensed, Manrope, Roboto, IBM Plex Mono
- **@nuxtjs/sitemap** / **@nuxtjs/robots** — sitemap.xml, robots.txt, SEO defaults
- Hand-written JSON-LD (`useHead`) for Organization and FAQPage structured data

## Getting Started

```bash
npm install
npm run dev      # http://localhost:3000
```

## Scripts

| Command | Description |
|---|---|
| `npm run dev` | Start the dev server with HMR |
| `npm run build` | Production build (SSR, Node server output in `.output/`) |
| `npm run generate` | Static site generation |
| `npm run preview` | Preview a production build locally |
| `npm run lint` | Run ESLint |
| `npm run typecheck` | Run the TypeScript checker |
| `npm test` | Run the Vitest test suite |

## Project Structure

```
app.vue                    Root shell: header, footer, modal, sitewide JSON-LD
pages/                     File-based routes (see below)
components/
  layout/                  Header, footer, contact modal, scroll-to-top
  home/                    Home page sections (hero, programs, testimonials, ...)
  schedule/, awards/, mindful-mondays/   Route-specific components
  shared/                  Reusable pieces (FinalCta, FaqAccordion, AppIcon)
  IconSprite.vue           Inline SVG icon symbol sprite
composables/               useContactModal, useScrollState, useSeasonCountdown
plugins/                   v-reveal scroll-in directive, header scroll state
data/                      Typed content: schedule, testimonials, mindful sessions,
                           staff, awards, FAQ, gallery, programs
server/api/                Sitemap dynamic-URL source
assets/css/                Design tokens (CSS custom properties) + base stylesheet
public/images/             Optimized site imagery, organized by section
```

## Routes

| Path | Notes |
|---|---|
| `/` | Home |
| `/schedule` | Program schedule; `?program=basketball\|volleyball\|jr` |
| `/awards` | Sport tabs; `?sport=basketball\|volleyball` |
| `/awards/[sport]/[category]` | `category` is `team` or `player`; `?season=<slug>` |
| `/gallery` | `?cat=basketball\|volleyball\|jrdleag\|community` |
| `/faq` | |
| `/terms` | |
| `/mindful-mondays` | Index of past sessions |
| `/mindful-mondays/[slug]` | Session detail |
| `/coaches-staff` | `?cat=coaches\|referees\|photographers\|volunteers` |
| `/coaches-staff/[id]` | Staff member detail |

## Content

All copy, schedule dates, rosters, and staff bios live in `data/*.ts` as typed arrays/objects — no CMS yet. The shapes there are a reasonable starting point if this later moves to a headless CMS; swap the imports in each page/component for API calls without touching markup.

## Deployment

`npm run build` produces a Node server in `.output/` (`node .output/server/index.mjs`). Update `site.url` in `nuxt.config.ts` if the production domain changes — it feeds the sitemap, canonical URLs, and JSON-LD.
