Enhance Pine Creek marketing site: real media, galleries, HOA info

Content & media
- Replace placeholder slides with optimized real estate photos (img/gallery)
- Rebuild hero video from the HD intro clip + drone "common area" clips
  (gate -> vineyard -> home front -> Vineyard sign -> pavilion -> fountain),
  cutting the private backyard segment; add mobile variant + poster
- Add "Community & Common Areas" aerial gallery and a community map
- Galleries split strictly by style: Vineyard = Tuscan homes only,
  Custom Homes = non-Tuscan estates

HOA / Homeowner Information
- Real board roster (sourced from pinecreekhoa.com) in a responsive table
- Homeowner Information document library (CC&Rs, Vineyard covenants, safety
  rules, architectural review form, delinquency policy, event reimbursement)
  linking the live PDFs; Premier Management Company reference
- Real general contact email

Design & UX
- Modern full-screen video hero with overlay, sticky nav, refined typography
- Click-to-zoom lightbox for all galleries (keyboard + swipe)
- Google Maps embed in the Kannapolis section
- Favicon set generated from the Pine Creek emblem (svg/png/ico)
- Positive reframe of the Custom Homes copy + lot-availability note
- SEO/Open Graph meta, lazy-loaded images, responsive board/doc layouts

Housekeeping
- SCSS source kept in sync (new partials: hero, sections, gallery, board,
  features); remove stale placeholders, old.index.php, and map artifact
- Add .gitignore (.DS_Store, .claude/, css map); fix docs (index.php -> index.html)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-22 22:09:46 -04:00
parent f739de7360
commit 50e8b1bcd3
81 changed files with 1847 additions and 689 deletions

View File

@@ -3,15 +3,15 @@
This is a small static-ish website whose source lives at the repository root. Keep suggestions focused, minimal, and specific to the existing patterns.
- Entry / what to edit
- `index.php` is the site's entry point (contains the HTML structure, nav, hero, and sections). Edit content/structure here.
- `css/` contains SCSS source and compiled CSS. `css/main.scss` imports partials from `css/components/` (e.g. `_nav.scss`, `_slide.scss`).
- `js/main.js` is the single client-side script — it controls the hamburger/nav, slides, and a light client-side prompt-based auth.
- `index.html` is the site's single page (nav, hero, sections, HOA board table, contact, footer). Edit content/structure here.
- `css/main.css` is the **served** stylesheet and is edited directly. `css/main.scss` + `css/components/` partials (`_nav.scss`, `_hero.scss`, `_sections.scss`, `_gallery.scss`, `_board.scss`) are the SCSS source, kept in sync by hand. No build tooling is present locally; if you have Dart Sass, compile with `sass css/main.scss css/main.css`.
- `js/main.js` is the single client-side script — it controls the hamburger/nav, smooth-scroll, and the photo galleries (array-based fade carousel with arrows, dots, autoplay, and swipe).
- Architecture & patterns (observable)
- No framework/tooling files found (no package.json, build scripts). The project is organized as plain HTML/CSS/JS served from `index.php`.
- SCSS pattern: variables at top of `main.scss` (colors, breakpoints), mixins for fonts (`Libre`, `Lato`), and partials under `css/components/` imported by `main.scss`.
- JS pattern: single-file imperative DOM manipulation (`document.getElementById`, `querySelector`, event handlers). Use `const`/`let`, short arrow functions and maintain global-scope structure similar to `js/main.js`.
- Static assets: images in `img/` follow numeric patterns (e.g. `vineyard-0.jpg`, `house-0.jpg`) used by slide logic in `main.js`.
- Static assets: optimized photos live in `img/gallery/` (referenced explicitly in `index.html`); the hero video is `img/hero.mp4` / `img/hero-mobile.mp4` with `img/hero-poster.jpg`.
- Development / preview notes (inferred)
- No CI or build discovered. To preview locally you can serve the folder with a simple server. A safe, minimal option: run `php -S localhost:8000` from the project root and open `http://localhost:8000/`.
@@ -19,8 +19,7 @@ This is a small static-ish website whose source lives at the repository root. Ke
- Conventions and gotchas to follow when changing code
- Keep CSS partials modular. Add new component styles under `css/components/` and import them in `css/main.scss` rather than editing compiled `css/main.css` directly.
- JS uses simple DOM IDs/classes; prefer selecting elements by the same IDs/classes and follow the existing event-handler pattern (assign functions to `onclick`, small helpers like `toggleNav`, `openNav`, `closeNav`).
- The project contains a client-side “light auth” in `js/main.js` that checks literal passwords (`'12345'`, `'abcde'`). Treat this as insecure; if asked to modify auth, recommend server-side changes and note security concerns.
- JS uses simple DOM IDs/classes; prefer selecting elements by the same IDs/classes and follow the existing event-handler pattern (small helpers like `toggleNav`, `closeNav`, `scrollToTarget`, and the `.gallery` initializer).
- When merging or editing `.github/copilot-instructions.md`
- Preserve any human-authored guidance already present. If adding new items, keep them concise and cite files (e.g. `index.php`, `css/main.scss`, `css/components/_nav.scss`, `js/main.js`).