# BRB Store — AI context Persian RTL storefront for **brb-store.com** (فروشگاه و تعمیرگاه لوازم خانگی برادران برقعی، قم). Next.js App Router rebuild of the original WillaMall/BeTheme site. Keep this file current — other AI tools read it first. Live DNS for `www.brb-store.com` currently serves a different tenant; source of truth for copy, images, and palette is the archived original at `https://www.brb-store.ir/` (Wayback 2022) plus `Ai-data/prompt.txt`. ## Stack - Next.js 16 (App Router, Turbopack) + React 19 + TypeScript + Tailwind v4 - Locale: `fa`, direction: `rtl` - Fonts: Vazirmatn (Persian) + Montserrat (English kickers). Original site used **BYekan-Edited** + **IRANSans** + **Montserrat**; those files were not recoverable from Wayback (`WillaMall_SP/assets/Fonts/...` 404). - Icons: Lucide, tinted with brand red (original used WillaMall `WMi-*` icon font, not archived). - Dev: `npm run dev` ## Brand | Token | Value | Source | | --- | --- | --- | | Brand red | `#e7432b` | BeTheme `color-red` | | Brand dark | `#c93621` | hover | | Ink | `#1a1a1a` | | | Muted | `#6c6363` | original about text | | Paper | `#f6f3f1` | | | Footer copy bar | `#efefef` | original `.footer_copy` | Logo: oval **BRB** (black top / red bottom, “Borgheei Brothers”) at `public/images/brand/logo.png` and `src/assets/images/logo/logo.png`. Favicon from original `.ico`. Design language comes from the original BeTheme Carpenter homepage, not a generic banner stack: - Full-bleed kitchen photography with a **white 92% caption card** (the original slider’s 430px white panel), red 3px bar, Montserrat kicker. - «قطعات ما» header: red bar + English kicker, title, short catalog note. - Parts grid: **4 columns**, image cards with a **frosted glass** caption box on the photo (`backdrop-filter`), hover zoom + search icon. - Red (`#e7432b`) as accent — numbers, icons, underlines — not a wash over every photo. - Story: فروش / قطعات / تعمیرات, ۳۰+ years, two Qom branches, wholesale. - Homepage **blog carousel** after the three-banner row: snap-scroll cards, arrows, link to `/blog`. Copy lives in `lib/data.ts` (`blogPosts`) until Meshkee. - Original **category hover carousel** (`CategoryShowcase`): centered «دسته بندی ها» header, tall photo cards, dark bottom bar that expands on hover with «تماس با ما». Data: `showcaseCategories`. Product tiles stay on **white backgrounds**. Lifestyle extras: `public/images/lifestyle/`. ## Routes (this pass) Clone **only** these pages: | Path | Content | | --- | --- | | `/` | Homepage + static image slots | | `/about` | About us (original `/AboutUs`) | | `/contact` | Contact us (original `/ContactUs`) | | `/blog` | Article list (local placeholders until Meshkee blog is wired) | | `/blog/[slug]` | Article detail | | `/meshkee/static-image-slots` | Slot catalog for the dashboard Refresh button | Account / user icon → `https://customer.brb-store.com` (`NEXT_PUBLIC_CUSTOMER_PORTAL_URL`). Do not build a local login page. ## Homepage order `Hero` → `Services` (3 icons) → `CategoryShowcase` → `AboutPreview` → five-banner (2-col + 3-col) → `BlogCarousel` → `two-banner-row` → `Stats` → `WideBanner` → `Branches`. Caption bars on photos use dark glossy glass (`lib/glossy.ts` `glossyBar`). Hover the card to expand the bar and show `subtext`. ## Static image slots (wired) `GET /tenants/brb-store.com/website/static-images?pageKey=home`. Catalog: `GET /meshkee/static-image-slots` from `STATIC_IMAGE_SLOTS` in `lib/static-images.ts`. Client: `overlaySlotImages` / `pickSlot`. Empty/fail → local placeholder. `url` → ``, `linkUrl` → wrap in a link, `titleFa` / `titleEn` / `subtext` → caption. Use `slot.aspectRatio`. If a slot’s CSS size or ratio changes, update `aspectRatio` and `recommendedWidth` in `STATIC_IMAGE_SLOTS` in the same change. | key | kind | itemCount | ratio | Local fallback | | --- | --- | --- | --- | --- | | `slider` | list | null | 2:1 | `slides` peek carousel, center `1280px` | | `three-icon-image` | list | 3 | 1:1 | Lucide icons if slot empty | | `categories` | list | null | 14:23 | `showcaseCategories` tall cards | | `about-us-image` | single | 1 | 4:3 | `public/images/about/store.jpg` | | `five-banner-section` | list | 5 | 2:1 | `twoBannerRow` + `threeBannerRow` | | `two-banner-row` | list | 2 | 2:1 | `bannersBelowSlider` (after blog) | | `full-row-image` | single | 1 | 32:9 | `public/images/banners/wide.jpg` | | `two-branch-image` | list | 2 | 2:1 | `branches` photos | Do not invent upload APIs. ## Original business data (valid — do not invent replacements) **About:** 30+ years. Sells home appliances, spare parts, and repairs small appliances (vacuum, meat grinder, fan, juicer, mill, steam iron, kettle, mixer, blender, microwave, …). Wholesale and retail, Iran and abroad. Open to manufacturers/traders. **Branches** 1. قم، خیابان سی متری کیوانفر، روبروی داروخانه الهادی 2. قم، بلوار صدوقی، خیابان امام حسین (ع)، نبش کوچه ۲۱ **Phones:** 0912-309-3407، 0912-651-7619، 025-36604454، 025-32404070، تلفکس 0253-6638866 **Telegram:** https://t.me/borgheeibrothers **Email display:** Alireza borghei20@gmail.com (`alirezaborghei20@gmail.com`) **Map:** 34.6564, 50.8696 **Part categories (homepage):** vacuum, juicer/blender/mill, steam cleaner, meat grinder, iron, microwave/toaster, kettle, fan/evaporative cooler, food processor/chopper/hand blender/mixer, battery, bearing, collector. Appliance mega-menu (household + industrial) is copied from the original header; links currently go to `/#parts` until the catalog is connected. ## Meshkee Docs: https://api.meshkee.com/docs/website OpenAPI: https://api.meshkee.com/docs/website/openapi.json Base: `https://api.meshkee.com/api/v1` Tenant domain: `brb-store.com` (`NEXT_PUBLIC_WEBSITE_DOMAIN` / `WEBSITE_DOMAIN`). Wired: homepage static images (`Ai-data/prompt-images-slot.txt`). Later: `Ai-data/prompt-connect-backend.txt` — products, blog, portfolio, customer portal. Public reads only. Do not invent CMS/upload/dashboard APIs. Product images are white-bg and will be read from the backend. ## Local content All copy and nav live in `lib/data.ts`. Downloaded originals are under `public/images/`. Sample lifestyle photos: `assets/sample images/` (copied to `public/images/lifestyle/`).