176 lines
11 KiB
TypeScript
176 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
|
import MediaAbout from '@/components/sections/about/MediaAbout';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="noiseDiagonalGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Collections", id: "collection" },
|
|
{ name: "Experience", id: "experience" },
|
|
{ name: "Visit", id: "contact" },
|
|
]}
|
|
brandName="متحف العبودي"
|
|
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=pyl12t"
|
|
button={{
|
|
text: "Plan Visit", href: "#contact"}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDoubleCarousel
|
|
background={{ variant: "sparkles-gradient" }}
|
|
title="متحف العبودي"
|
|
description="Where Heritage Lives and Stories Never Fade. اكتشف كنوزاً نادرة من التاريخ والتراث في تجربة تأخذك عبر الزمن."
|
|
leftCarouselItems={[
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN38jC_y0_x4yT1Y5NqM6v5Jj9Q7XQ7-f6S5sY4=w800-h600-k-no?_wi=1", imageAlt: "traditional emirati antique lamp museum" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipM5fWz8g0-o8Z_Zp9Qy8f_Tq4c4G3z2S1X9Z6=w800-h600-k-no?_wi=1", imageAlt: "antique emirati household tool" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN-z4L-1c3y_m9N7Qp4m6Z5P8Xy9k1Y3t6-v0=w800-h600-k-no?_wi=1", imageAlt: "traditional emirati dagger artifact" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipP5G3w8Y7z9N4P9M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=1", imageAlt: "antique arab clay pot" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipQ5Y7w8Y6z9P4M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=1", imageAlt: "ancient arab silver coins" },
|
|
]}
|
|
rightCarouselItems={[
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN8X6z9P4M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=1", imageAlt: "traditional emirati weaving tool" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipM4p5J1q7-f6S5sY4=w800-h600-k-no", imageAlt: "traditional emirati dagger artifact" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipP5G3w8Y7z9N4P9M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=2", imageAlt: "antique arab clay pot" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipQ5Y7w8Y6z9P4M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=2", imageAlt: "ancient arab silver coins" },
|
|
{ imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN38jC_y0_x4yT1Y5NqM6v5Jj9Q7XQ7-f6S5sY4=w800-h600-k-no?_wi=2", imageAlt: "traditional emirati antique lamp museum" },
|
|
]}
|
|
buttons={[
|
|
{ text: "Explore Collection", href: "#collection" },
|
|
{ text: "Plan Your Visit", href: "#contact" },
|
|
]}
|
|
avatars={[
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7z95vq", alt: "smiling middle-aged woman portrait" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jyjyrn", alt: "young arab man smiling portrait" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2an9zg", alt: "mature arab man smiling portrait" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6n3q9e", alt: "smiling woman portrait professional" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wks21w", alt: "young professional portrait smiling" },
|
|
]}
|
|
avatarText="Trusted by 5,000+ local history lovers"
|
|
marqueeItems={[{ type: "text", text: "Preservation" }, { type: "text", text: "Education" }, { type: "text", text: "Culture" }, { type: "text", text: "Tradition" }, { type: "text", text: "Artistry" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaAbout
|
|
useInvertedBackground={true}
|
|
title="More Than A Museum"
|
|
description="A place where history becomes enjoyable and interactive. We preserve the authentic spirit of the Emirati past through a collection that bridges generations."
|
|
imageSrc="https://lh5.googleusercontent.com/p/AF1QipP5G3w8Y7z9N4P9M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=3"
|
|
imageAlt="traditional emirati antique lamp museum"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwelve
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{ id: "f1", label: "Culture", title: "Rare Heritage Collection", items: ["Authentic antiques", "Generational preservation", "Cultural storytelling"] },
|
|
{ id: "f2", label: "Learn", title: "Learn Through Discovery", items: ["Fascinating history", "Interactive knowledge", "Educational depth"] },
|
|
{ id: "f3", label: "Family", title: "Family Experience", items: ["Welcoming for all", "Educational experiences", "Cultural engagement"] },
|
|
]}
|
|
title="The Experience"
|
|
description="Discover a heritage destination designed for every generation."
|
|
/>
|
|
</div>
|
|
|
|
<div id="collection" data-section="collection">
|
|
<ProductCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{ id: "p1", name: "Traditional Artifact", price: "View", imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN38jC_y0_x4yT1Y5NqM6v5Jj9Q7XQ7-f6S5sY4=w800-h600-k-no?_wi=3", imageAlt: "antique emirati household tool" },
|
|
{ id: "p2", name: "Household Tools", price: "View", imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN-z4L-1c3y_m9N7Qp4m6Z5P8Xy9k1Y3t6-v0=w800-h600-k-no?_wi=2", imageAlt: "traditional emirati dagger artifact" },
|
|
{ id: "p3", name: "Rare Antiques", price: "View", imageSrc: "https://lh5.googleusercontent.com/p/AF1QipQ5Y7w8Y6z9P4M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=3", imageAlt: "antique arab clay pot" },
|
|
{ id: "p4", name: "Historical Pieces", price: "View", imageSrc: "https://lh5.googleusercontent.com/p/AF1QipP5G3w8Y7z9N4P9M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=4", imageAlt: "ancient arab silver coins" },
|
|
{ id: "p5", name: "Vintage Treasures", price: "View", imageSrc: "https://lh5.googleusercontent.com/p/AF1QipN8X6z9P4M6p5J1q7-f6S5sY4=w800-h600-k-no?_wi=2", imageAlt: "traditional emirati weaving tool" },
|
|
{ id: "p6", name: "Cultural Collectibles", price: "View", imageSrc: "https://lh5.googleusercontent.com/p/AF1QipM5fWz8g0-o8Z_Zp9Qy8f_Tq4c4G3z2S1X9Z6=w800-h600-k-no?_wi=2", imageAlt: "traditional emirati antique lamp museum" },
|
|
]}
|
|
title="Featured Collections"
|
|
description="Explore rare pieces and historical tools."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
animationType="scale-rotate"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "t1", name: "Farha Ahmed", role: "Visitor", company: "RAK", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7z95vq", imageAlt: "smiling middle-aged woman portrait" },
|
|
{ id: "t2", name: "Haya AlNaqbi", role: "History Buff", company: "RAK", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jyjyrn", imageAlt: "young arab man smiling portrait" },
|
|
{ id: "t3", name: "Abdulrahman Al Ansari", role: "Collector", company: "Dubai", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2an9zg", imageAlt: "mature arab man smiling portrait" },
|
|
{ id: "t4", name: "Sarah Miller", role: "Tourist", company: "USA", rating: 4, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6n3q9e", imageAlt: "smiling woman portrait professional" },
|
|
{ id: "t5", name: "John Doe", role: "Museum Fan", company: "Local", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wks21w", imageAlt: "young professional portrait smiling" },
|
|
]}
|
|
title="Stories From Visitors"
|
|
description="See why our museum is rated 4.6/5 by history lovers."
|
|
/>
|
|
</div>
|
|
|
|
<div id="discovery" data-section="discovery">
|
|
<MediaAbout
|
|
useInvertedBackground={true}
|
|
title="Discover History"
|
|
description="At متحف العبودي, every object carries memories, traditions, and stories from another era. We invite you to experience the past."
|
|
imageSrc="https://lh5.googleusercontent.com/p/AF1QipN38jC_y0_x4yT1Y5NqM6v5Jj9Q7XQ7-f6S5sY4=w800-h600-k-no?_wi=4"
|
|
imageAlt="traditional emirati antique lamp museum"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Visit Us"
|
|
description="📍 Al Riffa — Ras Al Khaimah | ☎ 050 788 0717 | Family friendly and wheelchair accessible."
|
|
inputs={[
|
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
|
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
|
]}
|
|
imageSrc="https://lh5.googleusercontent.com/p/AF1QipM5fWz8g0-o8Z_Zp9Qy8f_Tq4c4G3z2S1X9Z6=w800-h600-k-no?_wi=3"
|
|
imageAlt="traditional emirati antique lamp museum"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=pyl12t"
|
|
logoText="متحف العبودي"
|
|
leftLink={{ text: "Preserving heritage", href: "#" }}
|
|
rightLink={{ text: "© 2024 Al Aboodi Museum", href: "#" }}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |