From adf7b0504e0c2b6e851442d6f4dd39b244792d25 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 6 Apr 2026 13:31:28 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 262 ++++++++++++++++-------------------------------
 1 file changed, 87 insertions(+), 175 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index cc9349b..36f398b 100644
--- a/src/app/page.tsx
+++ b/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>
   );