llms.txt

# Admax — Ads Campaign Manager UI Kit

> A dashboard-first, production-grade admin kit for ad-campaign tooling. Truly flat
> design (no gradients, no shadows): sunny amber/gold brand, orange "spends"
> accent, candy status colors (green = running/income, red = paused/expense,
> slate = expired), big friendly radii, borders for separation. React + Vite +
> Tailwind v4. EN/AR with full RTL, light + dark. Built on the uikit.studio BASE canvas.

## Run

- `cd react && pnpm install && pnpm dev` → http://localhost:5173 (Dashboard is the index page)
- `pnpm build` / `pnpm typecheck`

## Pages

- [Dashboard](react/src/routes/dashboard.tsx): `/` — KPIs + sparklines, Spends Today/Yesterday banner, Chart Activity, Transaction Overview, goals, social stats, target donut, click summary, most-performed.
- [Campaign](react/src/routes/campaign.tsx): `/campaign` — running/paused/expired rows with mini candlesticks + insight sparklines + controls.
- [Social](react/src/routes/social.tsx): `/social` — filter rail + ad feed with conversion/engagement/likes/comments.
- [Pricing](react/src/routes/pricing.tsx): `/pricing` — monthly/yearly toggle, three plans.
- [Components](react/src/routes/showcase.tsx): `/components` — buttons, badges, inputs, avatars, KPIs, charts, color scale, typography.

## Design

- [theme.css](design/theme.css), [tokens.json](design/tokens.json), [tailwind-preset.js](design/tailwind-preset.js)
- Brand amber `#f59e0b`; accent `#ff7a45`; success `#22c55e`; danger `#f7585b`; info `#4c6ef5`; grape `#845ef7`.
- Fonts: Plus Jakarta Sans (display + body), Cairo (Arabic), JetBrains Mono.

## Components

- [components/](react/src/components): button, card, input (+SearchInput), badge (+StatusPill), avatar, switch, stat-card, charts (Sparkline/LineChart/BarsChart/Donut), container, page-header. Charts are dependency-free inline SVG.

## Agent docs

- [AGENTS.md](AGENTS.md), [uikit.json](uikit.json)