بوتيك التسوق الفاخر — Customer Storefront مبني بـ Next.js 15 بأسلوب فخم مستوحى من الضيافة الراقية.
- Primary Teal:
#009BC5— اللون الأساسي الفاخر - Gold Gradient:
#D4AF37 → #F27628— للأزرار الرئيسية وعناصر CTA - Pearl Background:
#FBFCFDمع Mesh Gradient متحرك - Typography: Cairo (Body) + Amiri (Display)
- Effects: Glassmorphism 2.0, Magnetic UI, Shimmer Animations
| الملف | الوصف |
|---|---|
tailwind.config.ts |
نظام التصميم الفاخر (ألوان، animations، gradients، shadows) |
app/globals.css |
Mesh Gradient، Glassmorphism، Magnetic CTA، Scrollbar مخصص |
app/layout.tsx |
RTL Layout مع Cairo + Amiri، SEO كامل، JSON-LD |
lib/mockData.ts |
20 منتج فاخر عبر 10 فئات + Helpers |
next.config.js |
تحسين الصور (AVIF/WebP) من Unsplash + Pexels |
20 منتج ضمن 10 فئات:
- 🔥 عروض اليوم
- 🍎 فواكه طازجة
- 🥬 خضروات
- 🧀 ألبان وأجبان
- 🥖 مخبوزات
- 🥩 لحوم ودواجن
- 🍚 خزانة المؤن
- ☕ مشروبات
- 🍫 حلويات وشوكولاتة
- 🪔 عطور وبخور
npm install
npm run devثم افتح http://localhost:3000
- ✅ Phase 1: Design System + Mock Data (منجز)
- ⏳ Phase 2: Zustand Store + Header + Bottom Nav + Product Grid
- ⏳ Phase 3: Homepage + Cart Sheet + WhatsApp Checkout
- رقم الطلب عبر واتساب:
+967 771 529 063
Built with 💛 by Zawada Team — Inspired by Keif Al-Diafa aesthetic.