Add src/app/about/page.tsx

2026-06-02 11:42:30 +00:00
parent a7b658093a
commit 841ca7d026
1 changed files with 112 additions and 0 deletions
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -0,0 +1,112 @@
+"use client";
+
+import ReactLenis from "lenis/react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
+import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
+import TeamCardEleven from "@/components/sections/team/TeamCardEleven";
+import FooterBase from "@/components/sections/footer/FooterBase";
+import { Sparkles, ArrowUpRight, Users, Trophy } from "lucide-react";
+
+const NAV_ITEMS = [
+  { name: "Home", href: "/" },
+  { name: "Work", href: "/#work" },
+  { name: "Services", href: "/services" },
+  { name: "About", href: "/about" },
+  { name: "Contact", href: "/#contact" }
+];
+
+const FOOTER_COLUMNS = [
+  {
+    title: "Company",    items: [
+      { label: "Home", href: "/" },
+      { label: "About", href: "/about" },
+      { label: "Services", href: "/services" },
+      { label: "Work", href: "/#work" },
+      { label: "Contact", href: "/#contact" },
+    ],
+  },
+  {
+    title: "Services",    items: [
+      { label: "Web Development", href: "/services" },
+      { label: "SEO", href: "/services" },
+      { label: "Branding", href: "/services" },
+      { label: "UI/UX Design", href: "/services" },
+    ],
+  },
+  {
+    title: "Connect",    items: [
+      { label: "Twitter", href: "#" },
+      { label: "LinkedIn", href: "#" },
+      { label: "Instagram", href: "#" },
+      { label: "Dribbble", href: "#" },
+    ],
+  },
+];
+
+export default function AboutPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="text-stagger"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="medium"
+      sizing="medium"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="metallic"
+      secondaryButtonStyle="glass"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <NavbarLayoutFloatingOverlay
+          brandName="HoB Media"
+          navItems={NAV_ITEMS}
+          button={{ text: "Get Started", href: "/#contact" }}
+        />
+        <MetricSplitMediaAbout
+          title="About HoB Media"
+          description="HoB Media is a full-service digital agency dedicated to crafting compelling online experiences. We partner with businesses to build impactful brands, drive growth, and achieve measurable results through innovative web design, development, and marketing strategies."
+          metrics={[
+            { value: "10+", title: "Years Experience" },
+            { value: "200+", title: "Projects Completed" },
+            { value: "95%", title: "Client Retention" },
+          ]}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp"
+          imageAlt="HoB Media team working"
+          mediaAnimation="slide-up"
+          useInvertedBackground={false}
+          tag="Our Story"
+          tagIcon={Sparkles}
+        />
+        <TeamCardEleven
+          title="Meet Our Team"
+          description="Our diverse team of experts brings passion, creativity, and technical prowess to every project."
+          groups={[
+            {
+              id: "leadership",              groupTitle: "Leadership",              members: [
+                { id: "1", title: "Maria Santos", subtitle: "CEO & Founder", detail: "Visionary leader driving innovation.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp", imageAlt: "Maria Santos" },
+                { id: "2", title: "John Doe", subtitle: "Creative Director", detail: "Crafting stunning visual narratives.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp", imageAlt: "John Doe" },
+              ],
+            },
+            {
+              id: "development",              groupTitle: "Development & Marketing",              members: [
+                { id: "3", title: "Sarah Lee", subtitle: "Lead Developer", detail: "Building robust and scalable solutions.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp", imageAlt: "Sarah Lee" },
+                { id: "4", title: "Michael Chen", subtitle: "SEO Specialist", detail: "Boosting online visibility and traffic.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-4.webp", imageAlt: "Michael Chen" },
+              ],
+            },
+          ]}
+          animationType="slide-up"
+          useInvertedBackground={true}
+          tag="Our People"
+          tagIcon={Users}
+        />
+        <FooterBase
+          logoText="HoB Media"
+          copyrightText="© 2026 | HoB Media"
+          columns={FOOTER_COLUMNS}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}