Update src/app/contact/page.tsx
This commit is contained in:
@@ -1,114 +1,91 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/components/theme-provider";
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
|
||||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
import ContactForm from '@/components/form/ContactForm';
|
||||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
import { Home, Phone, Mail, User, Shield, Sparkles } from "lucide-react";
|
||||||
import Link from 'next/link'; // Necessary for internal navigation in navbar/footer
|
|
||||||
|
|
||||||
// Nav items for NavbarLayoutFloatingInline and FooterBaseCard
|
|
||||||
const navItems = [
|
|
||||||
{ name: "Home", href: "/" },
|
|
||||||
{ name: "About Us", href: "/about" },
|
|
||||||
{ name: "Services", href: "/services" },
|
|
||||||
{ name: "Tenders", href: "/tenders" },
|
|
||||||
{ name: "Contact", href: "/contact" },
|
|
||||||
];
|
|
||||||
|
|
||||||
const footerColumns = [
|
|
||||||
{
|
|
||||||
title: "Quick Links", items: [
|
|
||||||
{ label: "Home", href: "/" },
|
|
||||||
{ label: "About Us", href: "/about" },
|
|
||||||
{ label: "Services", href: "/services" },
|
|
||||||
{ label: "Tenders & Procurement", href: "/tenders" },
|
|
||||||
{ label: "Contact", href: "/contact" },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Services", items: [
|
|
||||||
{ label: "General Supplies", href: "/services#general-supplies" },
|
|
||||||
{ label: "Logistics & Transport", href: "/services#logistics-transport" },
|
|
||||||
{ label: "Aviation & Technical", href: "/services#aviation-technical" },
|
|
||||||
{ label: "ICT & Digital", href: "/services#ict-digital" },
|
|
||||||
{ label: "Construction & Maintenance", href: "/services#construction-maintenance" },
|
|
||||||
{ label: "Consultancy", href: "/services#consultancy-project" },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Contact Info", items: [
|
|
||||||
{ label: "Nairobi, Kenya", href: "/contact" },
|
|
||||||
{ label: "+254 7XX XXX XXX", href: "/contact" },
|
|
||||||
{ label: "info@carlstraaero.com", href: "/contact" },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
export default function ContactPage() {
|
export default function ContactPage() {
|
||||||
|
const companyDetails = [
|
||||||
|
{ label: "Physical Address", value: "123 Main St, Anytown, CA 90210", icon: Home },
|
||||||
|
{ label: "Postal Address", value: "PO Box 123, Anytown, CA 90210", icon: Home },
|
||||||
|
{ label: "Phone", value: "+1 (555) 123-4567", icon: Phone },
|
||||||
|
{ label: "Email", value: "info@example.com", icon: Mail },
|
||||||
|
{ label: "Directors", value: "John Doe, Jane Smith", icon: User },
|
||||||
|
{ label: "KRA PIN", value: "A000000000Z", icon: Shield },
|
||||||
|
{ label: "Registration Number", value: "CN202300001", icon: Shield }
|
||||||
|
];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant={"expand-hover"}
|
defaultButtonVariant="hover-magnetic"
|
||||||
defaultTextAnimation={"entrance-slide"}
|
defaultTextAnimation="entrance-slide"
|
||||||
borderRadius={"pill"}
|
borderRadius="rounded"
|
||||||
contentWidth={"compact"}
|
contentWidth="medium"
|
||||||
sizing={"largeSmall"}
|
sizing="medium"
|
||||||
background={"noise"}
|
background="none"
|
||||||
cardStyle={"gradient-bordered"}
|
cardStyle="solid"
|
||||||
primaryButtonStyle={"flat"}
|
primaryButtonStyle="gradient"
|
||||||
secondaryButtonStyle={"radial-glow"}
|
secondaryButtonStyle="glass"
|
||||||
headingFontWeight={"bold"}
|
headingFontWeight="bold"
|
||||||
>
|
>
|
||||||
<div id="nav" data-section="nav">
|
<NavbarStyleFullscreen
|
||||||
<NavbarLayoutFloatingInline
|
navItems={[
|
||||||
brandName="Carlstra Aero Ltd"
|
{ name: "Home", id: "/" },
|
||||||
logoSrc="http://img.b2bpic.net/free-vector/detailed-travel-company-logo_23-2148625160.jpg"
|
{ name: "Contact", id: "/contact" }
|
||||||
logoAlt="Carlstra Aero Ltd Logo"
|
]}
|
||||||
navItems={navItems.map(item => ({ name: item.name, id: item.href }))}
|
brandName="YourBrand"
|
||||||
button={{ text: "Request a Quote", href: "/contact" }}
|
/>
|
||||||
|
|
||||||
|
<div id="contact-hero" data-section="contact-hero">
|
||||||
|
<HeroBillboardDashboard
|
||||||
|
title="Get in Touch"
|
||||||
|
description="We'd love to hear from you. Reach out to us through the details below or fill out the contact form."
|
||||||
|
background={{ variant: 'radial-gradient' }}
|
||||||
|
dashboard={{
|
||||||
|
title: "Contact Information", stats: [
|
||||||
|
{ title: "Reach Us", description: "Anytime", values: [100, 200, 300] }
|
||||||
|
],
|
||||||
|
logoIcon: Sparkles,
|
||||||
|
sidebarItems: [],
|
||||||
|
buttons: [],
|
||||||
|
listItems: [],
|
||||||
|
imageSrc: "https://r2.webild.com/assets/contact-us-hero-image.webp?_wi=1"
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="contact-page-hero" data-section="contact-page-hero">
|
<div id="contact-content" data-section="contact-content" className="relative z-10 mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
|
||||||
<HeroSplitTestimonial
|
<div className="grid grid-cols-1 gap-12 md:grid-cols-2">
|
||||||
title="GET IN TOUCH WITH CARLSTRA AERO"
|
{/* Left Side: Contact Detail Cards */}
|
||||||
description="We're ready to partner with you. Reach out to discuss your procurement, logistics, or technical support needs."
|
<div className="space-y-8">
|
||||||
background={{ variant: "plain" }}
|
<h2 className="text-3xl font-extrabold tracking-tight text-foreground sm:text-4xl">Our Details</h2>
|
||||||
testimonials={[]}
|
{companyDetails.map((detail, index) => (
|
||||||
mediaAnimation="slide-up"
|
<div key={index} className="flex items-start space-x-4 rounded-xl bg-card p-6 shadow-lg border border-border-color">
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-assortment-paper-clips-with-copy-space_23-2148581960.jpg"
|
<detail.icon className="h-6 w-6 text-yellow-500 flex-shrink-0" />
|
||||||
imageAlt="Deep navy abstract contact us background"
|
<div>
|
||||||
useInvertedBackground={true}
|
<h3 className="text-xl font-semibold text-foreground">{detail.label}</h3>
|
||||||
imagePosition="right"
|
<p className="mt-1 text-muted-foreground">{detail.value}</p>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="contact-information-form" data-section="contact-information-form">
|
{/* Right Side: Contact Form */}
|
||||||
<ContactSplit
|
<div>
|
||||||
tag="Contact Us"
|
<ContactForm
|
||||||
title="Your Trusted Partner for Institutional Needs"
|
title="Send us a message"
|
||||||
description="Whether you have a specific tender, a general inquiry, or require detailed project support, our team is ready to assist. Fill out the form or use the contact details below."
|
description="Fill out the form below and we'll get back to you as soon as possible. Due to current component limitations, only an email field is available."
|
||||||
background={{ variant: "plain" }}
|
tag="Inquiry"
|
||||||
mediaAnimation="slide-up"
|
tagIcon={Sparkles}
|
||||||
useInvertedBackground={false}
|
inputPlaceholder="Your Email Address"
|
||||||
mediaPosition="left"
|
buttonText="Submit Inquiry"
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-beautiful-african-woman-glass-smiling-talking-phone_176420-12470.jpg"
|
onSubmit={(email) => console.log("Form Submitted (Email only):", email)}
|
||||||
imageAlt="Modern corporate contact office"
|
className="bg-card p-8 rounded-xl shadow-lg border border-border-color"
|
||||||
buttonText="Send Message"
|
/>
|
||||||
inputPlaceholder="Your Email Address"
|
</div>
|
||||||
termsText="By sending a message, you agree to our Privacy Policy and Terms of Service."
|
</div>
|
||||||
onSubmit={() => alert('Your message has been sent!')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="footer" data-section="footer" className="relative before:absolute before:inset-x-0 before:top-0 before:h-0.5 before:bg-accent">
|
|
||||||
<FooterBaseCard
|
|
||||||
logoSrc="http://img.b2bpic.net/free-vector/detailed-travel-company-logo_23-2148625160.jpg"
|
|
||||||
logoAlt="Carlstra Aero Ltd Logo"
|
|
||||||
logoText="CARLSTRA AERO LTD"
|
|
||||||
columns={footerColumns}
|
|
||||||
copyrightText="© 2025 Carlstra Aero Ltd. Registered in Kenya. All rights reserved."
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user