6.5 KiB
AGENTS.md
SignalDesk AI — B2B SaaS для поддержки; сохраняй launch-page стиль, cobalt акцент, честные SaaS-блоки, demo dashboard без реальных API и платежей.
Project Specifics
- Source content lives in
src/entities/site-content.ts; keep visible copy there or directly in route JSX. src/appis routing only; композиция каждой страницы живёт в отдельном widget (src/widgets/<page>-page.tsx). См. File Map.- Keep cards at 8px radius or less and preserve the selected palette in
src/app/globals.css. - This is a static frontend template: do not add real payments, auth, persistence, external API calls, or backend contracts without an explicit product request.
- After changes run
pnpm lintandpnpm build.
Визуальные правки
- Кириллица обязательна для видимого текста и выбранных Google Fonts.
- При AI-правках сохраняйте доменные блоки этого шаблона: они отличают проект от generic landing.
Design System
Источник токенов — src/app/globals.css (@theme inline + :root/.dark). Шрифты: заголовки (h1/h2/h3, .font-display) — Roboto Flex (--font-display), текст/UI — Inter (--font-sans); mono в теме указывает на тот же display. Работай через семантические классы Tailwind (bg-primary, text-foreground, border-border, text-muted-foreground), никогда не хардкодь hex/oklch.
Личность: clean B2B SaaS launch-page — почти белый фон (oklch(0.985 0 0)), глубокий cobalt/indigo primary как единственный фирменный цвет, бирюзовый teal accent для данных и диаграмм, мягкие нейтральные границы. Воздух, плотная сетка max-w-[1280px], крупные семиболдовые заголовки. Не «громкий», а спокойный и доверительный.
| Роль | Light | Характер |
|---|---|---|
background |
почти белый (oklch 0.985) |
основной фон страниц |
foreground |
near-black indigo-ink | текст, тёмные CTA-плашки (bg-foreground text-background) |
primary |
глубокий cobalt/indigo | бренд-акцент: лого, ссылки, активные числа, primary CTA |
accent |
teal/бирюза | вторые столбцы диаграмм, точечные акценты данных |
secondary |
холодный светло-серый | мягкие бейджи, фоновые плашки |
muted / muted-foreground |
светло-серый / серо-синий | вторичный текст, подписи |
card |
белый (oklch 1) |
карточки и секции на фоне |
Узнаваемые приёмы (держи их — это «лицо» шаблона):
- Мягкие, не острые углы:
--radius= 0.5rem; карточки и кнопки почти всегдаrounded-md(8px и меньше). Не уходи вrounded-noneили сильно скруглённые pill-формы. - Тонкие нейтральные границы:
border border-border(1px), без толстых брутализм-рамок. - Hero-фоны на CSS-утилитах:
.signal-aurora(анимированный radial-градиент cobalt/teal/lime) +.signal-grid(точечная сетка с mask-fade). Используй их для launch hero вместо плоского цвета. Есть также.grainient-field. - Глубокие «продуктовые» тени для dashboard-панели:
shadow-[0_36px_100px_rgba(37,76,210,0.22)]+backdrop-blur-xlна demo-панели. - Типографика:
font-semibold, крупные размеры (text-4xl…text-7xl), плотныйleading, eyebrow-меткиtext-xs font-semibold uppercase tracking-[0.16em] text-primary.
Do / Don't:
- Do: держи cobalt primary единственным брендовым цветом; data/charts подсвечивай
accent; используй eyebrow + крупный заголовок + сетку карточек; demo dashboard оставляй mock без реальных API. - Don't: не добавляй второй яркий бренд-цвет, неоновые градиенты на тексте, толстые рамки, острые
rounded-noneуглы или тяжёлый брутализм — это ломает спокойный SaaS-тон.
File Map
| Route | Widget |
|---|---|
/ |
src/widgets/home-page.tsx (HomePage) |
/product |
src/widgets/product-page.tsx (ProductPage) |
/pricing |
src/widgets/pricing-page.tsx (PricingPage) |
/customers |
src/widgets/customers-page.tsx (CustomersPage) |
/resources |
src/widgets/resources-page.tsx (ResourcesPage) |
/dashboard |
src/widgets/dashboard-page.tsx (DashboardPage) |
Переиспользуемые блоки:
src/widgets/site-shell.tsx—SiteHeader+SiteFooter(обёртка изsrc/app/layout.tsx).src/widgets/saas-dashboard.tsx—SaasDashboard(Home hero, Dashboard).src/widgets/issue-workflow.tsx—IssueWorkflow(Home, Dashboard, Product).src/widgets/integration-stack.tsx—IntegrationStack(Home, Product).src/widgets/metric-strip.tsx—MetricStrip(Home; рендеритhighlights).src/widgets/testimonial-band.tsx—TestimonialBand(Home, Customers; рендеритtestimonials).src/shared/ui/inner-hero.tsx—InnerHero(хедер всех внутренних страниц).src/shared/ui/featured-grid.tsx—FeaturedGrid(Home, Product, Resources).src/shared/ui/icon-cards.tsx—IconCards(Dashboard, Product).src/shared/ui/pricing-tiles.tsx—PricingTiles(Pricing).src/shared/ui/info-columns.tsx—InfoColumns(Pricing, Resources).src/shared/ui/split-story.tsx—SplitStory(Home, Customers).src/shared/ui/cta-panel.tsx—CtaPanel(Product).
Одноразовые блоки колоцированы со своей страницей: GrainientHero (launch hero) живёт внутри src/widgets/home-page.tsx.