Merge version_1 into main #2
526
src/app/page.tsx
526
src/app/page.tsx
@@ -27,403 +27,153 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Work",
|
||||
id: "#portfolio",
|
||||
},
|
||||
{
|
||||
name: "Insights",
|
||||
id: "#blog",
|
||||
},
|
||||
{
|
||||
name: "Resources",
|
||||
id: "#ebooks",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="DesignStudio"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Work", id: "portfolio" },
|
||||
{ name: "Insights", id: "blog" },
|
||||
{ name: "Resources", id: "ebooks" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="DesignStudio"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
logoText="Design that drives your brand forward"
|
||||
description="Award-winning web designer creating beautiful, conversion-focused websites. Explore my latest work, insights, and resources below."
|
||||
buttons={[
|
||||
{
|
||||
text: "View My Work",
|
||||
href: "#portfolio",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443497.jpg?_wi=1"
|
||||
imageAlt="Award-winning design showcase"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
logoText="Design that drives your brand forward"
|
||||
description="Award-winning web designer creating beautiful, conversion-focused websites. Explore my latest work, insights, and resources below."
|
||||
buttons={[{ text: "View My Work", href: "#portfolio" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443497.jpg"
|
||||
imageAlt="Award-winning design showcase"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Crafting digital experiences that matter."
|
||||
description="I blend technical precision with aesthetic intuition to build websites that aren't just pretty—they work. With a decade of experience, I translate brand identity into high-converting digital platforms."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Conversion First",
|
||||
description: "Every design decision is rooted in user behavior data.",
|
||||
},
|
||||
{
|
||||
title: "Award-Winning UI",
|
||||
description: "Delivering premium aesthetics that stand out in crowded markets.",
|
||||
},
|
||||
{
|
||||
title: "Scalable Code",
|
||||
description: "Clean, performance-optimized architecture built for growth.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/working-place-designer-closeup_93675-131324.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Crafting digital experiences that matter."
|
||||
description="I blend technical precision with aesthetic intuition to build websites that aren't just pretty—they work. With a decade of experience, I translate brand identity into high-converting digital platforms."
|
||||
bulletPoints={[
|
||||
{ title: "Conversion First", description: "Every design decision is rooted in user behavior data." },
|
||||
{ title: "Award-Winning UI", description: "Delivering premium aesthetics that stand out in crowded markets." },
|
||||
{ title: "Scalable Code", description: "Clean, performance-optimized architecture built for growth." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/working-place-designer-closeup_93675-131324.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "E-commerce Redesign",
|
||||
price: "Case Study",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-sale-app_23-2151952980.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "App Launch Platform",
|
||||
price: "Case Study",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/joyful-businesswoman-talking-with-remote-friend-online-videocall_482257-77662.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Boutique Consultancy",
|
||||
price: "Case Study",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-partners-attending-meeting-greenscreen-laptop_482257-91136.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Design Studio Site",
|
||||
price: "Case Study",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-hoodie-mockup-front_1258-248400.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Corp Dashboard",
|
||||
price: "Case Study",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/inspired-youth_53876-176745.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Minimalist Brand",
|
||||
price: "Case Study",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/armchair-furniture-sketch-plan-draft_53876-16425.jpg",
|
||||
},
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A showcase of high-impact websites designed to elevate business objectives."
|
||||
/>
|
||||
</div>
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", name: "E-commerce Redesign", price: "Case Study", imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-sale-app_23-2151952980.jpg" },
|
||||
{ id: "2", name: "App Launch Platform", price: "Case Study", imageSrc: "http://img.b2bpic.net/free-photo/joyful-businesswoman-talking-with-remote-friend-online-videocall_482257-77662.jpg" },
|
||||
{ id: "3", name: "Boutique Consultancy", price: "Case Study", imageSrc: "http://img.b2bpic.net/free-photo/business-partners-attending-meeting-greenscreen-laptop_482257-91136.jpg" },
|
||||
{ id: "4", name: "Design Studio Site", price: "Case Study", imageSrc: "http://img.b2bpic.net/free-photo/white-hoodie-mockup-front_1258-248400.jpg" },
|
||||
{ id: "5", name: "Corp Dashboard", price: "Case Study", imageSrc: "http://img.b2bpic.net/free-photo/inspired-youth_53876-176745.jpg" },
|
||||
{ id: "6", name: "Minimalist Brand", price: "Case Study", imageSrc: "http://img.b2bpic.net/free-photo/armchair-furniture-sketch-plan-draft_53876-16425.jpg" },
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A showcase of high-impact websites designed to elevate business objectives."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={true}
|
||||
title="Proven Results"
|
||||
tag="My Impact"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "150+",
|
||||
description: "Websites Built",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "40%",
|
||||
description: "Avg Conversion Lift",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "10+",
|
||||
description: "Industry Awards",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={true}
|
||||
title="Proven Results"
|
||||
tag="My Impact"
|
||||
metrics={[
|
||||
{ id: "m1", value: "150+", description: "Websites Built" },
|
||||
{ id: "m2", value: "40%", description: "Avg Conversion Lift" },
|
||||
{ id: "m3", value: "10+", description: "Industry Awards" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="ebooks" data-section="ebooks">
|
||||
<ProductCardOne
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "e1",
|
||||
name: "Design Systems Guide",
|
||||
price: "$49",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ebook-reader-yellow-background_58702-6532.jpg",
|
||||
},
|
||||
{
|
||||
id: "e2",
|
||||
name: "UX Workshop Manual",
|
||||
price: "$39",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-devices-screen-editable_24972-2374.jpg",
|
||||
},
|
||||
{
|
||||
id: "e3",
|
||||
name: "The Freelancer OS",
|
||||
price: "$79",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-smartphone-book_23-2149765819.jpg",
|
||||
},
|
||||
{
|
||||
id: "e4",
|
||||
name: "UI Best Practices",
|
||||
price: "$29",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-making-modern-app-interface_1098-21575.jpg",
|
||||
},
|
||||
{
|
||||
id: "e5",
|
||||
name: "Agency Growth Kit",
|
||||
price: "$99",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1jzro6",
|
||||
},
|
||||
{
|
||||
id: "e6",
|
||||
name: "Brand Strategy 101",
|
||||
price: "$45",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-abstract-shapes-cover-collection_23-2148922808.jpg",
|
||||
},
|
||||
]}
|
||||
title="Professional Resources"
|
||||
description="Guides and tools I use to master the design workflow."
|
||||
/>
|
||||
</div>
|
||||
<div id="ebooks" data-section="ebooks">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "e1", name: "Design Systems Guide", price: "$49", imageSrc: "http://img.b2bpic.net/free-photo/ebook-reader-yellow-background_58702-6532.jpg" },
|
||||
{ id: "e2", name: "UX Workshop Manual", price: "$39", imageSrc: "http://img.b2bpic.net/free-photo/digital-devices-screen-editable_24972-2374.jpg" },
|
||||
{ id: "e3", name: "The Freelancer OS", price: "$79", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-smartphone-book_23-2149765819.jpg" },
|
||||
{ id: "e4", name: "UI Best Practices", price: "$29", imageSrc: "http://img.b2bpic.net/free-photo/woman-making-modern-app-interface_1098-21575.jpg" },
|
||||
{ id: "e5", name: "Agency Growth Kit", price: "$99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1jzro6" },
|
||||
{ id: "e6", name: "Brand Strategy 101", price: "$45", imageSrc: "http://img.b2bpic.net/free-vector/gradient-abstract-shapes-cover-collection_23-2148922808.jpg" },
|
||||
]}
|
||||
title="Professional Resources"
|
||||
description="Guides and tools I use to master the design workflow."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Design Insights"
|
||||
description="Thoughts on the future of design and industry evolution."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1",
|
||||
category: "UX Design",
|
||||
title: "The Future of Minimalist Interfaces",
|
||||
excerpt: "How to stay minimalist while maintaining functionality.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-work-closeup-top-view-man-working-laptop_93675-135729.jpg",
|
||||
authorName: "Jane Designer",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman_23-2148780008.jpg",
|
||||
date: "Jan 12",
|
||||
},
|
||||
{
|
||||
id: "b2",
|
||||
category: "Strategy",
|
||||
title: "Building Design Systems",
|
||||
excerpt: "Streamlining your agency's output pipeline.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/graphic-illustration-blue-purple-laser-lights-perfect-digital-background_181624-57663.jpg",
|
||||
authorName: "Jane Designer",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-looking-camera_23-2148304959.jpg",
|
||||
date: "Jan 05",
|
||||
},
|
||||
{
|
||||
id: "b3",
|
||||
category: "Development",
|
||||
title: "React vs Custom CSS",
|
||||
excerpt: "Which path to choose for high-performance sites.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-color-paperclips-arrangement_23-2149345123.jpg",
|
||||
authorName: "Jane Designer",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg",
|
||||
date: "Dec 28",
|
||||
},
|
||||
{
|
||||
id: "b4",
|
||||
category: "Trends",
|
||||
title: "Glassmorphism 2025",
|
||||
excerpt: "Trends that define the new visual era.",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/art-event-template-design_23-2151506753.jpg",
|
||||
authorName: "Jane Designer",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing_23-2149069168.jpg",
|
||||
date: "Dec 15",
|
||||
},
|
||||
{
|
||||
id: "b5",
|
||||
category: "Business",
|
||||
title: "Pricing Your Design Services",
|
||||
excerpt: "How to charge what you are worth.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blogging-gone-viral-camera-concept_53876-127618.jpg",
|
||||
authorName: "Jane Designer",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-woman_23-2148317338.jpg",
|
||||
date: "Dec 01",
|
||||
},
|
||||
{
|
||||
id: "b6",
|
||||
category: "Tech",
|
||||
title: "AI in Design Workflows",
|
||||
excerpt: "Integrating AI into your professional stack.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gradient-dark-blue-futuristic-digital-grid-background_53876-129728.jpg",
|
||||
authorName: "Jane Designer",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/confident-pretty-woman-stands-sideways-isolated-olive-green-wall_141793-65793.jpg",
|
||||
date: "Nov 20",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Design Insights"
|
||||
description="Thoughts on the future of design and industry evolution."
|
||||
blogs={[
|
||||
{ id: "b1", category: "UX Design", title: "The Future of Minimalist Interfaces", excerpt: "How to stay minimalist while maintaining functionality.", imageSrc: "http://img.b2bpic.net/free-photo/businessman-work-closeup-top-view-man-working-laptop_93675-135729.jpg", authorName: "Jane Designer", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman_23-2148780008.jpg", date: "Jan 12" },
|
||||
{ id: "b2", category: "Strategy", title: "Building Design Systems", excerpt: "Streamlining your agency's output pipeline.", imageSrc: "http://img.b2bpic.net/free-photo/graphic-illustration-blue-purple-laser-lights-perfect-digital-background_181624-57663.jpg", authorName: "Jane Designer", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-looking-camera_23-2148304959.jpg", date: "Jan 05" },
|
||||
{ id: "b3", category: "Development", title: "React vs Custom CSS", excerpt: "Which path to choose for high-performance sites.", imageSrc: "http://img.b2bpic.net/free-photo/view-color-paperclips-arrangement_23-2149345123.jpg", authorName: "Jane Designer", authorAvatar: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg", date: "Dec 28" },
|
||||
{ id: "b4", category: "Trends", title: "Glassmorphism 2025", excerpt: "Trends that define the new visual era.", imageSrc: "http://img.b2bpic.net/free-psd/art-event-template-design_23-2151506753.jpg", authorName: "Jane Designer", authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing_23-2149069168.jpg", date: "Dec 15" },
|
||||
{ id: "b5", category: "Business", title: "Pricing Your Design Services", excerpt: "How to charge what you are worth.", imageSrc: "http://img.b2bpic.net/free-photo/blogging-gone-viral-camera-concept_53876-127618.jpg", authorName: "Jane Designer", authorAvatar: "http://img.b2bpic.net/free-photo/front-view-portrait-beautiful-woman_23-2148317338.jpg", date: "Dec 01" },
|
||||
{ id: "b6", category: "Tech", title: "AI in Design Workflows", excerpt: "Integrating AI into your professional stack.", imageSrc: "http://img.b2bpic.net/free-photo/gradient-dark-blue-futuristic-digital-grid-background_53876-129728.jpg", authorName: "Jane Designer", authorAvatar: "http://img.b2bpic.net/free-photo/confident-pretty-woman-stands-sideways-isolated-olive-green-wall_141793-65793.jpg", date: "Nov 20" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
date: "Oct 2024",
|
||||
title: "Startup Founder",
|
||||
quote: "The conversion boost we saw after the redesign was incredible.",
|
||||
tag: "Web Design",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443497.jpg?_wi=2",
|
||||
imageAlt: "professional business portrait person",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark R.",
|
||||
date: "Sep 2024",
|
||||
title: "Marketing Manager",
|
||||
quote: "Fantastic attention to detail and pixel-perfect execution.",
|
||||
tag: "Strategy",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-13618.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/working-place-designer-closeup_93675-131324.jpg?_wi=2",
|
||||
imageAlt: "professional business portrait person",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena K.",
|
||||
date: "Aug 2024",
|
||||
title: "CEO",
|
||||
quote: "My new site brought more traffic in one month than the old one did in a year.",
|
||||
tag: "Ecommerce",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-portrait_23-2149213154.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-sale-app_23-2151952980.jpg?_wi=2",
|
||||
imageAlt: "professional business portrait person",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David L.",
|
||||
date: "Jul 2024",
|
||||
title: "Creative Director",
|
||||
quote: "The cleanest design process I have ever been part of.",
|
||||
tag: "UI/UX",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-66975.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/joyful-businesswoman-talking-with-remote-friend-online-videocall_482257-77662.jpg?_wi=2",
|
||||
imageAlt: "professional business portrait person",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Chloe M.",
|
||||
date: "Jun 2024",
|
||||
title: "Product Lead",
|
||||
quote: "Professional, punctual, and highly intuitive designer.",
|
||||
tag: "SaaS",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-partners-attending-meeting-greenscreen-laptop_482257-91136.jpg?_wi=2",
|
||||
imageAlt: "professional business portrait person",
|
||||
},
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="Partners who trusted their vision to my design process."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah J.", date: "Oct 2024", title: "Startup Founder", quote: "The conversion boost we saw after the redesign was incredible.", tag: "Web Design", avatarSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg", imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443497.jpg", imageAlt: "professional business portrait person" },
|
||||
{ id: "2", name: "Mark R.", date: "Sep 2024", title: "Marketing Manager", quote: "Fantastic attention to detail and pixel-perfect execution.", tag: "Strategy", avatarSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-13618.jpg", imageSrc: "http://img.b2bpic.net/free-photo/working-place-designer-closeup_93675-131324.jpg", imageAlt: "professional business portrait person" },
|
||||
{ id: "3", name: "Elena K.", date: "Aug 2024", title: "CEO", quote: "My new site brought more traffic in one month than the old one did in a year.", tag: "Ecommerce", avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-portrait_23-2149213154.jpg", imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-sale-app_23-2151952980.jpg", imageAlt: "professional business portrait person" },
|
||||
{ id: "4", name: "David L.", date: "Jul 2024", title: "Creative Director", quote: "The cleanest design process I have ever been part of.", tag: "UI/UX", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-66975.jpg", imageSrc: "http://img.b2bpic.net/free-photo/joyful-businesswoman-talking-with-remote-friend-online-videocall_482257-77662.jpg", imageAlt: "professional business portrait person" },
|
||||
{ id: "5", name: "Chloe M.", date: "Jun 2024", title: "Product Lead", quote: "Professional, punctual, and highly intuitive designer.", tag: "SaaS", avatarSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg", imageSrc: "http://img.b2bpic.net/free-photo/business-partners-attending-meeting-greenscreen-laptop_482257-91136.jpg", imageAlt: "professional business portrait person" },
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="Partners who trusted their vision to my design process."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "rotated-rays-animated-grid",
|
||||
}}
|
||||
text="Ready to drive your brand forward? Let's discuss your next project."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "mailto:hello@design.studio",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "rotated-rays-animated-grid" }}
|
||||
text="Ready to drive your brand forward? Let's discuss your next project."
|
||||
buttons={[{ text: "Contact Me", href: "mailto:hello@design.studio" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="DesignStudio"
|
||||
columns={[
|
||||
{
|
||||
title: "Links",
|
||||
items: [
|
||||
{
|
||||
label: "Portfolio",
|
||||
href: "#portfolio",
|
||||
},
|
||||
{
|
||||
label: "Blog",
|
||||
href: "#blog",
|
||||
},
|
||||
{
|
||||
label: "Ebooks",
|
||||
href: "#ebooks",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "LinkedIn",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 DesignStudio. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="DesignStudio"
|
||||
columns={[
|
||||
{ title: "Links", items: [{ label: "Portfolio", href: "#portfolio" }, { label: "Blog", href: "#blog" }, { label: "Ebooks", href: "#ebooks" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] },
|
||||
{ title: "Social", items: [{ label: "Twitter", href: "#" }, { label: "LinkedIn", href: "#" }] },
|
||||
]}
|
||||
copyrightText="© 2025 DesignStudio. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user