447 lines
13 KiB
TypeScript
447 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import { Award, CheckCircle, Clock, Star } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumLarge"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="fluid"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Services",
|
|
id: "services",
|
|
},
|
|
{
|
|
name: "Projects",
|
|
id: "projects",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="Dream Land"
|
|
button={{
|
|
text: "Request Consultation",
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
background={{
|
|
variant: "gradient-bars",
|
|
}}
|
|
title="Building Projects That Last Generations"
|
|
description="Dream Land for Contracting delivers luxury construction, infrastructure, and commercial projects with elite craftsmanship, engineering precision, and a commitment to timeless quality."
|
|
tag="Saudi Standards • Modern Vision • Premium Execution"
|
|
buttons={[
|
|
{
|
|
text: "Start Your Project",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
text: "Explore Portfolio",
|
|
href: "#projects",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/low-angle-building-construction_23-2148230387.jpg"
|
|
avatars={[
|
|
{
|
|
src: "https://img.b2bpic.net/premium-photo/modern-concrete-house-with-geometric-design-minimalist-architecture_1121478-10996.jpg?id=330546262",
|
|
alt: "Client 1",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/giant-building-roof_1127-2232.jpg",
|
|
alt: "Client 2",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/located-shanghai-one-hundred-years-ago-steel-bridge_1127-3115.jpg",
|
|
alt: "Client 3",
|
|
},
|
|
{
|
|
src: "https://img.b2bpic.net/premium-photo/architecture-details-cement-curve-shape-modern-building-futuristic-space-abstract-background_1033579-191402.jpg?id=334081552",
|
|
alt: "Client 4",
|
|
},
|
|
{
|
|
src: "https://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg?id=11111843",
|
|
alt: "Client 5",
|
|
},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text",
|
|
text: "Quality Construction",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Professional Engineering",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Timeless Architecture",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Elite Craftsmanship",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Future Focused",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="stats" data-section="stats">
|
|
<MetricCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="bento-grid"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "m1",
|
|
value: "5+",
|
|
title: "Years Experience",
|
|
description: "Reliable industry service",
|
|
icon: Award,
|
|
},
|
|
{
|
|
id: "m2",
|
|
value: "120+",
|
|
title: "Projects",
|
|
description: "Successfully completed works",
|
|
icon: CheckCircle,
|
|
},
|
|
{
|
|
id: "m3",
|
|
value: "98%",
|
|
title: "Satisfaction",
|
|
description: "Clients trust our results",
|
|
icon: Star,
|
|
},
|
|
{
|
|
id: "m4",
|
|
value: "24/7",
|
|
title: "Support",
|
|
description: "Dedicated project team",
|
|
icon: Clock,
|
|
},
|
|
]}
|
|
title="Proven Excellence"
|
|
description="Years of expertise and high-quality delivery."
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
useInvertedBackground={false}
|
|
heading={[
|
|
{
|
|
type: "text",
|
|
content: "A Modern Contracting Company Built Around ",
|
|
},
|
|
{
|
|
type: "text",
|
|
content: "Precision.",
|
|
},
|
|
{
|
|
type: "image",
|
|
src: "http://img.b2bpic.net/free-photo/close-up-two-male-architect-s-hand-blueprint_23-2147839868.jpg",
|
|
alt: "Engineering",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardNineteen
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
tag: "Residential",
|
|
title: "Residential Projects",
|
|
subtitle: "Luxury Living",
|
|
description: "Luxury villas, compounds, and modern residential buildings.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/group-colleagues-meeting-analyze-building-model-maquette-plan-blueprints-people-working-architecture-design-with-laptop-tablet-urban-layout-table-development_482257-38841.jpg",
|
|
},
|
|
{
|
|
tag: "Commercial",
|
|
title: "Commercial Construction",
|
|
subtitle: "Business Spaces",
|
|
description: "Offices, retail spaces, hotels, and business developments.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/skyscrapers-high-buildings-new-york-downtown-usa_1268-19554.jpg",
|
|
},
|
|
{
|
|
tag: "Infrastructure",
|
|
title: "Infrastructure Works",
|
|
subtitle: "Civil Engineering",
|
|
description: "Roads, utilities, civil works, and large-scale systems.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smart-factory-specialist-using-headset-mic-communicate-insights-engineers_482257-126881.jpg",
|
|
},
|
|
{
|
|
tag: "Finishing",
|
|
title: "Interior Finishing",
|
|
subtitle: "Modern Elegance",
|
|
description: "Premium interiors with elegant modern craftsmanship.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/modern-kitchen-interior-design_23-2151821309.jpg",
|
|
},
|
|
]}
|
|
title="Premium Contracting Services"
|
|
description="End-to-end solutions tailored for visionary projects and ambitious developments."
|
|
/>
|
|
</div>
|
|
|
|
<div id="projects" data-section="projects">
|
|
<ProductCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
gridVariant="one-large-left-three-stacked-right"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1",
|
|
name: "Modern Urban Villa",
|
|
price: "Luxury",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/skyscraper-modern-office-buildings-city_23-2148836816.jpg",
|
|
},
|
|
{
|
|
id: "p2",
|
|
name: "Corporate Office Center",
|
|
price: "Commercial",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/female-executives-strategizing-new-project-inclusive-business-environment_482257-124674.jpg",
|
|
},
|
|
{
|
|
id: "p3",
|
|
name: "Infrastructure System",
|
|
price: "Civil",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/crossroads_1063-101.jpg",
|
|
},
|
|
{
|
|
id: "p4",
|
|
name: "Interior Lobby Design",
|
|
price: "Finishing",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/chic-mid-century-modern-luxury-aesthetics-living-room-with-gray-velvet-couch-blue-rug_53876-128133.jpg",
|
|
},
|
|
{
|
|
id: "p5",
|
|
name: "Residential Tower",
|
|
price: "Luxury",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283288.jpg",
|
|
},
|
|
{
|
|
id: "p6",
|
|
name: "Retail Business Hub",
|
|
price: "Commercial",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/giant-glass-bulding_1203-811.jpg",
|
|
},
|
|
]}
|
|
title="Featured Projects"
|
|
description="Designed With Vision. Built With Excellence."
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"Saudi Aramco",
|
|
"NEOM",
|
|
"PIF",
|
|
"Red Sea Global",
|
|
"Ministry of Housing",
|
|
"Diriyah Gate",
|
|
"Qiddiya",
|
|
]}
|
|
title="Trusted Partners"
|
|
description="Collaborating with industry leaders to shape the future."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1",
|
|
name: "Ahmed Al-Farsi",
|
|
role: "CEO",
|
|
company: "DevelopCo",
|
|
rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/premium-photo/smiling-saudi-man-traditional-attire-with-arms-crossed_99297-843.jpg?id=422598394",
|
|
},
|
|
{
|
|
id: "t2",
|
|
name: "Sara Khalid",
|
|
role: "Director",
|
|
company: "CityBuild",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/architecture-office-partners-looking-blueprints-plans_482257-10523.jpg",
|
|
},
|
|
{
|
|
id: "t3",
|
|
name: "Mohammed Omar",
|
|
role: "Project Manager",
|
|
company: "UrbanDesign",
|
|
rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/arab-man-standing-yellow-background-happy-face-smiling-with-crossed-arms-looking-camera-positive-person_839833-2195.jpg?id=38843129",
|
|
},
|
|
{
|
|
id: "t4",
|
|
name: "Layla Saeed",
|
|
role: "Owner",
|
|
company: "VillaLux",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/great-opportunity-selling-our-projects_329181-9636.jpg",
|
|
},
|
|
{
|
|
id: "t5",
|
|
name: "Fahad bin Abdul",
|
|
role: "Senior Engineer",
|
|
company: "InfrastructureSystems",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/friendly-architect-with-helmet_23-2147702523.jpg",
|
|
},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "100%",
|
|
label: "Commitment",
|
|
},
|
|
{
|
|
value: "24/7",
|
|
label: "Availability",
|
|
},
|
|
{
|
|
value: "5+",
|
|
label: "Experts",
|
|
},
|
|
]}
|
|
title="Client Feedback"
|
|
description="What our clients say about us."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Ready To Start Your Project?"
|
|
description="Book a consultation today."
|
|
inputs={[
|
|
{
|
|
name: "name",
|
|
type: "text",
|
|
placeholder: "Name",
|
|
required: true,
|
|
},
|
|
{
|
|
name: "email",
|
|
type: "email",
|
|
placeholder: "Email",
|
|
required: true,
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message",
|
|
placeholder: "How can we help?",
|
|
rows: 4,
|
|
required: true,
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/professional-male-female-architecture-discussing-something-while-coffee-break_23-2148204031.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
columns={[
|
|
{
|
|
items: [
|
|
{
|
|
label: "About Us",
|
|
href: "#about",
|
|
},
|
|
{
|
|
label: "Services",
|
|
href: "#services",
|
|
},
|
|
{
|
|
label: "Projects",
|
|
href: "#projects",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Contact",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
label: "Careers",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Privacy",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Saturday - Thursday",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "9:00 AM - 6:00 PM",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Friday: Closed",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Dream Land"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|