Merge version_2 into main #7
@@ -1,13 +1,14 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import TeamCardTen from "@/components/sections/team/TeamCardTen";
|
||||
import MediaAbout from "@/components/sections/about/MediaAbout";
|
||||
import TextAbout from "@/components/sections/about/TextAbout";
|
||||
import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
|
||||
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
import { Shield, Zap } from "lucide-react";
|
||||
import { Shield, Target, Award, Star, Zap, MapPin } from "lucide-react";
|
||||
|
||||
export default function AboutPage() {
|
||||
const navItems = [
|
||||
@@ -66,51 +67,129 @@ export default function AboutPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TeamCardTen
|
||||
title="Elite coaching grounded in science, delivered with passion. Your dedicated strength coach combines proven methodologies with personalized attention to build your best self."
|
||||
tag="Meet Your Coach"
|
||||
tagAnimation="slide-up"
|
||||
membersAnimation="blur-reveal"
|
||||
members={[
|
||||
<div id="hero" data-section="hero">
|
||||
<MediaAbout
|
||||
title="Elite Strength Training Philosophy"
|
||||
description="At Vinsmoke Athletics, we believe strength training is more than lifting weights—it's about building discipline, confidence, and a lifestyle that works. Founded on proven principles and delivered with personalized expertise."
|
||||
tag="About Vinsmoke"
|
||||
tagIcon={Shield}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-man-showing-mucles_23-2147775529.jpg"
|
||||
imageAlt="Elite strength training at Vinsmoke Athletics"
|
||||
buttons={[
|
||||
{
|
||||
id: "1", name: "Your Elite Coach", imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-office-3_1262-1489.jpg"},
|
||||
text: "Explore Our Services", href: "/services"},
|
||||
]}
|
||||
memberVariant="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="mission" data-section="mission">
|
||||
<FeatureCardTwelve
|
||||
features={[
|
||||
{
|
||||
id: "mission", label: "Our Mission", title: "Transform Bodies Through Disciplined Strength Training", items: [
|
||||
"Provide world-class coaching and personalized programs", "Build a community of committed athletes and lifters", "Deliver measurable results with proven methodologies"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Learn More", href: "/contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "values", label: "Core Values", title: "Excellence, Accountability, and Transformation", items: [
|
||||
"Excellence in every training session and interaction", "Accountability to our clients and their goals", "Sustainable transformation through proper technique"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Start Your Journey", href: "/contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "approach", label: "Our Approach", title: "Science-Backed Training Tailored to You", items: [
|
||||
"Evidence-based strength training principles", "Customized programs for every fitness level", "Consistent coaching and progressive programming"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book a Consultation", href: "/contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
title="Why Choose Vinsmoke Athletics?"
|
||||
description="We combine expert knowledge with personalized coaching to deliver real, lasting results."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="philosophy" data-section="philosophy">
|
||||
<TextAbout
|
||||
tag="Our Philosophy"
|
||||
tagIcon={Shield}
|
||||
title="Structured Coaching That Delivers Real Results. Personalized training programs built on proven strength training principles, tailored to YOUR body, YOUR goals, and YOUR lifestyle."
|
||||
useInvertedBackground={true}
|
||||
tag="Training Philosophy"
|
||||
tagIcon={Target}
|
||||
title="Progressive, Personalized, and Proven. We believe in progressive overload, proper form, and adapting training to each individual's body, lifestyle, and goals. Your strength journey is unique—your training should be too."
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Our Services", href: "/services"},
|
||||
text: "See Our Services", href: "/services"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta-about" data-section="cta-about">
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
title="Client Success Stories"
|
||||
description="Discover how our training has transformed the lives and fitness levels of our clients."
|
||||
tag="Real Results"
|
||||
tagIcon={Star}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Marcus Chen", handle: "@marcuschen", testimonial: "Transformed my entire approach to strength training. The personalized coaching made all the difference in my progress.", imageSrc: "http://img.b2bpic.net/free-photo/man-doing-some-business-deal-with-client_329181-10302.jpg", imageAlt: "Marcus Chen"},
|
||||
{
|
||||
id: "2", name: "Sarah Mitchell", handle: "@sarahmitch_fitness", testimonial: "Finally understand proper form and progressive overload. Best investment in my health I could have made.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-athlete-ready-run_23-2148876522.jpg", imageAlt: "Sarah Mitchell"},
|
||||
{
|
||||
id: "3", name: "David Thompson", handle: "@davidthompson88", testimonial: "Consistency and structure finally clicked. The customized program kept me accountable and delivered results.", imageSrc: "http://img.b2bpic.net/free-photo/view-woman-helping-man-exercise-gym_52683-98091.jpg", imageAlt: "David Thompson"},
|
||||
{
|
||||
id: "4", name: "Jessica Liu", handle: "@jessicaliu_trains", testimonial: "Expert guidance cut through the confusion. Now I train smarter, not just harder. Highly recommend.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-face-african-american-girl-looking-away_1262-3098.jpg", imageAlt: "Jessica Liu"},
|
||||
]}
|
||||
animationType="blur-reveal"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
speed={40}
|
||||
topMarqueeDirection="left"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactCTA
|
||||
tag="Ready to Start?"
|
||||
tagIcon={Zap}
|
||||
title="Begin Your Transformation Today"
|
||||
description="Schedule a free consultation with our coaching team. We'll discuss your goals, assess your current fitness level, and create a personalized plan to get you results."
|
||||
title="Begin Your Strength Journey"
|
||||
description="Book a free consultation with our coaching team and let's build a personalized program tailored to your goals and lifestyle."
|
||||
background={{ variant: "glowing-orb" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Free Consultation", href: "/contact"},
|
||||
text: "Schedule a Consultation", href: "/contact"},
|
||||
{
|
||||
text: "View Services", href: "/services"},
|
||||
text: "Learn More", href: "/services"},
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="location" data-section="location">
|
||||
<ContactCTA
|
||||
tag="Visit Us"
|
||||
tagIcon={MapPin}
|
||||
title="488 Helmcken St, Vancouver, BC"
|
||||
description="Located in the heart of Vancouver. Drop by to meet the team, tour our facility, and discuss your fitness goals in person."
|
||||
background={{ variant: "plain" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Directions", href: "https://maps.google.com/?q=488+Helmcken+St+Vancouver+BC"},
|
||||
{
|
||||
text: "Contact Us", href: "/contact"},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={footerColumns}
|
||||
@@ -120,4 +199,4 @@ export default function AboutPage() {
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,13 +1,70 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import Link from "next/link";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroBillboardTestimonial from "@/components/sections/hero/HeroBillboardTestimonial";
|
||||
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
import { Zap, MapPin } from "lucide-react";
|
||||
import { Zap, MapPin, Phone, Clock } from "lucide-react";
|
||||
|
||||
export default function ContactPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Personal Training", href: "/services" },
|
||||
{ label: "Strength & Conditioning", href: "/services" },
|
||||
{ label: "Custom Programs", href: "/services" },
|
||||
{ label: "Book a Session", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Our Philosophy", href: "/about" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const [formData, setFormData] = useState({
|
||||
name: "", email: "", phone: "", message: ""});
|
||||
|
||||
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData((prev) => ({
|
||||
...prev,
|
||||
[name]: value,
|
||||
}));
|
||||
};
|
||||
|
||||
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
console.log("Form submitted:", formData);
|
||||
setFormData({ name: "", email: "", phone: "", message: "" });
|
||||
};
|
||||
|
||||
const handleEmailSubmit = (email: string) => {
|
||||
console.log("Email signup:", email);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
@@ -21,94 +78,226 @@ export default function ContactPage() {
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
{/* Navbar */}
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="VINSMOKE"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
bottomLeftText="Vancouver, BC"
|
||||
bottomRightText="488 Helmcken St"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Main CTA Section */}
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactCTA
|
||||
tag="Ready to Transform?"
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
title="Get In Touch"
|
||||
description="Ready to start your strength training journey? Reach out to our team. We'll help you book a session, answer questions, or discuss your fitness goals."
|
||||
tag="Contact Us"
|
||||
tagIcon={Zap}
|
||||
tagAnimation="slide-up"
|
||||
title="Start Training Today"
|
||||
description="Your first step toward elite strength and unshakeable confidence. Book a consultation with our coaching team and let's build your custom strength program."
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
background={{ variant: "glowing-orb" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-man-showing-mucles_23-2147775529.jpg"
|
||||
imageAlt="Contact Vinsmoke Athletics"
|
||||
mediaAnimation="slide-up"
|
||||
testimonials={[
|
||||
{
|
||||
name: "Fast Response", handle: "We reply within 24 hours", testimonial: "Your inquiry matters. Our team gets back to you quickly to help you move forward.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-doing-some-business-deal-with-client_329181-10302.jpg"},
|
||||
{
|
||||
name: "Expert Guidance", handle: "Personalized recommendations", testimonial: "We assess your needs and recommend the best service or program for your goals.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-athlete-ready-run_23-2148876522.jpg"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Free Consultation", href: "/contact"},
|
||||
{
|
||||
text: "Learn More", href: "/services"},
|
||||
text: "Send a Message", href: "#contact-form"},
|
||||
]}
|
||||
buttonAnimation="blur-reveal"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Location Section */}
|
||||
<div id="contact-form" data-section="contact-form" className="py-20">
|
||||
<div className="max-w-7xl mx-auto px-4 md:px-6 lg:px-8">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 md:gap-16">
|
||||
{/* Contact Form */}
|
||||
<div>
|
||||
<h2 className="text-3xl md:text-4xl font-extrabold mb-8">Send Us a Message</h2>
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
<div>
|
||||
<label htmlFor="name" className="block text-sm font-semibold mb-2">
|
||||
Full Name
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
name="name"
|
||||
value={formData.name}
|
||||
onChange={handleChange}
|
||||
required
|
||||
className="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
|
||||
placeholder="Your name"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="email" className="block text-sm font-semibold mb-2">
|
||||
Email Address
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
name="email"
|
||||
value={formData.email}
|
||||
onChange={handleChange}
|
||||
required
|
||||
className="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
|
||||
placeholder="your@email.com"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="phone" className="block text-sm font-semibold mb-2">
|
||||
Phone Number
|
||||
</label>
|
||||
<input
|
||||
type="tel"
|
||||
id="phone"
|
||||
name="phone"
|
||||
value={formData.phone}
|
||||
onChange={handleChange}
|
||||
className="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
|
||||
placeholder="(604) 555-0000"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="message" className="block text-sm font-semibold mb-2">
|
||||
Message
|
||||
</label>
|
||||
<textarea
|
||||
id="message"
|
||||
name="message"
|
||||
value={formData.message}
|
||||
onChange={handleChange}
|
||||
required
|
||||
rows={4}
|
||||
className="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
|
||||
placeholder="Tell us about your fitness goals or ask any questions..."
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full bg-blue-600 text-white font-semibold py-3 rounded-lg hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
Send Message
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* Contact Info */}
|
||||
<div>
|
||||
<h2 className="text-3xl md:text-4xl font-extrabold mb-8">Contact Information</h2>
|
||||
<div className="space-y-8">
|
||||
<div className="flex gap-4">
|
||||
<MapPin className="w-6 h-6 flex-shrink-0 text-blue-600 mt-1" />
|
||||
<div>
|
||||
<h3 className="font-semibold text-lg mb-2">Location</h3>
|
||||
<p className="text-gray-600">488 Helmcken St</p>
|
||||
<p className="text-gray-600">Vancouver, BC, Canada</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4">
|
||||
<Phone className="w-6 h-6 flex-shrink-0 text-blue-600 mt-1" />
|
||||
<div>
|
||||
<h3 className="font-semibold text-lg mb-2">Phone</h3>
|
||||
<p className="text-gray-600">(604) 555-0123</p>
|
||||
<p className="text-gray-500 text-sm">Mon-Fri: 9AM-6PM</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4">
|
||||
<Clock className="w-6 h-6 flex-shrink-0 text-blue-600 mt-1" />
|
||||
<div>
|
||||
<h3 className="font-semibold text-lg mb-2">Hours</h3>
|
||||
<p className="text-gray-600">Monday - Friday: 9AM - 6PM</p>
|
||||
<p className="text-gray-600">Saturday: 10AM - 4PM</p>
|
||||
<p className="text-gray-600">Sunday: Closed</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-12 p-6 bg-gradient-to-br from-blue-50 to-indigo-50 rounded-lg">
|
||||
<h3 className="font-semibold text-lg mb-3">Visit Our Studio</h3>
|
||||
<p className="text-gray-700 mb-6">
|
||||
Stop by in person to tour our facility, meet the team, and discuss your fitness goals over a coffee.
|
||||
</p>
|
||||
<a
|
||||
href="https://maps.google.com/?q=488+Helmcken+St+Vancouver+BC"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-block bg-blue-600 text-white font-semibold py-2 px-6 rounded-lg hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
Get Directions
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="newsletter" data-section="newsletter">
|
||||
<ContactSplit
|
||||
tag="Stay Connected"
|
||||
title="Subscribe to Our Newsletter"
|
||||
description="Get fitness tips, training advice, and updates on our latest offerings delivered directly to your inbox."
|
||||
background={{ variant: "animated-grid" }}
|
||||
useInvertedBackground={true}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-man-showing-mucles_23-2147775529.jpg"
|
||||
imageAlt="Subscribe to fitness tips"
|
||||
mediaAnimation="slide-up"
|
||||
inputPlaceholder="your@email.com"
|
||||
buttonText="Subscribe"
|
||||
onSubmit={handleEmailSubmit}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactCTA
|
||||
tag="Next Steps"
|
||||
tagIcon={Zap}
|
||||
title="Book Your Free Consultation"
|
||||
description="Whether you're a complete beginner or an experienced lifter, our coaching team is ready to help. Schedule your free consultation to discuss your goals and find the perfect training program."
|
||||
background={{ variant: "glowing-orb" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Schedule Consultation", href: "#contact-form"},
|
||||
{
|
||||
text: "Explore Services", href: "/services"},
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="location" data-section="location">
|
||||
<ContactCTA
|
||||
tag="Visit Our Studio"
|
||||
tag="Find Us"
|
||||
tagIcon={MapPin}
|
||||
title="488 Helmcken St, Vancouver, BC"
|
||||
description="Located in the heart of Vancouver. Walk in for a tour, meet the team, and discuss your fitness goals in person. We're here to help you succeed."
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
description="Located in the heart of Vancouver. Drop by our studio to see our training facilities and meet the team in person."
|
||||
background={{ variant: "plain" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Directions", href: "https://maps.google.com/?q=488+Helmcken+St+Vancouver+BC"},
|
||||
{
|
||||
text: "Contact Us", href: "/contact"},
|
||||
text: "Back to Top", href: "#nav"},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Personal Training", href: "/services" },
|
||||
{ label: "Strength & Conditioning", href: "/services" },
|
||||
{ label: "Custom Programs", href: "/services" },
|
||||
{ label: "Book a Session", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Our Philosophy", href: "/services" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={footerColumns}
|
||||
bottomLeftText="© 2025 Vinsmoke Athletics. All rights reserved."
|
||||
bottomRightText="488 Helmcken St, Vancouver, BC"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
1438
src/app/layout.tsx
1438
src/app/layout.tsx
File diff suppressed because it is too large
Load Diff
@@ -151,13 +151,17 @@ export default function HomePage() {
|
||||
tagIcon={Zap}
|
||||
products={[
|
||||
{
|
||||
id: "1", brand: "1-on-1 Coaching", name: "Personal Training", price: "Starting at $75/session", rating: 5, reviewCount: "50+", imageSrc: "http://img.b2bpic.net/free-photo/crop-closeup-portrait-woman-exercising-gym_651396-1078.jpg", imageAlt: "Personal training session"},
|
||||
id: "1", brand: "1-on-1 Coaching", name: "Personal Training", price: "Starting at $75/session", rating: 5,
|
||||
reviewCount: "50+", imageSrc: "http://img.b2bpic.net/free-photo/crop-closeup-portrait-woman-exercising-gym_651396-1078.jpg", imageAlt: "Personal training session"},
|
||||
{
|
||||
id: "2", brand: "Athletic Development", name: "Strength & Conditioning", price: "Starting at $85/session", rating: 5, reviewCount: "45+", imageSrc: "http://img.b2bpic.net/free-photo/woman-exercising-weight-bench_329181-14151.jpg", imageAlt: "Strength and conditioning training"},
|
||||
id: "2", brand: "Athletic Development", name: "Strength & Conditioning", price: "Starting at $85/session", rating: 5,
|
||||
reviewCount: "45+", imageSrc: "http://img.b2bpic.net/free-photo/woman-exercising-weight-bench_329181-14151.jpg", imageAlt: "Strength and conditioning training"},
|
||||
{
|
||||
id: "3", brand: "Foundation Building", name: "Beginner Strength Programs", price: "Starting at $199/month", rating: 5, reviewCount: "38+", imageSrc: "http://img.b2bpic.net/free-photo/gym-instructor-guiding-woman-while-exercising-with-dumbbell_23-2147827468.jpg", imageAlt: "Beginner strength training program"},
|
||||
id: "3", brand: "Foundation Building", name: "Beginner Strength Programs", price: "Starting at $199/month", rating: 5,
|
||||
reviewCount: "38+", imageSrc: "http://img.b2bpic.net/free-photo/gym-instructor-guiding-woman-while-exercising-with-dumbbell_23-2147827468.jpg", imageAlt: "Beginner strength training program"},
|
||||
{
|
||||
id: "4", brand: "Tailored Solutions", name: "Customized Workout Plans", price: "Starting at $149/month", rating: 5, reviewCount: "42+", imageSrc: "http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg", imageAlt: "Custom workout plan design"},
|
||||
id: "4", brand: "Tailored Solutions", name: "Customized Workout Plans", price: "Starting at $149/month", rating: 5,
|
||||
reviewCount: "42+", imageSrc: "http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg", imageAlt: "Custom workout plan design"},
|
||||
]}
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
animationType="slide-up"
|
||||
@@ -243,4 +247,4 @@ export default function HomePage() {
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,15 +1,50 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import Link from "next/link";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroBillboardTestimonial from "@/components/sections/hero/HeroBillboardTestimonial";
|
||||
import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
|
||||
import TextAbout from "@/components/sections/about/TextAbout";
|
||||
import FeatureCardNine from "@/components/sections/feature/FeatureCardNine";
|
||||
import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
|
||||
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
import { Zap, Shield } from "lucide-react";
|
||||
import { Zap, Shield, Target, Star, MapPin } from "lucide-react";
|
||||
|
||||
export default function ServicesPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Personal Training", href: "/services" },
|
||||
{ label: "Strength & Conditioning", href: "/services" },
|
||||
{ label: "Custom Programs", href: "/services" },
|
||||
{ label: "Book a Session", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Our Philosophy", href: "/about" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
@@ -23,176 +58,174 @@ export default function ServicesPage() {
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
{/* Navbar */}
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="VINSMOKE"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
bottomLeftText="Vancouver, BC"
|
||||
bottomRightText="488 Helmcken St"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Services Overview Section */}
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
title="Transform Your Strength"
|
||||
description="Choose from our comprehensive training services designed to meet you where you are and take you where you want to be. From beginner fundamentals to elite-level conditioning."
|
||||
tag="Our Services"
|
||||
tagIcon={Zap}
|
||||
background={{ variant: "glowing-orb" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-man-showing-mucles_23-2147775529.jpg"
|
||||
imageAlt="Comprehensive strength training services"
|
||||
mediaAnimation="slide-up"
|
||||
testimonials={[
|
||||
{
|
||||
name: "Marcus Chen", handle: "12-Week Program", testimonial: "The variety and expertise across all services is unmatched. Found exactly what I needed.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-doing-some-business-deal-with-client_329181-10302.jpg"},
|
||||
{
|
||||
name: "Sarah Mitchell", handle: "Custom Programs", testimonial: "Every service is tailored and professional. Worth every penny for results.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-athlete-ready-run_23-2148876522.jpg"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your First Session", href: "/contact"},
|
||||
]}
|
||||
buttonAnimation="blur-reveal"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<ProductCardTwo
|
||||
title="Training Services"
|
||||
description="Choose the training approach that matches your goals and experience level."
|
||||
tag="Our Offerings"
|
||||
tagIcon={Zap}
|
||||
title="Our Training Programs"
|
||||
description="Choose the service that aligns with your fitness goals and experience level."
|
||||
tag="Three Core Offerings"
|
||||
tagIcon={Shield}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "1-on-1 Coaching",
|
||||
name: "Personal Training",
|
||||
price: "Starting at $75/session",
|
||||
rating: 5,
|
||||
reviewCount: "50+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-closeup-portrait-woman-exercising-gym_651396-1078.jpg?_wi=2",
|
||||
imageAlt: "Personal training session one-on-one coaching",
|
||||
},
|
||||
id: "1", brand: "One-on-One Coaching", name: "Personal Training Sessions", price: "$75 per session", rating: 5,
|
||||
reviewCount: "50+", imageSrc: "http://img.b2bpic.net/free-photo/crop-closeup-portrait-woman-exercising-gym_651396-1078.jpg", imageAlt: "Personal training session with expert coach"},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Athletic Development",
|
||||
name: "Strength & Conditioning",
|
||||
price: "Starting at $85/session",
|
||||
rating: 5,
|
||||
reviewCount: "45+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-exercising-weight-bench_329181-14151.jpg?_wi=2",
|
||||
imageAlt: "strength and conditioning athletic training",
|
||||
},
|
||||
id: "2", brand: "Athletic Development", name: "Strength & Conditioning", price: "$85 per session", rating: 5,
|
||||
reviewCount: "45+", imageSrc: "http://img.b2bpic.net/free-photo/woman-exercising-weight-bench_329181-14151.jpg", imageAlt: "Advanced strength and conditioning training"},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Foundation Building",
|
||||
name: "Beginner Strength Programs",
|
||||
price: "Starting at $199/month",
|
||||
rating: 5,
|
||||
reviewCount: "38+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gym-instructor-guiding-woman-while-exercising-with-dumbbell_23-2147827468.jpg?_wi=2",
|
||||
imageAlt: "beginner fitness training foundation exercises",
|
||||
},
|
||||
id: "3", brand: "Foundation Building", name: "Beginner Strength Programs", price: "$199 per month", rating: 5,
|
||||
reviewCount: "38+", imageSrc: "http://img.b2bpic.net/free-photo/gym-instructor-guiding-woman-while-exercising-with-dumbbell_23-2147827468.jpg", imageAlt: "Beginner-friendly strength training program"},
|
||||
{
|
||||
id: "4",
|
||||
brand: "Tailored Solutions",
|
||||
name: "Customized Workout Plans",
|
||||
price: "Starting at $149/month",
|
||||
rating: 5,
|
||||
reviewCount: "42+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg?_wi=2",
|
||||
imageAlt: "customized workout plan personalized fitness",
|
||||
},
|
||||
id: "4", brand: "Customized Solutions", name: "Custom Workout Plans", price: "$149 per month", rating: 5,
|
||||
reviewCount: "42+", imageSrc: "http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg", imageAlt: "Personalized custom workout plan design"},
|
||||
]}
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More", href: "#details"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Detailed Service Breakdown */}
|
||||
<div id="service-details" data-section="service-details">
|
||||
<FeatureCardNine
|
||||
title="How Our Training Programs Work"
|
||||
description="Each program is structured for maximum results and sustainable progress."
|
||||
<div id="details" data-section="details">
|
||||
<FeatureCardTwelve
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Assessment & Planning",
|
||||
description: "We start with a comprehensive assessment of your fitness level, goals, and lifestyle. This informs your personalized training program designed specifically for YOU.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-closeup-portrait-woman-exercising-gym_651396-1078.jpg?_wi=3",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-friends-working-together-fitness-class_23-2148284916.jpg?_wi=4",
|
||||
},
|
||||
id: "personal-training", label: "Personal Training", title: "One-on-One Personalized Coaching", items: [
|
||||
"Expert form correction and real-time feedback", "Customized workout programs for your goals", "Progressive programming with built-in accountability", "Flexible scheduling and online or in-studio options"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book a Session", href: "/contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Structured Programming",
|
||||
description: "Your workouts follow proven periodization principles. Progressive overload, proper form, and strategic recovery built into every session for optimal gains.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-exercising-weight-bench_329181-14151.jpg?_wi=3",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gym-instructor-guiding-woman-while-exercising-with-dumbbell_23-2147827468.jpg?_wi=3",
|
||||
},
|
||||
id: "strength-conditioning", label: "Strength & Conditioning", title: "Athletic Development and Performance", items: [
|
||||
"Sport-specific training and conditioning protocols", "Injury prevention and mobility work integrated", "Periodized programs for peak performance", "Perfect for athletes and serious lifters"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Schedule Training", href: "/contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Accountability & Coaching",
|
||||
description: "Regular check-ins, form corrections, and program adjustments keep you on track. Your coach monitors progress and adapts your program as you get stronger.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg?_wi=3",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-closeup-portrait-woman-exercising-gym_651396-1078.jpg?_wi=4",
|
||||
},
|
||||
id: "custom-programs", label: "Custom Programs", title: "Tailored Workout Plans for Your Lifestyle", items: [
|
||||
"Personalized programs based on your unique situation", "Adaptable to your schedule and equipment access", "Ongoing support and program adjustments", "Best value for long-term consistency"],
|
||||
buttons: [
|
||||
{
|
||||
text: "Start Your Program", href: "/contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
title="Service Details"
|
||||
description="Explore the specifics of each service and find the perfect fit for your fitness journey."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Philosophy Section */}
|
||||
<div id="philosophy" data-section="philosophy">
|
||||
<TextAbout
|
||||
tag="Our Approach"
|
||||
tagIcon={Shield}
|
||||
title="We believe in strength training built on science, delivered with expertise, and maintained through discipline. Every program is personalized, every session is purposeful, and every result is earned."
|
||||
useInvertedBackground={true}
|
||||
buttons={[
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
title="What Clients Say About Our Services"
|
||||
description="Real results from real people who have experienced our training firsthand."
|
||||
tag="Client Testimonials"
|
||||
tagIcon={Star}
|
||||
testimonials={[
|
||||
{
|
||||
text: "Book Your Consultation",
|
||||
href: "/contact",
|
||||
},
|
||||
id: "1", name: "Marcus Chen", handle: "@marcuschen", testimonial: "The personal training sessions transformed my approach. Expert guidance every step of the way.", imageSrc: "http://img.b2bpic.net/free-photo/man-doing-some-business-deal-with-client_329181-10302.jpg", imageAlt: "Marcus Chen"},
|
||||
{
|
||||
id: "2", name: "Sarah Mitchell", handle: "@sarahmitch_fitness", testimonial: "The custom program adjusted perfectly to my schedule. Consistency finally stuck!", imageSrc: "http://img.b2bpic.net/free-photo/close-up-athlete-ready-run_23-2148876522.jpg", imageAlt: "Sarah Mitchell"},
|
||||
{
|
||||
id: "3", name: "David Thompson", handle: "@davidthompson88", testimonial: "Strength & Conditioning elevated my athletic performance. Sport-specific training is game-changing.", imageSrc: "http://img.b2bpic.net/free-photo/view-woman-helping-man-exercise-gym_52683-98091.jpg", imageAlt: "David Thompson"},
|
||||
{
|
||||
id: "4", name: "Jessica Liu", handle: "@jessicaliu_trains", testimonial: "All three services exceeded expectations. Quality coaching across the board.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-face-african-american-girl-looking-away_1262-3098.jpg", imageAlt: "Jessica Liu"},
|
||||
]}
|
||||
animationType="blur-reveal"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
speed={40}
|
||||
topMarqueeDirection="left"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactCTA
|
||||
tag="Ready to Get Started?"
|
||||
tagIcon={Zap}
|
||||
title="Choose Your Service and Begin Today"
|
||||
description="Book a consultation to discuss which service is best for your goals. Our coaching team will help you select the perfect program and get you started on your transformation."
|
||||
background={{ variant: "glowing-orb" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book a Consultation", href: "/contact"},
|
||||
{
|
||||
text: "View Pricing", href: "#services"},
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="location" data-section="location">
|
||||
<ContactCTA
|
||||
tag="Visit Our Studio"
|
||||
tagIcon={MapPin}
|
||||
title="488 Helmcken St, Vancouver, BC"
|
||||
description="Stop by our Vancouver location to meet the team, see our facility, and learn more about our services in person."
|
||||
background={{ variant: "plain" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Directions", href: "https://maps.google.com/?q=488+Helmcken+St+Vancouver+BC"},
|
||||
{
|
||||
text: "Contact Us", href: "/contact"},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate",
|
||||
items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{ label: "Personal Training", href: "/services" },
|
||||
{ label: "Strength & Conditioning", href: "/services" },
|
||||
{ label: "Custom Programs", href: "/services" },
|
||||
{ label: "Book a Session", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Our Philosophy", href: "/services" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={footerColumns}
|
||||
bottomLeftText="© 2025 Vinsmoke Athletics. All rights reserved."
|
||||
bottomRightText="488 Helmcken St, Vancouver, BC"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #000000;
|
||||
--card: #0c0c0c;
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #106EFB;
|
||||
--primary-cta: #e34400;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #000000;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #535353;
|
||||
--background-accent: #106EFB;
|
||||
--accent: #e34400;
|
||||
--background-accent: #e34400;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user