Update src/app/about/page.tsx

This commit is contained in:
2026-03-13 15:52:36 +00:00
parent 60f9e2af5f
commit 415dbd397f

View File

@@ -1,24 +1,24 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { BookOpen, Target, Eye, CheckCircle, ArrowRight, Zap } from "lucide-react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Smartphone, Zap, MapPin, Target, AlertCircle, TrendingUp, CheckCircle, Eye, Mail, Sparkles, Lightbulb, Users, Rocket } from 'lucide-react';
const navItems = [
{ name: "Services", id: "services" },
{ name: "Work", id: "work" },
{ name: "About", id: "about" },
{ name: "Pricing", id: "pricing" },
{ name: "Contact", id: "contact" },
];
export default function AboutPage() {
const navItems = [
{ name: "Services", id: "services" },
{ name: "Work", id: "work" },
{ name: "About", id: "about" },
{ name: "Pricing", id: "pricing" },
{ name: "Contact", id: "contact" },
];
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
@@ -32,86 +32,139 @@ export default function AboutPage() {
secondaryButtonStyle="layered"
headingFontWeight="light"
>
{/* Navbar */}
<div id="nav" data-section="nav">
<NavbarStyleApple
<NavbarStyleApple
brandName="Elevate Web"
navItems={navItems}
/>
</div>
{/* Hero Section */}
<div id="hero-about" data-section="hero-about">
<HeroBillboard
title="Built by an Athlete. Designed for Results."
description="Elevate Web is a small studio with a performance mindset—clarity, discipline, and measurable outcomes."
title="We Build Websites That Generate More Leads"
description="Elevate Web is focused on one goal: creating conversion-optimized websites for gyms, sports clubs, and coaches that look premium, load fast, and drive inquiries."
background={{ variant: "gradient-bars" }}
buttons={[
{
text: "Book a Free Website Review", href: "/contact"},
text: "Book a Free Review", href: "/contact"
}
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=10wr5n"
imageAlt="Elevate Web founder"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qkozd5&_wi=1"
imageAlt="Elevate Web team designing premium websites"
mediaAnimation="slide-up"
/>
</div>
<div id="about-content" data-section="about-content">
<TestimonialAboutCard
tag="Our Story"
tagIcon={BookOpen}
tagAnimation="slide-up"
{/* Our Mission Section */}
<div id="mission-about" data-section="mission-about">
<MetricSplitMediaAbout
title="Why Elevate Web Exists"
description="Most gyms and sports businesses have outdated sites that don't reflect the quality of their service."
subdescription="We build modern websites that make it easy for visitors to understand your offer and take action. No fluff, no jargon—just results."
icon={Target}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qgmuof&_wi=2"
imageAlt="Modern gym facility representing quality service"
description="Most fitness businesses are stuck with slow, unclear websites that leak leads. We fix that by building fast, focused sites designed to convert."
tag="Our Mission"
tagIcon={Lightbulb}
tagAnimation="slide-up"
metrics={[
{
value: "13 weeks", title: "Fast builds"
},
{
value: "100% conversion-focused", title: "Every page designed to drive action"
},
{
value: "Premium results", title: "No templates, no bloat"
}
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c4z8f9"
imageAlt="Our approach to building conversion-focused websites"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="about-values" data-section="about-values">
<MetricCardOne
title="Our Approach"
description="Three principles that guide every project."
gridVariant="uniform-all-items-equal"
{/* Our Process Section */}
<div id="process-about" data-section="process-about">
<FeatureCardSeven
title="How We Build Your Website"
description="A clear, focused process designed to ship fast without compromise."
tag="The Process"
tagIcon={Rocket}
tagAnimation="slide-up"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
buttons={[
{
id: "value-clarity", value: "Clarity", title: "Over Hype", description: "Clear positioning and honest messaging", icon: Eye,
text: "Start Your Project", href: "/contact"
}
]}
features={[
{
id: 1,
title: "Discovery & Strategy", description: "We analyze your current site, understand your goals, and identify the fastest path to more inquiries. This guides every design decision.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c4z8f9&_wi=1", imageAlt: "Discovery and strategy phase"
},
{
id: "value-conversion", value: "Conversion", title: "By Design", description: "Every detail drives action", icon: CheckCircle,
id: 2,
title: "Design & Copy Structure", description: "Clean, uncluttered layouts with clear messaging. We build conversion funnels that guide visitors to one action: contact you.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c4z8f9&_wi=2", imageAlt: "Design and copy structure phase"
},
{
id: "value-speed", value: "Speed &", title: "Simplicity", description: "Fast builds, clean code", icon: Zap,
id: 3,
title: "Build & Optimize", description: "Modern tech stack. Every page tested for speed, clarity, and conversion. No bloated plugins, no slow code.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c4z8f9&_wi=3", imageAlt: "Build and optimization phase"
},
{
id: 4,
title: "Launch & Support", description: "Your site goes live with analytics ready. We provide launch support, troubleshooting, and actionable optimization guidance.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=c4z8f9&_wi=4", imageAlt: "Launch and support phase"
}
]}
/>
</div>
<div id="about-cta" data-section="about-cta">
<ContactFaq
ctaTitle="If Your Website Isn't Bringing Leads, Let's Fix That."
ctaDescription="Start with a free review and get a clear improvement plan in 2448 hours."
ctaButton={{
text: "Book a Free Website Review", href: "/contact"}}
ctaIcon={ArrowRight}
faqs={[
{
id: "info-a1", title: "Direct Communication", content: "You work directly with the founder. No agencies, no middlemen."},
{
id: "info-a2", title: "Fast Iterations", content: "We move quickly and respond to feedback within 24 hours."},
{
id: "info-a3", title: "Clear Deliverables", content: "You know exactly what you're getting and when it ships."},
]}
animationType="blur-reveal"
{/* Why Gyms Trust Us Section */}
<div id="trust-about" data-section="trust-about">
<TestimonialCardOne
title="Why Gym Owners & Coaches Choose Elevate Web"
description="Owners want results, not excuses. Here's what they say after working with us."
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "testimonial-1", name: "Sarah Mitchell", role: "Gym Owner", company: "Iron Horizon Gym", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=quxh22&_wi=1", imageAlt: "Sarah Mitchell, gym owner"
},
{
id: "testimonial-2", name: "James Rodriguez", role: "Sports Club Manager", company: "Summit Tennis Club", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o1a57z", imageAlt: "James Rodriguez, sports club manager"
},
{
id: "testimonial-3", name: "Marcus Thompson", role: "Performance Coach", company: "Velocity Coaching", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=6fnriv", imageAlt: "Marcus Thompson, performance coach"
}
]}
/>
</div>
{/* CTA Section */}
<div id="cta-about" data-section="cta-about">
<ContactSplit
tag="Ready?"
title="Let's Build Your Website"
description="Get a free website review with 3 specific improvements. No obligation, no pitch—just honest feedback."
tagIcon={Sparkles}
tagAnimation="slide-up"
background={{ variant: "plain" }}
useInvertedBackground={false}
mediaAnimation="slide-up"
inputPlaceholder="Enter your email"
buttonText="Get Your Free Review"
termsText="By clicking Get Your Free Review you're confirming that you agree with our Terms and Conditions."
/>
</div>
{/* Footer */}
<div id="footer-all" data-section="footer-all">
<FooterCard
logoText="Elevate Web"