33 lines
1.7 KiB
Markdown
33 lines
1.7 KiB
Markdown
# CLAUDE.md
|
|
|
|
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
|
|
## Commands
|
|
|
|
```bash
|
|
npm run dev # Start dev server with HMR (Vite)
|
|
npm run build # Production build to dist/
|
|
npm run preview # Preview production build locally
|
|
npm run lint # ESLint check
|
|
```
|
|
|
|
No test suite is configured.
|
|
|
|
## Project Overview
|
|
|
|
Russian-language landing page for a ballistic window film (бронирование стекол) company. Single-page marketing site with a lead capture form that posts to a Telegram bot.
|
|
|
|
## Architecture
|
|
|
|
Single-page React 19 app with Vite, no routing. `App.jsx` composes all sections in vertical order: `Navbar → Hero → PhysicsOfSafety → UseCases → TrustBar → Comparison → Estimator → LeadForm → Footer`.
|
|
|
|
**Key patterns:**
|
|
- All styling is inline `style={{}}` props — there are no CSS modules or Tailwind classes. The only utility classes are defined in `src/index.css`: `.glass-panel`, `.btn-primary`, `.btn-outline`, `.container`, `.text-accent-blue/yellow/orange`.
|
|
- Animations use `framer-motion` (`motion.*` components with `whileInView`, `whileHover`, `whileTap`).
|
|
- Icons come from `lucide-react`.
|
|
- CSS custom properties (set in `:root` in `index.css`) define the design tokens — use these for any new color or spacing values.
|
|
|
|
**Lead form integration:** `LeadForm.jsx` reads `VITE_TG_BOT_TOKEN` and `VITE_TG_CHAT_ID` from `.env` and POSTs to the Telegram Bot API. Copy `.env.example` to `.env` to configure locally.
|
|
|
|
**Estimator:** `Estimator.jsx` calculates cost client-side based on film thickness (200µm = 2000 ₽/m², 300µm = 3000 ₽/m²) and glazing area. The `windows` slider state exists but is not used in the cost formula.
|