Merge version_1 into main #2
586
src/app/page.tsx
586
src/app/page.tsx
@@ -21,438 +21,184 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "projects",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="DevFolio"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Projects", id: "projects" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="DevFolio"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
imagePosition="right"
|
||||
title="Crafting Digital Experiences."
|
||||
description="Freelance web developer specialized in creating high-performance, modern web applications that drive business growth."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah J.",
|
||||
handle: "@sarahj",
|
||||
testimonial: "Exceptional work on our platform migration.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "Mike D.",
|
||||
handle: "@miked",
|
||||
testimonial: "Delivered the product early and beyond expectations.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "Ana R.",
|
||||
handle: "@anar",
|
||||
testimonial: "Excellent communication and technical expertise.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/user-profile-icon-front-side_187299-39596.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "John K.",
|
||||
handle: "@johnk",
|
||||
testimonial: "The performance gains were immediate and massive.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/user-front-side-with-white-background_187299-40007.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
name: "Lisa V.",
|
||||
handle: "@lisav",
|
||||
testimonial: "Very professional and a pleasure to work with.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-flat-people-faces-icon-set-social-media-avatar-userpic-profiles_1416-508.jpg?_wi=1",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "View Projects",
|
||||
href: "#projects",
|
||||
},
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cozy-loft-style-illuminated-apartment-with-modern-home-office_482257-126413.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-man-suit-looking-camera_23-2148112202.jpg",
|
||||
alt: "user-1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-man-with-glasses_23-2148514897.jpg",
|
||||
alt: "user-2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg",
|
||||
alt: "user-3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beautiful-afro-american-woman-smiling_23-2148336914.jpg",
|
||||
alt: "user-4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/blond-businessman-with-glasses_1098-57.jpg",
|
||||
alt: "user-5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by 50+ clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "React.js",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Next.js",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "TypeScript",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "PostgreSQL",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Cloud-Native",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
background={{ variant: "gradient-bars" }}
|
||||
imagePosition="right"
|
||||
title="Crafting Digital Experiences."
|
||||
description="Freelance web developer specialized in creating high-performance, modern web applications that drive business growth."
|
||||
testimonials={[
|
||||
{ name: "Sarah J.", handle: "@sarahj", testimonial: "Exceptional work on our platform migration.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg" },
|
||||
{ name: "Mike D.", handle: "@miked", testimonial: "Delivered the product early and beyond expectations.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg" },
|
||||
{ name: "Ana R.", handle: "@anar", testimonial: "Excellent communication and technical expertise.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/user-profile-icon-front-side_187299-39596.jpg" },
|
||||
{ name: "John K.", handle: "@johnk", testimonial: "The performance gains were immediate and massive.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/user-front-side-with-white-background_187299-40007.jpg" },
|
||||
{ name: "Lisa V.", handle: "@lisav", testimonial: "Very professional and a pleasure to work with.", rating: 5, imageSrc: "http://img.b2bpic.net/free-vector/linear-flat-people-faces-icon-set-social-media-avatar-userpic-profiles_1416-508.jpg" }
|
||||
]}
|
||||
buttons={[{ text: "View Projects", href: "#projects" }, { text: "Contact Me", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cozy-loft-style-illuminated-apartment-with-modern-home-office_482257-126413.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiling-man-suit-looking-camera_23-2148112202.jpg", alt: "user-1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-man-with-glasses_23-2148514897.jpg", alt: "user-2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", alt: "user-3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautiful-afro-american-woman-smiling_23-2148336914.jpg", alt: "user-4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/blond-businessman-with-glasses_1098-57.jpg", alt: "user-5" },
|
||||
]}
|
||||
avatarText="Trusted by 50+ clients"
|
||||
marqueeItems={[{ type: "text", text: "React.js" }, { type: "text", text: "Next.js" }, { type: "text", text: "TypeScript" }, { type: "text", text: "PostgreSQL" }, { type: "text", text: "Cloud-Native" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Passionate about Quality Code."
|
||||
description="With over 6 years of experience, I build robust, scalable, and responsive web solutions that prioritize user experience and maintainability."
|
||||
metrics={[
|
||||
{
|
||||
value: "100+",
|
||||
title: "Projects Completed",
|
||||
},
|
||||
{
|
||||
value: "50+",
|
||||
title: "Happy Clients",
|
||||
},
|
||||
{
|
||||
value: "6y",
|
||||
title: "Experience",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/middle-eastern-businessman-does-daily-tasks-corporate-job_482257-116713.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Passionate about Quality Code."
|
||||
description="With over 6 years of experience, I build robust, scalable, and responsive web solutions that prioritize user experience and maintainability."
|
||||
metrics={[{ value: "100+", title: "Projects Completed" }, { value: "50+", title: "Happy Clients" }, { value: "6y", title: "Experience" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/middle-eastern-businessman-does-daily-tasks-corporate-job_482257-116713.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="skills" data-section="skills">
|
||||
<FeatureHoverPattern
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Front-End Development",
|
||||
description: "Expert in React, Next.js, and TypeScript for fast user interfaces.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Backend Engineering",
|
||||
description: "Strong skills in Node.js, PostgreSQL, and secure API architecture.",
|
||||
},
|
||||
{
|
||||
icon: Globe,
|
||||
title: "Responsive Design",
|
||||
description: "Mobile-first approach ensuring perfect experience on every device.",
|
||||
},
|
||||
]}
|
||||
title="Core Technical Skills."
|
||||
description="Leveraging modern tech stacks to deliver high-quality, efficient, and scalable digital solutions."
|
||||
/>
|
||||
</div>
|
||||
<div id="skills" data-section="skills">
|
||||
<FeatureHoverPattern
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ icon: Zap, title: "Front-End Development", description: "Expert in React, Next.js, and TypeScript for fast user interfaces." },
|
||||
{ icon: Shield, title: "Backend Engineering", description: "Strong skills in Node.js, PostgreSQL, and secure API architecture." },
|
||||
{ icon: Globe, title: "Responsive Design", description: "Mobile-first approach ensuring perfect experience on every device." }
|
||||
]}
|
||||
title="Core Technical Skills."
|
||||
description="Leveraging modern tech stacks to deliver high-quality, efficient, and scalable digital solutions."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "SaaS Dashboard",
|
||||
price: "View Project",
|
||||
variant: "web",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-trading-browsing-online-stock-investments-night_169016-57295.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "E-Commerce Site",
|
||||
price: "View Project",
|
||||
variant: "web",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/soft-nest-website-template_23-2151985943.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Banking App",
|
||||
price: "View Project",
|
||||
variant: "mobile",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-factor-authentication-mobile-device_23-2151997022.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Portfolio Site",
|
||||
price: "View Project",
|
||||
variant: "web",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/abstract-paper-cut-banner-template-backgrounds-paper-cut-shapes-template-banner_1142-9405.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Medical Booking",
|
||||
price: "View Project",
|
||||
variant: "web",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-workspace-with-technology_482257-115276.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Learning Platform",
|
||||
price: "View Project",
|
||||
variant: "web",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/education-application-knowledge-development-concept_53876-105721.jpg",
|
||||
},
|
||||
]}
|
||||
title="Selected Projects."
|
||||
description="A showcase of recent work focusing on functionality, aesthetics, and user impact."
|
||||
/>
|
||||
</div>
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "SaaS Dashboard", price: "View Project", variant: "web", imageSrc: "http://img.b2bpic.net/free-photo/man-trading-browsing-online-stock-investments-night_169016-57295.jpg" },
|
||||
{ id: "p2", name: "E-Commerce Site", price: "View Project", variant: "web", imageSrc: "http://img.b2bpic.net/free-psd/soft-nest-website-template_23-2151985943.jpg" },
|
||||
{ id: "p3", name: "Banking App", price: "View Project", variant: "mobile", imageSrc: "http://img.b2bpic.net/free-photo/two-factor-authentication-mobile-device_23-2151997022.jpg" },
|
||||
{ id: "p4", name: "Portfolio Site", price: "View Project", variant: "web", imageSrc: "http://img.b2bpic.net/free-vector/abstract-paper-cut-banner-template-backgrounds-paper-cut-shapes-template-banner_1142-9405.jpg" },
|
||||
{ id: "p5", name: "Medical Booking", price: "View Project", variant: "web", imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-workspace-with-technology_482257-115276.jpg" },
|
||||
{ id: "p6", name: "Learning Platform", price: "View Project", variant: "web", imageSrc: "http://img.b2bpic.net/free-photo/education-application-knowledge-development-concept_53876-105721.jpg" }
|
||||
]}
|
||||
title="Selected Projects."
|
||||
description="A showcase of recent work focusing on functionality, aesthetics, and user impact."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="experience" data-section="experience">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "99.9%",
|
||||
title: "Uptime",
|
||||
description: "Guaranteed performance for all apps.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/data-analysis-summary-graph-arrow-up_53876-133586.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "40ms",
|
||||
title: "Avg Response",
|
||||
description: "Optimized database queries.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-tech-governmental-cyber-security-room-without-staff-work_482257-94558.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "1.2M",
|
||||
title: "Users Served",
|
||||
description: "Platform capacity reached.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphics-composition_23-2148991203.jpg",
|
||||
},
|
||||
]}
|
||||
title="Growth and Milestones."
|
||||
description="Tracking impactful growth markers throughout my freelance career."
|
||||
/>
|
||||
</div>
|
||||
<div id="experience" data-section="experience">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "99.9%", title: "Uptime", description: "Guaranteed performance for all apps.", imageSrc: "http://img.b2bpic.net/free-photo/data-analysis-summary-graph-arrow-up_53876-133586.jpg" },
|
||||
{ id: "m2", value: "40ms", title: "Avg Response", description: "Optimized database queries.", imageSrc: "http://img.b2bpic.net/free-photo/high-tech-governmental-cyber-security-room-without-staff-work_482257-94558.jpg" },
|
||||
{ id: "m3", value: "1.2M", title: "Users Served", description: "Platform capacity reached.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphics-composition_23-2148991203.jpg" }
|
||||
]}
|
||||
title="Growth and Milestones."
|
||||
description="Tracking impactful growth markers throughout my freelance career."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
team={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex W.",
|
||||
role: "Senior Dev",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-graphic-designer-smiling_1170-992.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Jane D.",
|
||||
role: "UI Designer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-bright-curly-woman-dressed-blue-jacket-glasses-stands-with-serious-emotions-pink_291650-1099.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mark S.",
|
||||
role: "Product Manager",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technician-optimizing-data-center-equipment-maximum-efficiency_482257-117650.jpg",
|
||||
},
|
||||
]}
|
||||
title="Key Contributors."
|
||||
description="Often collaborating with industry specialists to expand project capabilities."
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
team={[
|
||||
{ id: "t1", name: "Alex W.", role: "Senior Dev", imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-graphic-designer-smiling_1170-992.jpg" },
|
||||
{ id: "t2", name: "Jane D.", role: "UI Designer", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-bright-curly-woman-dressed-blue-jacket-glasses-stands-with-serious-emotions-pink_291650-1099.jpg" },
|
||||
{ id: "t3", name: "Mark S.", role: "Product Manager", imageSrc: "http://img.b2bpic.net/free-photo/technician-optimizing-data-center-equipment-maximum-efficiency_482257-117650.jpg" }
|
||||
]}
|
||||
title="Key Contributors."
|
||||
description="Often collaborating with industry specialists to expand project capabilities."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alice M.",
|
||||
role: "Director",
|
||||
company: "TechStream",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Bob B.",
|
||||
role: "Founder",
|
||||
company: "StartupX",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Charlie C.",
|
||||
role: "CTO",
|
||||
company: "Innovate",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/user-profile-icon-front-side_187299-39596.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Diana D.",
|
||||
role: "Manager",
|
||||
company: "DataCorp",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/user-front-side-with-white-background_187299-40007.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Evan E.",
|
||||
role: "Product Lead",
|
||||
company: "GrowthIQ",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/linear-flat-people-faces-icon-set-social-media-avatar-userpic-profiles_1416-508.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="What Clients Say."
|
||||
description="Building lasting relationships through reliable, professional results."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alice M.", role: "Director", company: "TechStream", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg" },
|
||||
{ id: "2", name: "Bob B.", role: "Founder", company: "StartupX", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg" },
|
||||
{ id: "3", name: "Charlie C.", role: "CTO", company: "Innovate", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/user-profile-icon-front-side_187299-39596.jpg" },
|
||||
{ id: "4", name: "Diana D.", role: "Manager", company: "DataCorp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/user-front-side-with-white-background_187299-40007.jpg" },
|
||||
{ id: "5", name: "Evan E.", role: "Product Lead", company: "GrowthIQ", rating: 5, imageSrc: "http://img.b2bpic.net/free-vector/linear-flat-people-faces-icon-set-social-media-avatar-userpic-profiles_1416-508.jpg" }
|
||||
]}
|
||||
title="What Clients Say."
|
||||
description="Building lasting relationships through reliable, professional results."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How do you handle project timelines?",
|
||||
content: "I use agile methodology and detailed milestones.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What is your typical stack?",
|
||||
content: "React, Next.js, and TypeScript are my go-to tools.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Do you provide maintenance?",
|
||||
content: "Yes, I offer monthly maintenance and support packages.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked."
|
||||
description="Clear answers to standard questions about the hiring and development process."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "How do you handle project timelines?", content: "I use agile methodology and detailed milestones." },
|
||||
{ id: "f2", title: "What is your typical stack?", content: "React, Next.js, and TypeScript are my go-to tools." },
|
||||
{ id: "f3", title: "Do you provide maintenance?", content: "Yes, I offer monthly maintenance and support packages." }
|
||||
]}
|
||||
title="Frequently Asked."
|
||||
description="Clear answers to standard questions about the hiring and development process."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
text="Ready to discuss your project? Let's build something extraordinary together."
|
||||
buttons={[
|
||||
{
|
||||
text: "Email Me",
|
||||
href: "mailto:hello@example.com",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Ready to discuss your project? Let's build something extraordinary together."
|
||||
buttons={[{ text: "Email Me", href: "mailto:hello@example.com" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "https://twitter.com",
|
||||
},
|
||||
{
|
||||
label: "LinkedIn",
|
||||
href: "https://linkedin.com",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 DevFolio."
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Connect", items: [{ label: "Twitter", href: "https://twitter.com" }, { label: "LinkedIn", href: "https://linkedin.com" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 DevFolio."
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user