Update src/app/page.tsx
This commit is contained in:
287
src/app/page.tsx
287
src/app/page.tsx
@@ -31,24 +31,13 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "projects",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Projects", id: "projects" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Portfolio"
|
||||
button={{ text: "Get in touch", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -56,39 +45,15 @@ export default function LandingPage() {
|
||||
<HeroOverlay
|
||||
title="Building Digital Experiences"
|
||||
description="I craft high-performance, visually stunning software and digital products with a focus on precision and modern design."
|
||||
buttons={[
|
||||
{
|
||||
text: "View Projects",
|
||||
href: "#projects",
|
||||
},
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99745.jpg?_wi=1"
|
||||
buttons={[{ text: "View Projects", href: "#projects" }, { text: "Contact Me", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99745.jpg"
|
||||
showBlur={true}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/professional-woman-smiling_23-2152009549.jpg",
|
||||
alt: "Client avatar 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cheerful-young-businesswoman-smiling-camera_74855-4022.jpg",
|
||||
alt: "Client avatar 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",
|
||||
alt: "Client avatar 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-handsome-young-office-worker-glasses-suit-smiling-camera-looking-happy-white_1258-173667.jpg",
|
||||
alt: "Client avatar 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-confident-male-employee-white-collar-shirt-smiling-camera-standing-self-assured-against-studio-background_1258-26761.jpg",
|
||||
alt: "Client avatar 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/professional-woman-smiling_23-2152009549.jpg", alt: "Client avatar 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/cheerful-young-businesswoman-smiling-camera_74855-4022.jpg", alt: "Client avatar 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg", alt: "Client avatar 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/closeup-handsome-young-office-worker-glasses-suit-smiling-camera-looking-happy-white_1258-173667.jpg", alt: "Client avatar 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/close-up-confident-male-employee-white-collar-shirt-smiling-camera-standing-self-assured-against-studio-background_1258-26761.jpg", alt: "Client avatar 5" },
|
||||
]}
|
||||
avatarText="Trusted by 100+ clients"
|
||||
/>
|
||||
@@ -101,20 +66,11 @@ export default function LandingPage() {
|
||||
title="About My Journey"
|
||||
description="I am a dedicated developer passionate about creating intuitive user interfaces and scalable backends using the latest technologies."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Expert Development",
|
||||
description: "Writing clean, efficient, and scalable code.",
|
||||
},
|
||||
{
|
||||
title: "UI/UX Design",
|
||||
description: "Crafting pixel-perfect designs with purpose.",
|
||||
},
|
||||
{
|
||||
title: "Problem Solving",
|
||||
description: "Turning complex challenges into simple solutions.",
|
||||
},
|
||||
{ title: "Expert Development", description: "Writing clean, efficient, and scalable code." },
|
||||
{ title: "UI/UX Design", description: "Crafting pixel-perfect designs with purpose." },
|
||||
{ title: "Problem Solving", description: "Turning complex challenges into simple solutions." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
@@ -126,42 +82,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "SaaS Dashboard",
|
||||
price: "View Project",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150861872.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "E-Commerce App",
|
||||
price: "View Project",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-ordering-groceries-online_23-2149722290.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Fintech Platform",
|
||||
price: "View Project",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-economist-holding-paper_23-2150062349.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Health Tracker",
|
||||
price: "View Project",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/charming-asian-girl-with-smartphone-hand-pointing-finger-white-screen-great-offer-mobile-app-advertisement-product-placement_549566-1047.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Social Connect",
|
||||
price: "View Project",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/design-creative-visual-trendy-ideas-style-purpose_53876-16492.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "AI Analytics",
|
||||
price: "View Project",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/homepage-seen-computer-screen_23-2149416724.jpg",
|
||||
},
|
||||
{ id: "p1", name: "SaaS Dashboard", price: "View Project", imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150861872.jpg" },
|
||||
{ id: "p2", name: "E-Commerce App", price: "View Project", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-ordering-groceries-online_23-2149722290.jpg" },
|
||||
{ id: "p3", name: "Fintech Platform", price: "View Project", imageSrc: "http://img.b2bpic.net/free-photo/side-view-economist-holding-paper_23-2150062349.jpg" },
|
||||
{ id: "p4", name: "Health Tracker", price: "View Project", imageSrc: "http://img.b2bpic.net/free-photo/charming-asian-girl-with-smartphone-hand-pointing-finger-white-screen-great-offer-mobile-app-advertisement-product-placement_549566-1047.jpg" },
|
||||
{ id: "p5", name: "Social Connect", price: "View Project", imageSrc: "http://img.b2bpic.net/free-photo/design-creative-visual-trendy-ideas-style-purpose_53876-16492.jpg" },
|
||||
{ id: "p6", name: "AI Analytics", price: "View Project", imageSrc: "http://img.b2bpic.net/free-photo/homepage-seen-computer-screen_23-2149416724.jpg" },
|
||||
]}
|
||||
title="Selected Projects"
|
||||
description="A showcase of recent work and innovative designs."
|
||||
@@ -173,27 +99,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
tag: "Web",
|
||||
title: "Web Development",
|
||||
subtitle: "Modern stack",
|
||||
description: "Building lightning-fast web applications.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-taking-notes-office_23-2149749872.jpg",
|
||||
},
|
||||
{
|
||||
tag: "UI",
|
||||
title: "UX Design",
|
||||
subtitle: "Figma based",
|
||||
description: "Creating designs that users love.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-ecological-landing-page-coffee-table_23-2151903287.jpg",
|
||||
},
|
||||
{
|
||||
tag: "Dev",
|
||||
title: "Fullstack API",
|
||||
subtitle: "Scalable",
|
||||
description: "Secure and performant backends.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-boards-mdf-material_23-2149418531.jpg",
|
||||
},
|
||||
{ tag: "Web", title: "Web Development", subtitle: "Modern stack", description: "Building lightning-fast web applications.", imageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-taking-notes-office_23-2149749872.jpg" },
|
||||
{ tag: "UI", title: "UX Design", subtitle: "Figma based", description: "Creating designs that users love.", imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-ecological-landing-page-coffee-table_23-2151903287.jpg" },
|
||||
{ tag: "Dev", title: "Fullstack API", subtitle: "Scalable", description: "Secure and performant backends.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-boards-mdf-material_23-2149418531.jpg" },
|
||||
]}
|
||||
title="My Expertise"
|
||||
description="Delivering high-quality services to help your business grow."
|
||||
@@ -207,21 +115,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "50+",
|
||||
description: "Successful Projects",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100%",
|
||||
description: "Client Satisfaction",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "24/7",
|
||||
description: "Performance Support",
|
||||
},
|
||||
{ id: "m1", value: "50+", description: "Successful Projects" },
|
||||
{ id: "m2", value: "100%", description: "Client Satisfaction" },
|
||||
{ id: "m3", value: "24/7", description: "Performance Support" },
|
||||
]}
|
||||
title="Impact In Numbers"
|
||||
description="Hard evidence of the value I bring to each project."
|
||||
@@ -233,61 +129,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
date: "Jan 2024",
|
||||
title: "CEO",
|
||||
quote: "Exceptional work and attention to detail.",
|
||||
tag: "Success",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-smiling-posing-purple-wall_176420-2852.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99745.jpg?_wi=2",
|
||||
imageAlt: "professional portrait photo",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Mike D.",
|
||||
date: "Feb 2024",
|
||||
title: "Founder",
|
||||
quote: "A true professional who delivers on time.",
|
||||
tag: "Quality",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-man-white-shirt_23-2152009539.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg?_wi=2",
|
||||
imageAlt: "professional portrait photo",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Anna L.",
|
||||
date: "Mar 2024",
|
||||
title: "Manager",
|
||||
quote: "Incredible communication and output quality.",
|
||||
tag: "Expert",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/confident-entrepreneur-looking-camera-with-arms-folded-smiling_1098-18840.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150861872.jpg?_wi=2",
|
||||
imageAlt: "professional portrait photo",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Tom K.",
|
||||
date: "Apr 2024",
|
||||
title: "Director",
|
||||
quote: "Transformed our digital vision perfectly.",
|
||||
tag: "Creative",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-taking-selfie-photo-winking_1262-18343.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-young-asian-businesswoman_1262-1510.jpg",
|
||||
imageAlt: "professional portrait photo",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jane W.",
|
||||
date: "May 2024",
|
||||
title: "Startup Lead",
|
||||
quote: "Highly recommended for any complex task.",
|
||||
tag: "Reliable",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-man-ordering-groceries-online_23-2149722290.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-economist-holding-paper_23-2150062349.jpg?_wi=2",
|
||||
imageAlt: "professional portrait photo",
|
||||
},
|
||||
{ id: "t1", name: "Sarah J.", date: "Jan 2024", title: "CEO", quote: "Exceptional work and attention to detail.", tag: "Success", avatarSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-smiling-posing-purple-wall_176420-2852.jpg", imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99745.jpg", imageAlt: "professional portrait photo" },
|
||||
{ id: "t2", name: "Mike D.", date: "Feb 2024", title: "Founder", quote: "A true professional who delivers on time.", tag: "Quality", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-man-white-shirt_23-2152009539.jpg", imageSrc: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg", imageAlt: "professional portrait photo" },
|
||||
{ id: "t3", name: "Anna L.", date: "Mar 2024", title: "Manager", quote: "Incredible communication and output quality.", tag: "Expert", avatarSrc: "http://img.b2bpic.net/free-photo/confident-entrepreneur-looking-camera-with-arms-folded-smiling_1098-18840.jpg", imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150861872.jpg", imageAlt: "professional portrait photo" },
|
||||
{ id: "t4", name: "Tom K.", date: "Apr 2024", title: "Director", quote: "Transformed our digital vision perfectly.", tag: "Creative", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-woman-taking-selfie-photo-winking_1262-18343.jpg", imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-young-asian-businesswoman_1262-1510.jpg", imageAlt: "professional portrait photo" },
|
||||
{ id: "t5", name: "Jane W.", date: "May 2024", title: "Startup Lead", quote: "Highly recommended for any complex task.", tag: "Reliable", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-man-ordering-groceries-online_23-2149722290.jpg", imageSrc: "http://img.b2bpic.net/free-photo/side-view-economist-holding-paper_23-2150062349.jpg", imageAlt: "professional portrait photo" },
|
||||
]}
|
||||
title="Client Feedback"
|
||||
description="What partners have to say about working with me."
|
||||
@@ -299,21 +145,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "What is your typical turnaround?",
|
||||
content: "It depends on the project scope, usually 2-4 weeks.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Can you handle big projects?",
|
||||
content: "Yes, I am comfortable scaling with larger teams.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "What tools do you use?",
|
||||
content: "Next.js, TypeScript, and modern CSS tools.",
|
||||
},
|
||||
{ id: "q1", title: "What is your typical turnaround?", content: "It depends on the project scope, usually 2-4 weeks." },
|
||||
{ id: "q2", title: "Can you handle big projects?", content: "Yes, I am comfortable scaling with larger teams." },
|
||||
{ id: "q3", title: "What tools do you use?", content: "Next.js, TypeScript, and modern CSS tools." },
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Clear answers to help you understand my process."
|
||||
@@ -327,25 +161,10 @@ export default function LandingPage() {
|
||||
title="Let's Collaborate"
|
||||
description="Ready to kickstart your next project? Get in touch today."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Tell me about your project...",
|
||||
rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
textarea={{ name: "message", placeholder: "Tell me about your project...", rows: 4, required: true }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-shot-female-leaning-white-wall-building-with-black-floor_181624-20509.jpg"
|
||||
/>
|
||||
</div>
|
||||
@@ -353,32 +172,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Menu",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "#projects",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "LinkedIn",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Menu", items: [{ label: "About", href: "#about" }, { label: "Projects", href: "#projects" }] },
|
||||
{ title: "Social", items: [{ label: "Twitter", href: "#" }, { label: "LinkedIn", href: "#" }] },
|
||||
]}
|
||||
logoText="Portfolio"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user