2 Commits

Author SHA1 Message Date
62bfe18287 Update src/app/page.tsx 2026-05-12 23:06:24 +00:00
726ae8f1c3 Merge version_1 into main
Merge version_1 into main
2026-05-12 23:05:21 +00:00

View File

@@ -31,21 +31,13 @@ export default function LandingPage() {
<NavbarStyleApple <NavbarStyleApple
navItems={[ navItems={[
{ {
name: "About", name: "About", id: "about"},
id: "about",
},
{ {
name: "Services", name: "Services", id: "services"},
id: "services",
},
{ {
name: "Testimonials", name: "Testimonials", id: "testimonials"},
id: "testimonials",
},
{ {
name: "Contact", name: "Contact", id: "contact"},
id: "contact",
},
]} ]}
brandName="Chowai Staifi" brandName="Chowai Staifi"
/> />
@@ -54,15 +46,12 @@ export default function LandingPage() {
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboardScroll <HeroBillboardScroll
background={{ background={{
variant: "gradient-bars", variant: "gradient-bars"}}
}}
title="Welcome to my portfolio" title="Welcome to my portfolio"
description="Hi, I'm Chowai Staifi. I help brands and businesses build impactful digital experiences." description="Hi, I'm Chowai Staifi. I help brands and businesses build impactful digital experiences."
buttons={[ buttons={[
{ {
text: "View Projects", text: "View Projects", href: "#services"},
href: "#services",
},
]} ]}
imageSrc="http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=1" imageSrc="http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=1"
imageAlt="professional headshot photography neutral" imageAlt="professional headshot photography neutral"
@@ -76,13 +65,9 @@ export default function LandingPage() {
description="Passionate about creating elegant, functional, and user-centered designs. I combine aesthetics with technical precision to deliver results." description="Passionate about creating elegant, functional, and user-centered designs. I combine aesthetics with technical precision to deliver results."
metrics={[ metrics={[
{ {
value: "100+", value: "100+", title: "Projects Completed"},
title: "Projects Completed",
},
{ {
value: "5+", value: "5+", title: "Years Experience"},
title: "Years Experience",
},
]} ]}
imageSrc="http://img.b2bpic.net/free-photo/empty-old-fashioned-library-filled-with-vintage-decorations-wooden-desks_482257-120070.jpg?_wi=1" imageSrc="http://img.b2bpic.net/free-photo/empty-old-fashioned-library-filled-with-vintage-decorations-wooden-desks_482257-120070.jpg?_wi=1"
mediaAnimation="blur-reveal" mediaAnimation="blur-reveal"
@@ -98,35 +83,17 @@ export default function LandingPage() {
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ {
id: "f1", id: "f1", title: "Brand Design", tags: [
title: "Brand Design", "Strategy", "Visuals"],
tags: [ imageSrc: "http://img.b2bpic.net/free-photo/stylish-pretty-gilr-with-freckles-blonde-loose-hair-looking-camera-with-joyful-happy-facial-expression-attractive-young-woman-natural-beauty-posing-isolated-blank-copy-space-studio-wall_343059-4198.jpg", imageAlt: "Stylish pretty gilr with freckles and blonde loose hair looking at camera with joyful happy facial expression. Attractive young woman of natural beauty posing isolated at blank copy space studio wall"},
"Strategy",
"Visuals",
],
imageSrc: "http://img.b2bpic.net/free-photo/stylish-pretty-gilr-with-freckles-blonde-loose-hair-looking-camera-with-joyful-happy-facial-expression-attractive-young-woman-natural-beauty-posing-isolated-blank-copy-space-studio-wall_343059-4198.jpg",
imageAlt: "Stylish pretty gilr with freckles and blonde loose hair looking at camera with joyful happy facial expression. Attractive young woman of natural beauty posing isolated at blank copy space studio wall",
},
{ {
id: "f2", id: "f2", title: "Web Development", tags: [
title: "Web Development", "React", "Next.js"],
tags: [ imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=2", imageAlt: "Stylish pretty gilr with freckles and blonde loose hair looking at camera with joyful happy facial expression. Attractive young woman of natural beauty posing isolated at blank copy space studio wall"},
"React",
"Next.js",
],
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=2",
imageAlt: "Stylish pretty gilr with freckles and blonde loose hair looking at camera with joyful happy facial expression. Attractive young woman of natural beauty posing isolated at blank copy space studio wall",
},
{ {
id: "f3", id: "f3", title: "UI/UX Design", tags: [
title: "UI/UX Design", "Research", "Prototyping"],
tags: [ imageSrc: "http://img.b2bpic.net/free-photo/empty-old-fashioned-library-filled-with-vintage-decorations-wooden-desks_482257-120070.jpg?_wi=2", imageAlt: "Stylish pretty gilr with freckles and blonde loose hair looking at camera with joyful happy facial expression. Attractive young woman of natural beauty posing isolated at blank copy space studio wall"},
"Research",
"Prototyping",
],
imageSrc: "http://img.b2bpic.net/free-photo/empty-old-fashioned-library-filled-with-vintage-decorations-wooden-desks_482257-120070.jpg?_wi=2",
imageAlt: "Stylish pretty gilr with freckles and blonde loose hair looking at camera with joyful happy facial expression. Attractive young woman of natural beauty posing isolated at blank copy space studio wall",
},
]} ]}
title="My Expertise" title="My Expertise"
description="From concept to delivery, I provide comprehensive design and development services." description="From concept to delivery, I provide comprehensive design and development services."
@@ -140,40 +107,15 @@ export default function LandingPage() {
useInvertedBackground={true} useInvertedBackground={true}
testimonials={[ testimonials={[
{ {
id: "1", id: "1", name: "Sarah J.", role: "Founder", testimonial: "Exceptional work, delivered on time and exceeded expectations.", imageSrc: "http://img.b2bpic.net/free-photo/middle-age-man-with-grey-hair-dark-color-shirt-looking-something-laughing-out-pointing-with-index-finger-something-someone-standing-brown-background_141793-133931.jpg"},
name: "Sarah J.",
role: "Founder",
testimonial: "Exceptional work, delivered on time and exceeded expectations.",
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-man-with-grey-hair-dark-color-shirt-looking-something-laughing-out-pointing-with-index-finger-something-someone-standing-brown-background_141793-133931.jpg",
},
{ {
id: "2", id: "2", name: "Michael C.", role: "Manager", testimonial: "Highly professional and extremely talented designer.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-elegant-suit-glasses-correct-his-jacket-while-standing-against-skyscraper-background_613910-4110.jpg"},
name: "Michael C.",
role: "Manager",
testimonial: "Highly professional and extremely talented designer.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-elegant-suit-glasses-correct-his-jacket-while-standing-against-skyscraper-background_613910-4110.jpg",
},
{ {
id: "3", id: "3", name: "Emily R.", role: "CEO", testimonial: "A true partner in our digital growth strategy.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-charming-african-guy-smiling-boyfriend-waiting-date-head-hunter-dream-standing-white-wall_176420-12540.jpg"},
name: "Emily R.",
role: "CEO",
testimonial: "A true partner in our digital growth strategy.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-happy-charming-african-guy-smiling-boyfriend-waiting-date-head-hunter-dream-standing-white-wall_176420-12540.jpg",
},
{ {
id: "4", id: "4", name: "David K.", role: "Product Lead", testimonial: "Attention to detail is unmatched. Great experience.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beauty-businesswoman-leaning-against-brick-wall_613910-773.jpg"},
name: "David K.",
role: "Product Lead",
testimonial: "Attention to detail is unmatched. Great experience.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beauty-businesswoman-leaning-against-brick-wall_613910-773.jpg",
},
{ {
id: "5", id: "5", name: "Lisa M.", role: "Designer", testimonial: "Innovative solutions that set us apart from competitors.", imageSrc: "http://img.b2bpic.net/free-photo/african-guy-wears-trendy-wristwatch-posing-with-smile-near-beige-wall-outdoor-portrait-black-man-good-mood-standing-with-arms-crossed_197531-21794.jpg"},
name: "Lisa M.",
role: "Designer",
testimonial: "Innovative solutions that set us apart from competitors.",
imageSrc: "http://img.b2bpic.net/free-photo/african-guy-wears-trendy-wristwatch-posing-with-smile-near-beige-wall-outdoor-portrait-black-man-good-mood-standing-with-arms-crossed_197531-21794.jpg",
},
]} ]}
title="What They Say" title="What They Say"
description="Building lasting relationships with clients through trust and quality work." description="Building lasting relationships with clients through trust and quality work."
@@ -187,20 +129,11 @@ export default function LandingPage() {
tag="Milestones" tag="Milestones"
metrics={[ metrics={[
{ {
id: "m1", id: "m1", value: "50+", description: "Happy Clients"},
value: "50+",
description: "Happy Clients",
},
{ {
id: "m2", id: "m2", value: "120+", description: "Successful Launches"},
value: "120+",
description: "Successful Launches",
},
{ {
id: "m3", id: "m3", value: "15k+", description: "Coffee Cups"},
value: "15k+",
description: "Coffee Cups",
},
]} ]}
/> />
</div> </div>
@@ -211,20 +144,11 @@ export default function LandingPage() {
useInvertedBackground={true} useInvertedBackground={true}
faqs={[ faqs={[
{ {
id: "q1", id: "q1", title: "How do you work?", content: "I follow a collaborative and iterative design process."},
title: "How do you work?",
content: "I follow a collaborative and iterative design process.",
},
{ {
id: "q2", id: "q2", title: "Timeline expectation?", content: "Depending on project complexity, timelines vary."},
title: "Timeline expectation?",
content: "Depending on project complexity, timelines vary.",
},
{ {
id: "q3", id: "q3", title: "Ongoing support?", content: "Yes, I offer maintenance packages for all projects."},
title: "Ongoing support?",
content: "Yes, I offer maintenance packages for all projects.",
},
]} ]}
title="Common Questions" title="Common Questions"
description="Here's what you need to know about working with me." description="Here's what you need to know about working with me."
@@ -239,16 +163,13 @@ export default function LandingPage() {
<ContactCTA <ContactCTA
useInvertedBackground={false} useInvertedBackground={false}
background={{ background={{
variant: "sparkles-gradient", variant: "sparkles-gradient"}}
}}
tag="Let's Connect" tag="Let's Connect"
title="Ready to get started?" title="Ready to get started?"
description="I'm always open to discussing new projects and opportunities. Reach out!" description="I'm always open to discussing new projects and opportunities. Reach out!"
buttons={[ buttons={[
{ {
text: "Contact Me", text: "Contact Me", href: "mailto:hello@example.com"},
href: "mailto:hello@example.com",
},
]} ]}
/> />
</div> </div>
@@ -258,25 +179,17 @@ export default function LandingPage() {
logoText="Chowai Staifi" logoText="Chowai Staifi"
columns={[ columns={[
{ {
title: "Navigation", title: "Navigation", items: [
items: [
{ {
label: "About", label: "About", href: "#about"},
href: "#about",
},
{ {
label: "Services", label: "Services", href: "#services"},
href: "#services",
},
], ],
}, },
{ {
title: "Legal", title: "Legal", items: [
items: [
{ {
label: "Privacy Policy", label: "Privacy Policy", href: "#"},
href: "#",
},
], ],
}, },
]} ]}
@@ -285,4 +198,4 @@ export default function LandingPage() {
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }