193 lines
9.9 KiB
TypeScript
193 lines
9.9 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import { CheckCircle, Gift, Star } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="smallMedium"
|
|
sizing="largeSizeMediumTitles"
|
|
background="blurBottom"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "الرئيسية", id: "hero"},
|
|
{
|
|
name: "عن المتجر", id: "about"},
|
|
{
|
|
name: "الأطقم", id: "products"},
|
|
{
|
|
name: "اتصل بنا", id: "contact"},
|
|
]}
|
|
brandName="متجر كاف"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
background={{
|
|
variant: "rotated-rays-animated"}}
|
|
title="فخامة لا تضاهى في متجر كاف"
|
|
description="استكشف أحدث تشكيلاتنا من الأطقم الفاخرة التي تعكس ذوقك الرفيع وأناقتك."
|
|
buttons={[
|
|
{
|
|
text: "اطلب عبر واتساب", href: "https://wa.me/your-number"},
|
|
]}
|
|
carouselItems={[
|
|
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/mannequins-with-womenswear_1203-830.jpg?_wi=1", imageAlt: "Black luxury outfit" },
|
|
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-girl-posing-dark-sweater-standing-near-lamps_114579-81910.jpg?_wi=1", imageAlt: "Red luxury outfit" },
|
|
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/surrealist-portrait-fashionable-woman_23-2149224624.jpg?_wi=1", imageAlt: "Beige luxury outfit" },
|
|
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/top-view-monochromatic-cloths_23-2148770334.jpg?_wi=1", imageAlt: "Luxury detail" },
|
|
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/empty-shopping-store-with-casual-formal-wear-design-retail-shop-with-fashionable-clothes-hangers-racks-modern-boutique-clothing-center-fashion-merchandise-sale_482257-63117.jpg?_wi=1", imageAlt: "Store interior" },
|
|
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/brunette-attractive-young-woman-puts-sunglasses-outside-portrait-asian-tanned-lady-black-trench-coat-holds-silver-handbag_197531-27931.jpg?_wi=1", imageAlt: "Collection" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={false}
|
|
title="رؤيتنا في متجر كاف"
|
|
description="نسعى لتقديم تجربة تسوق فريدة ومميزة لكل من يبحث عن التميز والراحة في الأطقم الفاخرة."
|
|
metrics={[
|
|
{ value: "100+", title: "قطعة فاخرة" },
|
|
{ value: "500+", title: "عميل راضٍ" }
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/assortment-antiques-market-objects_23-2148950925.jpg?_wi=1"
|
|
imageAlt="About Kaf Luxury"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTen
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "أقمشة فاخرة", description: "نختار أجود أنواع الأقمشة لضمان الراحة والأناقة.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-velvet-texture_23-2149305940.jpg?_wi=1", imageAlt: "premium fabric texture luxury clothing"
|
|
},
|
|
items: [
|
|
{ icon: CheckCircle, text: "جودة عالية" }
|
|
],
|
|
reverse: false
|
|
},
|
|
{
|
|
title: "تصاميم حصرية", description: "أطقم بتصاميم عصرية تناسب جميع المناسبات.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/thread-roll-close-up_53876-88931.jpg?_wi=1", imageAlt: "premium fabric texture luxury clothing"
|
|
},
|
|
items: [
|
|
{ icon: Star, text: "تصميم فريد" }
|
|
],
|
|
reverse: true
|
|
},
|
|
{
|
|
title: "تغليف مميز", description: "يصلك طلبك بتغليف يليق بفخامة مشترياتك.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/elegant-lady-near-christmas-tree_1157-45218.jpg?_wi=1", imageAlt: "premium fabric texture luxury clothing"
|
|
},
|
|
items: [
|
|
{ icon: Gift, text: "تغليف فاخر" }
|
|
],
|
|
reverse: false
|
|
}
|
|
]}
|
|
title="لماذا تختار متجر كاف؟"
|
|
description="نقدم لكم الجودة والراحة في كل قطعة نختارها لكم بعناية."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "1", brand: "متجر كاف", name: "طقم أسود فاخر", price: "450 ر.س", rating: 5, reviewCount: "20", imageSrc: "http://img.b2bpic.net/free-photo/glamour-female-model-with-short-brown-hair-black-dress-posing-near-light-wall_613910-7038.jpg?_wi=1" },
|
|
{ id: "2", brand: "متجر كاف", name: "طقم أحمر جذاب", price: "480 ر.س", rating: 5, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-stands-near-window_8353-7584.jpg?_wi=1" },
|
|
{ id: "3", brand: "متجر كاف", name: "طقم بيج كلاسيكي", price: "420 ر.س", rating: 5, reviewCount: "10", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2628.jpg?_wi=1" },
|
|
{ id: "4", brand: "متجر كاف", name: "طقم أسود عصري", price: "460 ر.س", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/view-women-s-purse-tiles-with-mediterranean-aesthetics_23-2150916725.jpg?_wi=1" },
|
|
{ id: "5", brand: "متجر كاف", name: "طقم أحمر ملكي", price: "500 ر.س", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cupcakes-paper-roses_23-2148815921.jpg?_wi=1" },
|
|
{ id: "6", brand: "متجر كاف", name: "طقم بيج يومي", price: "400 ر.س", rating: 5, reviewCount: "5", imageSrc: "http://img.b2bpic.net/free-photo/young-man-portrait_23-2148830392.jpg?_wi=1" }
|
|
]}
|
|
title="تشكيلة الأطقم الفاخرة"
|
|
description="اكتشف قطعنا المحدودة والمختارة بعناية، حيث يلتقي التميز بالندرة في كل تصميم حصري متاح لفترة محدودة."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={false}
|
|
testimonial="لقد كانت تجربتي مع متجر كاف ممتازة، جودة الأطقم والتعامل الراقي يجعلني أتسوق منهم دائماً."
|
|
rating={5}
|
|
author="سارة محمد"
|
|
avatars={[
|
|
{ src: "http://img.b2bpic.net/free-photo/portrait-mature-man-assistant-helps-costumer-senior-visiting-fashion-boutique-male-buy-new-exclusive-costume_1157-48883.jpg?_wi=1", alt: "Customer 1" },
|
|
{ src: "http://img.b2bpic.net/free-photo/man-shopping-city_23-2149273759.jpg?_wi=1", alt: "Customer 2" },
|
|
{ src: "http://img.b2bpic.net/free-photo/woman-reading-book-cafe-outdoor-portrait-asian-girl_1296-802.jpg?_wi=1", alt: "Customer 3" },
|
|
{ src: "http://img.b2bpic.net/free-photo/time-make-right-decision_329181-8015.jpg?_wi=1", alt: "Customer 4" },
|
|
{ src: "http://img.b2bpic.net/free-photo/young-women-shopping-city_23-2149321874.jpg?_wi=1", alt: "Customer 5" }
|
|
]}
|
|
ratingAnimation="slide-up"
|
|
avatarsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "rotated-rays-animated"}}
|
|
tag="تواصل معنا"
|
|
title="هل لديك استفسار؟"
|
|
description="فريقنا جاهز لمساعدتك في اختيار الطقم المناسب وتلقي طلباتك عبر الواتساب."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "روابط سريعة", items: [
|
|
{ label: "الرئيسية", href: "#hero" },
|
|
{ label: "اتصل بنا", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "حساباتنا", items: [
|
|
{ label: "واتساب", href: "https://wa.me/your-number" },
|
|
{ label: "إنستغرام", href: "#" },
|
|
{ label: "تويتر", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
logoText="متجر كاف"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |