Add src/app/about-me/page.tsx

2026-03-12 20:02:04 +00:00
parent 85c2e1fee9
commit 4e8ec15971
1 changed files with 103 additions and 0 deletions
--- a/src/app/about-me/page.tsx
+++ b/src/app/about-me/page.tsx
@@ -0,0 +1,103 @@
+"use client"
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
+import ContactText from '@/components/sections/contact/ContactText';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+import { MapPin, Users, Award, Zap } from 'lucide-react';
+
+export default function AboutMePage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="rounded"
+      contentWidth="small"
+      sizing="medium"
+      background="floatingGradient"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="layered"
+      headingFontWeight="bold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          navItems={[
+            { name: "Work", id: "work" },
+            { name: "About", id: "/about-me" },
+            { name: "Services", id: "services" },
+            { name: "Results", id: "results" }
+          ]}
+          brandName="Hidde Digital"
+          button={{ text: "Get Started", href: "#contact" }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroSplitKpi
+          title="About Me"
+          description="I'm a 20-year-old student-athlete from The Hague, Netherlands, currently studying in the United States. Combining athletic dedication with academic excellence and a passion for creating exceptional digital experiences."
+          background={{ variant: "plain" }}
+          kpis={[
+            { value: "The Hague", label: "From Netherlands" },
+            { value: "20", label: "Years Old" },
+            { value: "USA", label: "Studying Here" }
+          ]}
+          enableKpiAnimation={true}
+          tag="About Me"
+          tagIcon={Zap}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AqXgsnzzGzY8t8KhASFkum85OC/uploaded-1773345682402-6uuhacve.jpg"
+          imageAlt="Profile picture"
+          mediaAnimation="slide-up"
+          imagePosition="right"
+        />
+      </div>
+
+      <div id="about" data-section="about">
+        <ContactText
+          text="I'm a passionate student-athlete balancing rigorous academics and competitive sports while pursuing my dreams in the United States. Originally from The Hague, Netherlands, I bring a unique perspective shaped by European heritage and American ambition. My commitment to excellence extends beyond the playing field into every project I undertake, whether it's web design, digital strategy, or building meaningful connections."
+          animationType="reveal-blur"
+          buttons={[
+            { text: "Get in Touch", href: "#contact" }
+          ]}
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterMedia
+          imageSrc="http://img.b2bpic.net/free-vector/business-workshop-social-media-pack-landing-page_23-2149381280.jpg?_wi=2"
+          imageAlt="Portfolio showcase"
+          columns={[
+            {
+              title: "Product",              items: [
+                { label: "Web Design", href: "/#services" },
+                { label: "SEO Optimization", href: "/#services" },
+                { label: "Mobile Design", href: "/#services" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About Me", href: "/about-me" },
+                { label: "Our Work", href: "/#work" },
+                { label: "Testimonials", href: "/#testimonials" }
+              ]
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy Policy", href: "#" },
+                { label: "Terms of Service", href: "#" },
+                { label: "Contact", href: "#contact" }
+              ]
+            }
+          ]}
+          logoText="Hidde Digital"
+          copyrightText="© 2025 Hidde Digital. All rights reserved."
+        />
+      </div>
+    </ThemeProvider>
+  );
+}