196 lines
9.1 KiB
TypeScript
196 lines
9.1 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
|
||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
||
import MediaAbout from '@/components/sections/about/MediaAbout';
|
||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||
import { Award, Palette, Users } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="icon-arrow"
|
||
defaultTextAnimation="reveal-blur"
|
||
borderRadius="rounded"
|
||
contentWidth="medium"
|
||
sizing="largeSmall"
|
||
background="circleGradient"
|
||
cardStyle="glass-depth"
|
||
primaryButtonStyle="radial-glow"
|
||
secondaryButtonStyle="layered"
|
||
headingFontWeight="medium"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingInline
|
||
navItems={[
|
||
{ name: "Home", id: "hero" },
|
||
{ name: "About", id: "about" },
|
||
{ name: "Work", id: "tech-showcase" },
|
||
{ name: "Contact", id: "contact" },
|
||
]}
|
||
brandName="Ifeoluwa Designs"
|
||
button={{ text: "Connect", href: "#contact" }}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroSplit
|
||
background={{ variant: "sparkles-gradient" }}
|
||
title="Innovation Meets Creativity"
|
||
description="Hi, I'm Ifeoluwa Olatomide. Founder of Ifeoluwa Designs, creating impactful digital experiences and brand stories from Nigeria to the world."
|
||
buttons={[
|
||
{ text: "View My Work", href: "#tech-showcase" },
|
||
{ text: "Let's Connect", href: "#contact" },
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/confident-young-bald-call-center-man-holding-pointing-with-hand-laptop-isolated-olive-green-with-copy-space_141793-76626.jpg"
|
||
imageAlt="creative designer workspace"
|
||
mediaAnimation="blur-reveal"
|
||
avatars={[
|
||
{ src: "http://img.b2bpic.net/free-photo/middle-eastern-businessman-does-daily-tasks-corporate-job_482257-116713.jpg", alt: "Middle eastern businessman does daily tasks at the corporate job" },
|
||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-with-laptop_23-2149915909.jpg", alt: "Medium shot smiley man with laptop" },
|
||
{ src: "http://img.b2bpic.net/free-photo/person-indian-origin-having-fun_23-2150285308.jpg", alt: "Person of indian origin having fun" },
|
||
{ src: "http://img.b2bpic.net/free-photo/project-leder-with-disabilities-looking-front-sitting-immobilized-wheelchair-business-office-room_482257-2404.jpg", alt: "Project leder with disabilities looking at front sitting immobilized in wheelchair in business office room" },
|
||
{ src: "http://img.b2bpic.net/free-photo/confident-young-bald-call-center-man-holding-pointing-with-hand-laptop-isolated-olive-green-with-copy-space_141793-76626.jpg", alt: "creative designer workspace" },
|
||
]}
|
||
avatarText="Trusted by 50+ Professionals"
|
||
marqueeItems={[
|
||
{ type: "text", text: "UI/UX Design" },
|
||
{ type: "text", text: "Brand Identity" },
|
||
{ type: "text", text: "App Development" },
|
||
{ type: "text", text: "Digital Strategy" },
|
||
{ type: "text", text: "Social Media Growth" },
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<MediaAbout
|
||
useInvertedBackground={false}
|
||
title="More Than Just Design"
|
||
description="Every project is a story waiting to be told. I bridge the gap between aesthetics and functionality, helping personal brands and businesses elevate their digital presence with clean, modern, and purposeful design."
|
||
imageSrc="http://img.b2bpic.net/free-photo/folder-surrounded-by-painting-material_23-2147961452.jpg"
|
||
imageAlt="design studio workspace"
|
||
/>
|
||
</div>
|
||
|
||
<div id="services-highlight" data-section="services-highlight">
|
||
<FeatureCardSixteen
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
negativeCard={{ items: ["Mobile App Design (No-Code)", "Business Strategy", "Digital Marketing Consultation"] }}
|
||
positiveCard={{ items: ["Graphic Design & Logos", "Brand Identity Systems", "Social Media Content", "Banners & Posters"] }}
|
||
title="Crafting Your Story"
|
||
description="I combine diverse skills to ensure your message connects with your audience effectively."
|
||
/>
|
||
</div>
|
||
|
||
<div id="tech-showcase" data-section="tech-showcase">
|
||
<ProductCardThree
|
||
textboxLayout="default"
|
||
gridVariant="bento-grid"
|
||
animationType="blur-reveal"
|
||
useInvertedBackground={false}
|
||
products={[
|
||
{ id: "p1", name: "SOCIAL App", price: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/arabic-phone-16_187299-46645.jpg" },
|
||
{ id: "p2", name: "Brand Campaign A", price: "Design", imageSrc: "http://img.b2bpic.net/free-photo/gray-simple-textured-background-design_53876-145149.jpg" },
|
||
{ id: "p3", name: "Startup Web UI", price: "Tech", imageSrc: "http://img.b2bpic.net/free-photo/working-architect-colleagues-discussing-layout-project_482257-8116.jpg" },
|
||
{ id: "p4", name: "Agency Identity", price: "Brand", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-measuring-tools-desk_23-2150440912.jpg" },
|
||
{ id: "p5", name: "Event Promo", price: "Design", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320694.jpg" },
|
||
{ id: "p6", name: "App Concept V2", price: "Tech", imageSrc: "http://img.b2bpic.net/free-photo/laptop-wooden-desk-with-social-media-diagram_1134-64.jpg" },
|
||
]}
|
||
title="Tech & Projects"
|
||
description="My latest work integrating design and technology."
|
||
/>
|
||
</div>
|
||
|
||
<div id="stats" data-section="stats">
|
||
<MetricCardThree
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
metrics={[
|
||
{ id: "m1", title: "Projects Completed", value: "50+", icon: Award },
|
||
{ id: "m2", title: "Happy Clients", value: "40+", icon: Users },
|
||
{ id: "m3", title: "Designs Created", value: "200+", icon: Palette },
|
||
]}
|
||
title="By The Numbers"
|
||
description="Building impact one project at a time."
|
||
/>
|
||
</div>
|
||
|
||
<div id="social-proof" data-section="social-proof">
|
||
<SocialProofOne
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
names={["Brand A", "Brand B", "Brand C", "Brand D", "Brand E", "Brand F", "Brand G"]}
|
||
title="Trusted Partners"
|
||
description="Working with businesses across Nigeria and beyond."
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqBase
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
faqs={[
|
||
{ id: "f1", title: "What tools do you use?", content: "I use a range of professional design tools and no-code platforms like Adalo for app development." },
|
||
{ id: "f2", title: "Do you work with international clients?", content: "Yes, I work with clients both within Nigeria and internationally." },
|
||
{ id: "f3", title: "How long does a design project take?", content: "Timelines vary depending on project scope, but I prioritize clear communication to ensure deadlines are met." },
|
||
]}
|
||
title="Common Questions"
|
||
description="Get to know more about my design process and services."
|
||
faqsAnimation="blur-reveal"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplit
|
||
useInvertedBackground={false}
|
||
background={{ variant: "plain" }}
|
||
tag="Get In Touch"
|
||
title="Let’s Bring Your Vision To Life"
|
||
description="Ready to elevate your brand? Reach out via email or follow me on social media to start a project."
|
||
imageSrc="http://img.b2bpic.net/free-photo/working-from-home-ergonomic-workstation_23-2149204655.jpg"
|
||
mediaAnimation="slide-up"
|
||
inputPlaceholder="Enter your email for inquiries"
|
||
buttonText="Get Started"
|
||
imageAlt="modern office lighting"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterBaseReveal
|
||
logoText="Ifeoluwa Designs"
|
||
columns={[
|
||
{
|
||
title: "Company", items: [
|
||
{ label: "About", href: "#about" },
|
||
{ label: "Portfolio", href: "#tech-showcase" },
|
||
{ label: "Contact", href: "#contact" },
|
||
],
|
||
},
|
||
{
|
||
title: "Social", items: [
|
||
{ label: "Instagram", href: "https://instagram.com/ifeoluwa_designs" },
|
||
{ label: "Facebook", href: "https://facebook.com/ifeoluwa_designs" },
|
||
],
|
||
},
|
||
]}
|
||
copyrightText="© 2024 Ifeoluwa Designs. All rights reserved."
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|