Merge version_2 into main #2
282
src/app/page.tsx
282
src/app/page.tsx
@@ -2,17 +2,11 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import TeamCardSix from '@/components/sections/team/TeamCardSix';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import { Award, RotateCcw, Shield, TrendingUp, Users, Zap } from "lucide-react";
|
||||
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,223 +23,67 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Services", id: "features"},
|
||||
{
|
||||
name: "Work", id: "work"},
|
||||
{
|
||||
name: "Team", id: "team"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="PixelCraft Agency"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Members", id: "team" },
|
||||
{ name: "News", id: "blog" },
|
||||
]}
|
||||
brandName="Bouhedja Family"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="Crafting Digital Excellence"
|
||||
description="We build high-performance web solutions that empower brands and elevate user experiences. Partner with the agency that turns complex ideas into digital reality."
|
||||
tag="Award Winning Studio"
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Project", href: "#contact"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/row-blue-liquid-glasses-with-shadow-colored-background_23-2147949151.jpg", imageAlt: "digital agency interface abstract blue"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-dark-room-modern-futuristic-sci-fi-background_35913-2413.jpg", imageAlt: "cloud computing tech abstract"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-coworkers-planning-new-strategy-analyzing-online-company-information-startup-office-business-partners-collaborating-analytics-presentation-using-laptop-papers_482257-75252.jpg", imageAlt: "modern software dashboard interface"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-vibrant-geometric-paper-shapes_23-2148428611.jpg", imageAlt: "abstract blue geometric shapes"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/code-testing-quality-assurance-done-computers-startup-workplace_482257-118649.jpg", imageAlt: "web design agency workspace"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-design-abstract-blur-background_1048-12681.jpg", imageAlt: "tech network glowing lines"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Welcome to the Bouhedja Family"
|
||||
description="Celebrating our heritage, staying connected, and sharing the moments that matter most."
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/family-walking-park_23-2148154694.jpg", imageAlt: "Family gathering" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-family-holding-hands_23-2147746408.jpg", imageAlt: "Family connection" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/multi-generation-family-having-picnic-park_23-2148154668.jpg", imageAlt: "Family picnic" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Proven Track Record"
|
||||
metrics={[
|
||||
{
|
||||
icon: Award,
|
||||
label: "Projects Completed", value: "250+"},
|
||||
{
|
||||
icon: Users,
|
||||
label: "Happy Clients", value: "180+"},
|
||||
{
|
||||
icon: TrendingUp,
|
||||
label: "Average Growth", value: "140%"},
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
title="Our Family Members"
|
||||
description="Meet the heart and soul of the Bouhedja family."
|
||||
members={[
|
||||
{ id: "m1", name: "Amine Bouhedja", role: "Founder & Father", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-smiling-camera_23-2148210340.jpg" },
|
||||
{ id: "m2", name: "Sarah Bouhedja", role: "Family Pillar", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-park_23-2148210334.jpg" },
|
||||
{ id: "m3", name: "Youssef Bouhedja", role: "Explorer", imageSrc: "http://img.b2bpic.net/free-photo/young-man-with-bright-smile-outdoors_23-2148210356.jpg" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "f1", title: "Web Design", tags: [
|
||||
"UX/UI", "Design"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/network-connection-graphic-overlay-notebook_53876-133693.jpg"},
|
||||
{
|
||||
id: "f2", title: "App Development", tags: [
|
||||
"Mobile", "Native"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-colleagues-standing-table-looking-design-projects_1098-20475.jpg"},
|
||||
{
|
||||
id: "f3", title: "Strategy & SEO", tags: [
|
||||
"Growth", "SEO"],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/dashboard-element-pack-template_23-2148370473.jpg"},
|
||||
]}
|
||||
title="Our Expertise"
|
||||
description="Comprehensive design and development services built for scaling companies."
|
||||
/>
|
||||
</div>
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardThree
|
||||
animationType="slide-up"
|
||||
title="Family News & Memories"
|
||||
description="Stay updated with our latest news, celebrations, and life updates."
|
||||
textboxLayout="split"
|
||||
blogs={[
|
||||
{ id: "b1", category: "Celebration", title: "Annual Summer Reunion", excerpt: "A wonderful day spent at the coast with everyone.", imageSrc: "http://img.b2bpic.net/free-photo/family-enjoying-beach-day_23-2148154687.jpg", authorName: "Amine", authorAvatar: "", date: "2024-07-15" },
|
||||
{ id: "b2", category: "Update", title: "New Home in the City", excerpt: "We are excited to announce our move to a new family residence.", imageSrc: "http://img.b2bpic.net/free-photo/house-key-hand_23-2148210384.jpg", authorName: "Sarah", authorAvatar: "", date: "2024-08-01" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="work" data-section="work">
|
||||
<ProductCardOne
|
||||
textboxLayout="default"
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "SaaS Platform", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/ui-ux-representations-with-smartphone_23-2150201873.jpg"},
|
||||
{
|
||||
id: "p2", name: "Mobile App UI", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150038913.jpg"},
|
||||
{
|
||||
id: "p3", name: "Corporate Site", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443518.jpg"},
|
||||
{
|
||||
id: "p4", name: "Store Design", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/young-relaxed-adult-connecting-social-network-digital-world-scrolling-his-mobile_482257-136233.jpg"},
|
||||
{
|
||||
id: "p5", name: "Brand Identity", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320719.jpg"},
|
||||
{
|
||||
id: "p6", name: "Interactive App", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345423.jpg"},
|
||||
]}
|
||||
title="Selected Work"
|
||||
description="See some of our latest projects and client partnerships."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="depth-3d"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", icon: Zap,
|
||||
title: "Performance Boost", value: "200%"},
|
||||
{
|
||||
id: "m2", icon: Shield,
|
||||
title: "Security Optimized", value: "100%"},
|
||||
{
|
||||
id: "m3", icon: RotateCcw,
|
||||
title: "UX Improvement", value: "90%"},
|
||||
]}
|
||||
title="Industry Impact"
|
||||
description="Delivering measurable results through innovative design."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "tm1", name: "Elena Rivers", role: "Creative Director", imageSrc: "http://img.b2bpic.net/free-photo/man-studio-films-tablet-video-review-tech-enthusiasts_482257-116480.jpg"},
|
||||
{
|
||||
id: "tm2", name: "Marcus Chen", role: "Lead Architect", imageSrc: "http://img.b2bpic.net/free-photo/dark-studio-full-colourful-lights-young-girl-is-working-her-new-creative-ideas_613910-11479.jpg"},
|
||||
{
|
||||
id: "tm3", name: "Sarah Jenkins", role: "Project Manager", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-young-businesswoman_23-2147837532.jpg"},
|
||||
]}
|
||||
title="Meet Our Experts"
|
||||
description="Driven by creativity, built on technology."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Alice Wang", role: "Founder, Techify", testimonial: "PixelCraft transformed our vision into reality perfectly.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg"},
|
||||
{
|
||||
id: "2", name: "David Smith", role: "CTO, Innovate", testimonial: "Exceptional communication and technical skills throughout.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg"},
|
||||
{
|
||||
id: "3", name: "Maria Garcia", role: "CMO, BrandCo", testimonial: "Our user engagement spiked thanks to their design.", imageSrc: "http://img.b2bpic.net/free-photo/bearded-young-man-casual-shirt-standing-with-laptop-hands_93675-134479.jpg"},
|
||||
{
|
||||
id: "4", name: "Robert Chen", role: "CEO, GrowthLab", testimonial: "Delivered high-quality results ahead of schedule.", imageSrc: "http://img.b2bpic.net/free-photo/fashion-photo-handsome-elegant-man-glasses-suit-with-beautiful-sexy-woman-colorful-dress-white_158538-11288.jpg"},
|
||||
{
|
||||
id: "5", name: "Susan Miller", role: "COO, ScaleIt", testimonial: "Professional, reliable, and incredibly talented team.", imageSrc: "http://img.b2bpic.net/free-photo/girl-sitting-table-holding-mobile-phone-indoors_171337-17096.jpg"},
|
||||
]}
|
||||
title="Client Success"
|
||||
description="Don't just take our word for it."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Let's Collaborate"
|
||||
description="Ready to start your next big project? Reach out."
|
||||
inputs={[
|
||||
{
|
||||
name: "name", type: "text", placeholder: "Your Name"},
|
||||
{
|
||||
name: "email", type: "email", placeholder: "Your Email"},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message", placeholder: "Project details..."}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-professional-enjoying-snack-home_23-2148499599.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/aerial-view-streets-office-building-business-district_107420-95727.jpg"
|
||||
logoText="PixelCraft"
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About", href: "#about"},
|
||||
{
|
||||
label: "Careers", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources", items: [
|
||||
{
|
||||
label: "Blog", href: "#"},
|
||||
{
|
||||
label: "Privacy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-family-silhouette-sunset_23-2148154744.jpg"
|
||||
logoText="Bouhedja Family"
|
||||
columns={[
|
||||
{ title: "Quick Links", items: [{ label: "Top", href: "#nav" }, { label: "Members", href: "#team" }] },
|
||||
{ title: "Updates", items: [{ label: "Latest News", href: "#blog" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user