Update src/app/page.tsx
This commit is contained in:
262
src/app/page.tsx
262
src/app/page.tsx
@@ -26,188 +26,100 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Skills",
|
||||
id: "skills",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "projects",
|
||||
},
|
||||
{
|
||||
name: "Experience",
|
||||
id: "experience",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="YVES SHEJA N.M."
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Skills", id: "skills" },
|
||||
{ name: "Projects", id: "projects" },
|
||||
{ name: "Experience", id: "experience" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="YVES SHEJA N.M."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
title="Yves Sheja N. M."
|
||||
description="Creative Developer | Problem Solver | Digital Builder"
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Portfolio",
|
||||
href: "#about",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fantasy-whale-sky_23-2151445912.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "canvas-reveal" }}
|
||||
title="Yves Sheja N. M."
|
||||
description="Creative Developer | Problem Solver | Digital Builder"
|
||||
buttons={[{ text: "Explore Portfolio", href: "#about" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fantasy-whale-sky_23-2151445912.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Crafting Immersive Digital Realities"
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Crafting Immersive Digital Realities"
|
||||
buttons={[{ text: "Contact Me", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="skills" data-section="skills">
|
||||
<FeatureCardSixteen
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Problem Solving",
|
||||
"Technology Innovation",
|
||||
"Performance Optimization",
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Web Development",
|
||||
"UI/UX Design",
|
||||
"Creative Coding",
|
||||
],
|
||||
}}
|
||||
title="Core Expertise"
|
||||
description="Skills evolving in real-time."
|
||||
/>
|
||||
</div>
|
||||
<div id="skills" data-section="skills">
|
||||
<FeatureCardSixteen
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{ items: ["Problem Solving", "Technology Innovation", "Performance Optimization"] }}
|
||||
positiveCard={{ items: ["Web Development", "UI/UX Design", "Creative Coding"] }}
|
||||
title="Core Expertise"
|
||||
description="Skills evolving in real-time."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardOne
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "AI Neural Nexus",
|
||||
price: "View Demo",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Crypto Insight",
|
||||
price: "View Demo",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stock-portfolio-computer-monitor-containing-collection-financial-assets_482257-93465.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Digital Canvas",
|
||||
price: "View Demo",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/business-corporation-template_23-2151402198.jpg?_wi=1",
|
||||
},
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="Interactive projects showcase."
|
||||
/>
|
||||
</div>
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardOne
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "AI Neural Nexus", price: "View Demo", imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg" },
|
||||
{ id: "p2", name: "Crypto Insight", price: "View Demo", imageSrc: "http://img.b2bpic.net/free-photo/stock-portfolio-computer-monitor-containing-collection-financial-assets_482257-93465.jpg" },
|
||||
{ id: "p3", name: "Digital Canvas", price: "View Demo", imageSrc: "http://img.b2bpic.net/free-psd/business-corporation-template_23-2151402198.jpg" },
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="Interactive projects showcase."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="experience" data-section="experience">
|
||||
<MetricCardEleven
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "2024",
|
||||
title: "Lead Developer",
|
||||
description: "Creative Agency Inc.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "2022",
|
||||
title: "Frontend Engineer",
|
||||
description: "Digital Lab",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stock-portfolio-computer-monitor-containing-collection-financial-assets_482257-93465.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "2020",
|
||||
title: "UI Designer",
|
||||
description: "Startup Studio",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/business-corporation-template_23-2151402198.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Professional Path"
|
||||
description="Milestones and creative growth."
|
||||
/>
|
||||
</div>
|
||||
<div id="experience" data-section="experience">
|
||||
<MetricCardEleven
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "2024", title: "Lead Developer", description: "Creative Agency Inc.", imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg" },
|
||||
{ id: "m2", value: "2022", title: "Frontend Engineer", description: "Digital Lab", imageSrc: "http://img.b2bpic.net/free-photo/stock-portfolio-computer-monitor-containing-collection-financial-assets_482257-93465.jpg" },
|
||||
{ id: "m3", value: "2020", title: "UI Designer", description: "Startup Studio", imageSrc: "http://img.b2bpic.net/free-psd/business-corporation-template_23-2151402198.jpg" },
|
||||
]}
|
||||
title="Professional Path"
|
||||
description="Milestones and creative growth."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "rotated-rays-animated-grid",
|
||||
}}
|
||||
text="Let's build the future together."
|
||||
buttons={[
|
||||
{
|
||||
text: "Email",
|
||||
href: "mailto:me@yves.dev",
|
||||
},
|
||||
{
|
||||
text: "LinkedIn",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
text: "GitHub",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "rotated-rays-animated-grid" }}
|
||||
text="Let's build the future together."
|
||||
buttons={[
|
||||
{ text: "Email", href: "mailto:me@yves.dev" },
|
||||
{ text: "LinkedIn", href: "#" },
|
||||
{ text: "GitHub", href: "#" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="YVES SHEJA N.M."
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "© 2024 All Rights Reserved",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="YVES SHEJA N.M."
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "© 2024 All Rights Reserved", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user