52 lines
4.0 KiB
Markdown
52 lines
4.0 KiB
Markdown
# AGENTS.md
|
||
|
||
Универсальный одностраничный лендинг-шаблон (shadcn + Payload-ready) для любого продукта/бизнеса. Композиция секций собрана в `src/app/page.tsx`; каждая секция — отдельный widget.
|
||
|
||
## Project Specifics
|
||
|
||
- `src/app/page.tsx` — только композиция: `Header` + секции в `<main>` + `Footer`. Не превращай его в монолит, добавляй/убирай секции, а не код блоков.
|
||
- Каждая секция лендинга — самостоятельный widget в `src/widgets/*-section.tsx`; правь нужную секцию точечно.
|
||
- Базовые UI-примитивы shadcn — в `src/shared/ui/*` (vendored, не переписывай).
|
||
- Проверка после правок: `pnpm lint` и `pnpm build`.
|
||
|
||
## Design System
|
||
|
||
Источник токенов — `src/app/globals.css` (`@theme` + `:root`/`.dark`). Шрифт — Roboto Flex (`--font-roboto-flex`). Работай через семантические классы Tailwind (`bg-primary`, `text-muted-foreground`, `border`), не хардкодь hex/oklch.
|
||
|
||
**Важно — это нейтральная база.** Токены сейчас grayscale (монохром, `--radius` 0.625rem) — дефолтная shadcn-тема без характера. Это значит главный риск шаблона — **дженерик «AI-лендинг»**, который выглядит как все остальные. Поэтому:
|
||
|
||
- **Сначала задай направление.** Под конкретный продукт выбери осознанную эстетику и зашей её в **токены** `globals.css` (`--primary`, `--secondary`, `--accent`, `--radius`, типографику) — а не точечными классами по секциям. Тогда все секции автоматически становятся on-brand.
|
||
- **Расширяй личность, а не сбрасывай в дефолт.** Если у проекта уже задан характер — держи его консистентно во всех секциях.
|
||
|
||
| Роль | База (neutral) | Назначение |
|
||
|---|---|---|
|
||
| `background` / `foreground` | white / near-black | фон и текст |
|
||
| `primary` | near-black | основные CTA, акценты |
|
||
| `secondary` / `muted` | light gray | вторичные поверхности, приглушённый текст |
|
||
| `accent` | light gray | подсветки (задай ярче под бренд) |
|
||
| `border` / `ring` | gray | границы, фокус |
|
||
|
||
Do / Don't:
|
||
- **Do:** определять тему через токены; держать единый ритм отступов/типографики между секциями; контент-first (оффер, доказательства, цена).
|
||
- **Don't:** оставлять монохром-дефолт «как есть» под реальный продукт; хардкодить цвета мимо токенов; стакать секции без выбранного направления — это и есть «одинаковый AI-лендинг».
|
||
|
||
## File Map
|
||
|
||
Композиция: `src/app/page.tsx` → `Header` + секции + `Footer`.
|
||
|
||
| Блок | Widget |
|
||
|---|---|
|
||
| Шапка | `src/widgets/header.tsx` |
|
||
| Hero | `src/widgets/hero-section.tsx` |
|
||
| Features | `src/widgets/features-section.tsx` |
|
||
| Stats | `src/widgets/stats-section.tsx` |
|
||
| How it works | `src/widgets/how-it-works-section.tsx` |
|
||
| Comparison | `src/widgets/comparison-section.tsx` |
|
||
| Gallery | `src/widgets/gallery-section.tsx` |
|
||
| Social proof | `src/widgets/social-proof-section.tsx` |
|
||
| Team | `src/widgets/team-section.tsx` |
|
||
| Pricing | `src/widgets/pricing-section.tsx` |
|
||
| FAQ | `src/widgets/faq-section.tsx` |
|
||
| CTA | `src/widgets/cta-section.tsx` |
|
||
| Footer | `src/widgets/footer.tsx` |
|