132 lines
4.6 KiB
TypeScript
132 lines
4.6 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
|
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
|
import Link from "next/link";
|
|
import {
|
|
Mail,
|
|
MapPin,
|
|
Phone,
|
|
Clock,
|
|
Zap,
|
|
Instagram,
|
|
Facebook,
|
|
Linkedin,
|
|
Music,
|
|
} from "lucide-react";
|
|
|
|
export default function ContactPage() {
|
|
const navItems = [
|
|
{ name: "DJ Events", id: "dj-events" },
|
|
{ name: "Marketing", id: "digital-marketing" },
|
|
{ name: "Portfolio", id: "portfolio" },
|
|
{ name: "About", id: "about" },
|
|
];
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSmall"
|
|
background="circleGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="semibold"
|
|
>
|
|
{/* Navbar */}
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Sonic Motion"
|
|
navItems={navItems}
|
|
button={{
|
|
text: "Book Your Event", href: "#contact"}}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
{/* Primary Contact CTA Section */}
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
tag="Get in Touch"
|
|
tagIcon={Mail}
|
|
tagAnimation="slide-up"
|
|
title="Let's Create Something Extraordinary"
|
|
description="Whether you're booking a DJ event or launching a digital marketing campaign, our team is ready to bring your vision to life. Reach out today for a personalized consultation."
|
|
buttons={[
|
|
{ text: "Book DJ Event", href: "mailto:events@sonicmotion.com" },
|
|
{
|
|
text: "Start Marketing Campaign", href: "mailto:marketing@sonicmotion.com"},
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
background={{ variant: "plain" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
{/* Contact Methods Metrics Section */}
|
|
<div id="contact-methods" data-section="contact-methods">
|
|
<MetricCardThree
|
|
title="Connect With Us"
|
|
description="Multiple ways to reach our team and explore partnership opportunities."
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", icon: Mail,
|
|
title: "Email Support", value: "24/7"},
|
|
{
|
|
id: "2", icon: Phone,
|
|
title: "Phone Availability", value: "Mon-Fri"},
|
|
{
|
|
id: "3", icon: Clock,
|
|
title: "Response Time", value: "<24hrs"},
|
|
{
|
|
id: "4", icon: MapPin,
|
|
title: "Serving", value: "Global"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
{/* Secondary Contact CTA Section */}
|
|
<div id="contact-secondary" data-section="contact-secondary">
|
|
<ContactCTA
|
|
tag="Questions?"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
title="Have Specific Needs? We're Here to Help"
|
|
description="Contact our specialists directly. Our team will respond to your inquiry within 24 hours with tailored solutions for your DJ event or marketing campaign."
|
|
buttons={[
|
|
{ text: "Email Us Now", href: "mailto:info@sonicmotion.com" },
|
|
{ text: "Return Home", href: "/" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
background={{ variant: "radial-gradient" }}
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
{/* Footer */}
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="Sonic Motion"
|
|
copyrightText="© 2025 Sonic Motion | Production Experts for Nightlife & Digital Marketing"
|
|
socialLinks={[
|
|
{
|
|
icon: Instagram,
|
|
href: "https://instagram.com", ariaLabel: "Instagram"},
|
|
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
|
|
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" },
|
|
{ icon: Music, href: "https://soundcloud.com", ariaLabel: "SoundCloud" },
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |