Merge version_1 into main #1
358
src/app/page.tsx
358
src/app/page.tsx
@@ -1,321 +1,47 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import type { Metadata } from "next";
|
||||
import { Source_Sans_3 } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import "@/lib/gsap-setup";
|
||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
||||
import Tag from "@/tag/Tag";
|
||||
import { getVisualEditScript } from "@/utils/visual-edit-script";
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||||
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||
import { Clock, Coffee, Users } from "lucide-react";
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import { Users, Clock, Coffee } from 'lucide-react';
|
||||
|
||||
export default function LandingPage() {
|
||||
const sourceSans3 = Source_Sans_3({ variable: "--font-source-sans-3", subsets: ["latin"] });
|
||||
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="bounce-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="mediumLarge"
|
||||
background="circleGradient"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "الرئيسية",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "قائمة الانتظار",
|
||||
id: "status",
|
||||
},
|
||||
{
|
||||
name: "حولنا",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "اتصل بنا",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Ironwood"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="تجربة طعام استثنائية تبدأ بانتظار مريح"
|
||||
description="انضم إلى قائمة الانتظار في Ironwood بكل سهولة واستمتع بوقتك بينما نجهز طاولتك."
|
||||
buttons={[
|
||||
{
|
||||
text: "انضم إلى قائمة الانتظار",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/restaurant-hall-with-round-square-tables-some-chairs-plants_140725-8031.jpg"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/restaurant-table-private-room-with-fireplace-wooden-ceilings-brick-walls_140725-8458.jpg",
|
||||
alt: "ضيف سعيد 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beige-colored-interior-dining-room_114579-2540.jpg",
|
||||
alt: "ضيف سعيد 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/dining-table-with-chairs-tableware_140725-7822.jpg",
|
||||
alt: "ضيف سعيد 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-3428.jpg",
|
||||
alt: "ضيف سعيد 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/sitting-boy-waiting-restaurant_23-2148018743.jpg",
|
||||
alt: "ضيف سعيد 5",
|
||||
},
|
||||
]}
|
||||
avatarText="أكثر من 10,000 ضيف راضٍ"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardEight
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "سهولة الانضمام",
|
||||
description: "سجل اسمك في القائمة بضغطة زر من هاتفك.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149250085.jpg",
|
||||
imageAlt: "سهولة الانضمام",
|
||||
},
|
||||
{
|
||||
title: "متابعة فورية",
|
||||
description: "تعرف على ترتيبك في القائمة ووقت الانتظار المتوقع بدقة.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-making-photo-finished-meal_23-2148114296.jpg",
|
||||
imageAlt: "متابعة فورية",
|
||||
},
|
||||
{
|
||||
title: "دخول ذكي",
|
||||
description: "استخدم تقنية مسح QR للوصول السريع إلى طاولتك.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2148896951.jpg",
|
||||
imageAlt: "دخول ذكي",
|
||||
},
|
||||
]}
|
||||
title="لماذا Ironwood؟"
|
||||
description="نحن نبسط تجربة ضيوفنا لضمان الراحة التامة."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="status" data-section="status">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "12",
|
||||
title: "الضيوف الحاليين",
|
||||
description: "في صالة الانتظار",
|
||||
icon: Users,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "25",
|
||||
title: "متوسط الانتظار",
|
||||
description: "بالدقائق",
|
||||
icon: Clock,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "4",
|
||||
title: "الطاولات المتاحة",
|
||||
description: "تتوقع الجاهزية قريباً",
|
||||
icon: Coffee,
|
||||
},
|
||||
]}
|
||||
title="حالة قائمة الانتظار"
|
||||
description="نظرة مباشرة على تدفق العملاء الحالي."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "أحمد العتيبي",
|
||||
role: "عضو دائم",
|
||||
company: "الرياض",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-smiling-korean-barista-pouring-filter-coffee-prepare-batch-brew-client-cafe_1258-203378.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "سارة المحمد",
|
||||
role: "زائرة",
|
||||
company: "جدة",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-colorful-outfit-retro-vintage-50-s-cafe-sitting-table-drinking-milk-shake-cocktail-blue-skirt-red-shirt-wearing-sunglasses-having-fun-cheerful-mood_285396-10314.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "خالد الشهري",
|
||||
role: "محامي",
|
||||
company: "الرياض",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beauty-woman-eating-healthy-food-sitting-beautiful-interior-with-green-flowers_231208-4742.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "ليلى فهد",
|
||||
role: "مصممة",
|
||||
company: "الدمام",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-with-ice-cream-nighttime_23-2149005363.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "فهد السلمان",
|
||||
role: "رائد أعمال",
|
||||
company: "الرياض",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-businessman-working-office_1157-21037.jpg",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "4.9",
|
||||
label: "تقييم العُملاء",
|
||||
},
|
||||
{
|
||||
value: "95%",
|
||||
label: "رضا الضيوف",
|
||||
},
|
||||
{
|
||||
value: "10k+",
|
||||
label: "ضيوف سعداء",
|
||||
},
|
||||
]}
|
||||
title="ماذا يقول ضيوفنا؟"
|
||||
description="تجارب حقيقية لضيوف Ironwood المميزين."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "كيف أنضم إلى القائمة؟",
|
||||
content: "يمكنك الانضمام مباشرة عبر زر الانضمام وإدخال بياناتك.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "هل يمكنني إلغاء حجزي؟",
|
||||
content: "نعم، يمكنك إلغاء الحجز عبر الرابط الذي سيصلك عبر SMS.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "كيف أعرف متى يحين دوري؟",
|
||||
content: "سنقوم بإرسال تنبيه فور اقتراب موعد طاولتك.",
|
||||
},
|
||||
]}
|
||||
title="الأسئلة الشائعة"
|
||||
description="كل ما تحتاج لمعرفته حول نظامنا للانتظار."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="عن Ironwood"
|
||||
description="نحن في Ironwood ندمج بين الفخامة والتقنية لنوفر لك تجربة لا تُنسى في كل زيارة."
|
||||
metrics={[
|
||||
{
|
||||
value: "2024",
|
||||
title: "سنة التأسيس",
|
||||
},
|
||||
{
|
||||
value: "100+",
|
||||
title: "طاولة جاهزة",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-looking-through-menu-restaurant_23-2150520061.jpg"
|
||||
imageAlt="مقدمة عن المطعم"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
tag="انضم إلينا الآن"
|
||||
title="سجل اسمك في قائمة الانتظار"
|
||||
description="أدخل بياناتك وسنتواصل معك فور تجهيز طاولتك."
|
||||
inputPlaceholder="أدخل رقم هاتفك..."
|
||||
buttonText="انضم للقائمة"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Ironwood"
|
||||
columns={[
|
||||
{
|
||||
title: "روابط سريعة",
|
||||
items: [
|
||||
{
|
||||
label: "الرئيسية",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "حولنا",
|
||||
href: "#about",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "قانوني",
|
||||
items: [
|
||||
{
|
||||
label: "سياسة الخصوصية",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "شروط الخدمة",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 | Ironwood Queue System"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
<ServiceWrapper>
|
||||
<div className={`${sourceSans3.variable} antialiased font-sans`}>
|
||||
<Tag />
|
||||
<NavbarStyleApple
|
||||
brandName="Ironwood"
|
||||
navItems={[
|
||||
{ name: "الرئيسية", id: "hero" },
|
||||
{ name: "المميزات", id: "features" },
|
||||
{ name: "حولنا", id: "about" },
|
||||
{ name: "اتصل بنا", id: "contact" }
|
||||
]}
|
||||
/>
|
||||
<div id="hero" data-section="hero"><HeroOverlay title="تجربة طعام استثنائية تبدأ بانتظار مريح" description="انضم إلى قائمة الانتظار في Ironwood بكل سهولة واستمتع بوقتك بينما نجهز طاولتك." buttons={[{text: "انضم إلى قائمة الانتظار", href: "#contact"}]} imageSrc="http://img.b2bpic.net/free-photo/restaurant-hall-with-round-square-tables-some-chairs-plants_140725-8031.jpg" avatars={[{ src: "http://img.b2bpic.net/free-photo/restaurant-table-private-room-with-fireplace-wooden-ceilings-brick-walls_140725-8458.jpg", alt: "ضيف سعيد 1"},{ src: "http://img.b2bpic.net/free-photo/beige-colored-interior-dining-room_114579-2540.jpg", alt: "ضيف سعيد 2"},{ src: "http://img.b2bpic.net/free-photo/dining-table-with-chairs-tableware_140725-7822.jpg", alt: "ضيف سعيد 3"},{ src: "http://img.b2bpic.net/free-photo/there-are-glasses-wine-water-table-with-white-cloth-are-ready-dining_613910-3428.jpg", alt: "ضيف سعيد 4"},{ src: "http://img.b2bpic.net/free-photo/sitting-boy-waiting-restaurant_23-2148018743.jpg", alt: "ضيف سعيد 5"}]} avatarText="أكثر من 10,000 ضيف راضٍ" /></div>
|
||||
<div id="features" data-section="features"><FeatureCardEight textboxLayout="split" useInvertedBackground={false} features={[{title: "سهولة الانضمام", description: "سجل اسمك في القائمة بضغطة زر من هاتفك.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149250085.jpg", imageAlt: "سهولة الانضمام"},{title: "متابعة فورية", description: "تعرف على ترتيبك في القائمة ووقت الانتظار المتوقع بدقة.", imageSrc: "http://img.b2bpic.net/free-photo/man-making-photo-finished-meal_23-2148114296.jpg", imageAlt: "متابعة فورية"},{title: "دخول ذكي", description: "استخدم تقنية مسح QR للوصول السريع إلى طاولتك.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2148896951.jpg", imageAlt: "دخول ذكي"}]} title="لماذا Ironwood؟" description="نحن نبسط تجربة ضيوفنا لضمان الراحة التامة." /></div>
|
||||
<div id="status" data-section="status"><MetricCardOne animationType="slide-up" textboxLayout="default" gridVariant="bento-grid" useInvertedBackground={false} metrics={[{id: "m1", value: "12", title: "الضيوف الحاليين", description: "في صالة الانتظار", icon: Users},{id: "m2", value: "25", title: "متوسط الانتظار", description: "بالدقائق", icon: Clock},{id: "m3", value: "4", title: "الطاولات المتاحة", description: "تتوقع الجاهزية قريباً", icon: Coffee}]} title="حالة قائمة الانتظار" description="نظرة مباشرة على تدفق العملاء الحالي." /></div>
|
||||
<div id="testimonials" data-section="testimonials"><TestimonialCardSixteen animationType="slide-up" textboxLayout="default" useInvertedBackground={false} testimonials={[{id: "1", name: "أحمد العتيبي", role: "عضو دائم", company: "الرياض", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-smiling-korean-barista-pouring-filter-coffee-prepare-batch-brew-client-cafe_1258-203378.jpg"},{id: "2", name: "سارة المحمد", role: "زائرة", company: "جدة", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-colorful-outfit-retro-vintage-50-s-cafe-sitting-table-drinking-milk-shake-cocktail-blue-skirt-red-shirt-wearing-sunglasses-having-fun-cheerful-mood_285396-10314.jpg"},{id: "3", name: "خالد الشهري", role: "محامي", company: "الرياض", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-beauty-woman-eating-healthy-food-sitting-beautiful-interior-with-green-flowers_231208-4742.jpg"},{id: "4", name: "ليلى فهد", role: "مصممة", company: "الدمام", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-with-ice-cream-nighttime_23-2149005363.jpg"},{id: "5", name: "فهد السلمان", role: "رائد أعمال", company: "الرياض", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/stylish-businessman-working-office_1157-21037.jpg"}]} kpiItems={[{ value: "4.9", label: "تقييم العُملاء"}, { value: "95%", label: "رضا الضيوف"}, { value: "10k+", label: "ضيوف سعداء"}]} title="ماذا يقول ضيوفنا؟" description="تجارب حقيقية لضيوف Ironwood المميزين." /></div>
|
||||
<div id="faq" data-section="faq"><FaqBase textboxLayout="default" useInvertedBackground={false} faqs={[{id: "f1", title: "كيف أنضم إلى القائمة؟", content: "يمكنك الانضمام مباشرة عبر زر الانضمام وإدخال بياناتك."},{id: "f2", title: "هل يمكنني إلغاء حجزي؟", content: "نعم، يمكنك إلغاء الحجز عبر الرابط الذي سيصلك عبر SMS."},{id: "f3", title: "كيف أعرف متى يحين دوري؟", content: "سنقوم بإرسال تنبيه فور اقتراب موعد طاولتك."}]} title="الأسئلة الشائعة" description="كل ما تحتاج لمعرفته حول نظامنا للانتظار." faqsAnimation="slide-up" /></div>
|
||||
<div id="about" data-section="about"><MetricSplitMediaAbout useInvertedBackground={false} title="عن Ironwood" description="نحن في Ironwood ندمج بين الفخامة والتقنية لنوفر لك تجربة لا تُنسى في كل زيارة." metrics={[{value: "2024", title: "سنة التأسيس"},{value: "100+", title: "طاولة جاهزة"}]} mediaAnimation="slide-up" metricsAnimation="slide-up" imageSrc="http://img.b2bpic.net/free-photo/man-looking-through-menu-restaurant_23-2150520061.jpg" /></div>
|
||||
<div id="contact" data-section="contact"><ContactCenter tag="انضم إلينا الآن" title="سجل اسمك في قائمة الانتظار" description="أدخل بياناتك وسنتواصل معك فور تجهيز طاولتك." background={{variant: "gradient-bars"}} useInvertedBackground={false} /></div>
|
||||
<div id="footer" data-section="footer"><FooterBaseCard logoText="Ironwood" columns={[{title: "روابط سريعة", items: [{label: "الرئيسية", href: "#hero"},{label: "حولنا", href: "#about"}]},{title: "قانوني", items: [{label: "سياسة الخصوصية", href: "#"},{label: "شروط الخدمة", href: "#"}]}]} copyrightText="© 2025 | Ironwood Queue System" /></div>
|
||||
<script dangerouslySetInnerHTML={{ __html: `${getVisualEditScript()}` }} />
|
||||
</div>
|
||||
</ServiceWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user