61 lines
6.4 KiB
Markdown
61 lines
6.4 KiB
Markdown
# AGENTS.md
|
||
|
||
Northyard Residences — premium real-estate шаблон девелопера: сохраняй светлую каменную палитру, bento-сетки, планировки, каталог квартир и sticky сценарий заявки/ипотеки.
|
||
|
||
## Project Specifics
|
||
|
||
- Квартиры, локация, amenities и этапы покупки описаны в `src/entities/site-content.ts`.
|
||
- `src/app` — только маршруты; композиция каждой страницы живёт в отдельном widget (`src/widgets/<page>-page.tsx`). См. File Map.
|
||
- Mock-калькуляторы держи в `src/features/*/ui`; не подключай реальные банки, CRM, карты или формы отправки без запроса.
|
||
- Не превращай шаблон в общий лендинг: каждая страница должна отвечать на конкретный вопрос покупателя недвижимости.
|
||
- Проверка после правок: `pnpm lint` и `pnpm build`.
|
||
|
||
## Design System
|
||
|
||
Источник токенов — `src/app/globals.css` (`@theme inline` + `:root`/`.dark`). Шрифт — **Noto Sans** (`--font-northyard`), один гарнитур на весь UI, с включёнными OpenType-фичами `ss01`/`cv01` на `body`. Работай через семантические классы Tailwind (`bg-primary`, `text-foreground`, `border-border`, `text-muted-foreground`), никогда не хардкодь hex/oklch.
|
||
|
||
Личность: **тёплый «каменный» premium real-estate** — палитра построена на тёплых бежево-песочных оттенках (hue ~83–90), почти без насыщенности. Фон — тёплый камень/песок, primary — глубокий тёмно-коричнево-серый «графит» (НЕ синий и НЕ чёрный), secondary и accent — приглушённый шалфейно-зелёный (hue ~120–128). Тон спокойный, дорогой, архитектурный: воздух, светлые карточки, тонкие линии.
|
||
|
||
| Роль | Light | Характер |
|
||
|---|---|---|
|
||
| `background` | тёплый светлый камень/песок | основной фон страниц |
|
||
| `foreground` | тёмный тёплый графит | текст |
|
||
| `primary` | глубокий графит (тёплый) | бренд: лого-плашка, CTA-кнопки, числа, акцент линий планировок |
|
||
| `secondary` | приглушённый светлый шалфей | бейджи, мягкие плашки (`bg-secondary text-foreground`) |
|
||
| `accent` / `ring` | шалфейно-зелёный | hover/focus-кольца, точечные акценты |
|
||
| `muted` / `muted-foreground` | светлый песок / тёплый серо-бежевый | вторичный текст, подписи, hover-фон строк |
|
||
| `card` | почти белый тёплый | карточки, таблицы, sticky-панели на каменном фоне |
|
||
| `border` | тёплый бежевый | тонкие границы (1px) повсюду |
|
||
|
||
Узнаваемые приёмы (держи их — это «лицо» шаблона):
|
||
- **Мягкие углы:** `--radius` = 0.5rem; карточки и панели `rounded-lg`, мелкие плашки `rounded-md`, лого-иконка `rounded-full`.
|
||
- **Тонкие тёплые границы:** `border` (1px) на каждой карточке/строке; структура держится на линиях, а не на тенях.
|
||
- **Bento-сетки:** крупные `grid` с асимметричными колонками (`lg:grid-cols-[1.1fr_0.9fr]`, `[1fr_380px]`, sticky правая колонка `lg:sticky lg:top-24`).
|
||
- **Каменные фоны секций:** утилита `.northyard-stone` (тёплый radial+linear градиент песок/шалфей) для hero и contacts.
|
||
- **Планировочная сетка:** утилита `.floor-grid` (32px графитовая сетка-миллиметровка) для floor plan и карты локации; зоны планировки — `border-2 border-primary/*`.
|
||
- **Типографика:** крупные `font-semibold` заголовки (`text-5xl`…`text-7xl`, плотный `leading-[0.98]`), мягкие eyebrow-бейджи `variant="outline"`.
|
||
|
||
Do / Don't:
|
||
- **Do:** держи тёплую каменную палитру и шалфейный акцент; используй bento-сетки, light-карточки, sticky-панель заявки/ипотеки; продавай ежедневный сценарий покупателя (планировка, маршруты, сервис).
|
||
- **Don't:** не вводи холодный синий/чёрный primary, насыщенные или неоновые цвета, тяжёлые тени, острые `rounded-none` углы или generic SaaS-hero с градиентом — это ломает дорогой архитектурный тон.
|
||
|
||
## File Map
|
||
|
||
| Route | Widget |
|
||
|---|---|
|
||
| `/` | `src/widgets/home-page.tsx` (`HomePage`) |
|
||
| `/apartments` | `src/widgets/apartments-page.tsx` (`ApartmentsPage`) |
|
||
| `/apartments/a-1204` | `src/widgets/apartment-detail-page.tsx` (`ApartmentDetailPage`) |
|
||
| `/location` | `src/widgets/location-page.tsx` (`LocationPage`) |
|
||
| `/amenities` | `src/widgets/amenities-page.tsx` (`AmenitiesPage`) |
|
||
| `/purchase` | `src/widgets/purchase-page.tsx` (`PurchasePage`) |
|
||
| `/contacts` | `src/widgets/contacts-page.tsx` (`ContactsPage`) |
|
||
|
||
Переиспользуемые блоки:
|
||
- `src/widgets/site-shell.tsx` — `SiteShell` (header + nav, обёртка всех страниц).
|
||
- `src/widgets/apartment-rows.tsx` — `ApartmentRows` (Home, Apartments; рендерит `apartments`).
|
||
- `src/shared/ui/section-header.tsx` — `SectionHeader` (заголовок секций: Home, Apartments, Location, Amenities, Purchase).
|
||
- `src/features/mortgage-calculator/ui/mortgage-calculator.tsx` — `MortgageCalculator` (mock-калькулятор: Home, Purchase).
|
||
|
||
Одноразовые блоки колоцированы со своей страницей: `FloorPlanCard` (план квартиры) живёт внутри `src/widgets/apartment-detail-page.tsx`.
|