Custom i18n system with typed translation dictionaries (~570 keys), LanguageProvider context, and useTranslation hook. All 31 components and pages wired with t() calls. Chatbot backend passes language hint to Claude for Ukrainian responses. Language preference persists via localStorage. SEO meta tags and html lang attribute update dynamically. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
49 lines
2 KiB
Markdown
49 lines
2 KiB
Markdown
# Aimpress Site
|
||
|
||
## Commands
|
||
|
||
```bash
|
||
npm run dev # Start Vite dev server
|
||
npm run build # Type-check (tsc -b) then Vite build
|
||
npm run lint # ESLint
|
||
npm run preview # Preview production build
|
||
```
|
||
|
||
## Architecture
|
||
|
||
React 19 + TypeScript single-page application built with Vite.
|
||
|
||
**Entry point:** `src/main.tsx` → `src/App.tsx`
|
||
|
||
**Page structure** (top to bottom in `App.tsx`):
|
||
- `InteractiveBackground` — canvas/animated background layer
|
||
- `Header`
|
||
- `Hero`, `Benefits`, `Banner1`, `RealResults`, `Timeline`, `Banner2`, `ComparisonTable`, `BlogSection`, `ResourcesSection`, `ContactSection`
|
||
- `Footer`
|
||
|
||
**Firebase:** `src/firebase.ts` — handles form submissions (Firestore/Firebase backend).
|
||
|
||
## Key Patterns
|
||
|
||
**Component styling:** Every component has a paired CSS file (`ComponentName.tsx` + `ComponentName.css`). Import the CSS directly in the component file.
|
||
|
||
**Design tokens** (defined in `src/index.css` `:root`):
|
||
- `--light-grey-100: #D3DDDE`
|
||
- `--dark-grey-100: #233038` (page background)
|
||
- `--dark-teal-100: #075056`
|
||
- `--orange-100: #FF5B04` (primary accent)
|
||
- `--yellow-100: #FCA82E`
|
||
- `--font-primary: 'Inter', sans-serif`
|
||
|
||
**Animations:** Framer Motion for scroll-triggered and interactive animations. `react-intersection-observer` used alongside Framer Motion for viewport-based triggers.
|
||
|
||
**Font:** Self-hosted Inter (weights 300–900) loaded via `@font-face` in `src/index.css`, served from `public/font/Inter/`.
|
||
|
||
**Base styles:** CSS reset in `src/index.css`. Dark background (`--dark-grey-100`), light text (`--light-grey-100`).
|
||
|
||
## Active Technologies
|
||
- TypeScript 5.x, React 19 + None added (custom i18n solution — no library needed for 2 languages + ~200 strings) (001-multi-language)
|
||
- localStorage for language preference (001-multi-language)
|
||
|
||
## Recent Changes
|
||
- 001-multi-language: Added TypeScript 5.x, React 19 + None added (custom i18n solution — no library needed for 2 languages + ~200 strings)
|