Add src/app/about/page.tsx

This commit is contained in:
2026-06-11 15:07:11 +00:00
parent a03b034f53
commit a6fc3da931

128
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,128 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import TeamCardTwo from "@/components/sections/team/TeamCardTwo";
import { Sparkles, Lightbulb, Target, Briefcase, Users, Award, TrendingUp, Twitter, Linkedin, Instagram, Dribbble } from "lucide-react";
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="Webild"
navItems={[
{ name: "Work", href: "/#work" },
{ name: "Services", href: "/#services" },
{ name: "About", href: "/about" },
{ name: "Contact", href: "/#contact" },
]}
button={{ text: "Get Started", href: "/#contact" }}
/>
<div id="agency-story" data-section="agency-story">
<TextSplitAbout
title="Our Story"
description={[
"Webild was founded with a passion for crafting exceptional digital experiences. What started as a small team of visionaries has grown into a full-service agency dedicated to transforming brands online. We believe in the power of design and technology to create meaningful connections.", "Over the years, we've partnered with diverse clients, from startups to established enterprises, helping them navigate the digital landscape and achieve their business goals. Our journey is defined by continuous learning, innovation, and a relentless pursuit of excellence in every project we undertake."
]}
useInvertedBackground={false}
/>
</div>
<div id="mission-values" data-section="mission-values">
<FeatureHoverPattern
title="Our Mission & Values"
description="Driving digital success through creativity, collaboration, and cutting-edge solutions."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
features={[
{
icon: Lightbulb,
title: "Innovation", description: "We constantly explore new technologies and creative approaches to deliver innovative solutions that set your brand apart."
},
{
icon: Target,
title: "Excellence", description: "We are committed to delivering the highest quality in every aspect of our work, from strategy to execution and support."
},
{
icon: Users,
title: "Collaboration", description: "We believe in working closely with our clients, fostering strong partnerships built on trust, transparency, and shared goals."
},
{
icon: Briefcase,
title: "Impact", description: "Our ultimate goal is to create digital products that not only look great but also drive measurable business growth and real-world impact."
}
]}
/>
</div>
<div id="team-overview" data-section="team-overview">
<TeamCardTwo
title="Meet Our Team"
description="The dedicated professionals bringing your digital vision to life."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
gridVariant="three-columns-all-equal-width"
members={[
{ id: "1", name: "Sarah Miller", role: "CEO & Founder", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp", imageAlt: "Sarah Miller", socialLinks: [{icon: Twitter, url: "#"}, {icon: Linkedin, url: "#"}] },
{ id: "2", name: "Michael Chen", role: "Lead Developer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp", imageAlt: "Michael Chen", socialLinks: [{icon: Twitter, url: "#"}, {icon: Linkedin, url: "#"}] },
{ id: "3", name: "Emily Rodriguez", role: "Creative Director", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp", imageAlt: "Emily Rodriguez", socialLinks: [{icon: Twitter, url: "#"}, {icon: Linkedin, url: "#"}] },
{ id: "4", name: "David Kim", role: "Marketing Specialist", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-4.webp", imageAlt: "David Kim", socialLinks: [{icon: Twitter, url: "#"}, {icon: Linkedin, url: "#"}] },
{ id: "5", name: "Jessica Lee", role: "UX/UI Designer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-5.webp", imageAlt: "Jessica Lee", socialLinks: [{icon: Twitter, url: "#"}, {icon: Linkedin, url: "#"}] },
{ id: "6", name: "Chris Brown", role: "Project Manager", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-6.webp", imageAlt: "Chris Brown", socialLinks: [{icon: Twitter, url: "#"}, {icon: Linkedin, url: "#"}] },
]}
/>
</div>
<FooterSimple
bottomLeftText="Webild"
bottomRightText="© 2026 | Webild"
columns={[
{
title: "Company", items: [
{ 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: "#" },
],
},
]}
/>
</ReactLenis>
</ThemeProvider>
);
}