Update src/app/contact/page.tsx

This commit is contained in:
2026-06-10 11:26:25 +00:00
parent 8d976b7add
commit ae96ec5bbe

View File

@@ -2,15 +2,27 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqBase from '@/components/sections/faq/FaqBase';
import FooterBase from '@/components/sections/footer/FooterBase';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import { Mail, MapPin, MessageCircle, MessageSquare, Phone } from "lucide-react";
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { MapPin, Phone, Mail } from 'lucide-react';
import type { Metadata } from "next";
export const metadata: Metadata = {
title: "Contact Carlstra Aero Ltd - Get in Touch", description: "Reach out to Carlstra Aero Ltd for inquiries, tender submissions, or partnership opportunities. Find our company details, location, and contact form.", openGraph: {
title: "Carlstra Aero Ltd Contact Information", description: "Connect with Carlstra Aero Ltd for reliable supply, logistics, and technical solutions. Use our contact form or find our address and phone number.", url: "https://www.carlstraaero.com/contact", images: [
{
url: "http://img.b2bpic.net/free-photo/portrait-beautiful-african-woman-glass-smiling-talking-phone_176420-12470.jpg", alt: "Contact Carlstra Aero Ltd"},
],
},
};
export default function ContactPage() {
const handleSubmit = (email: string) => {
alert(`Thank you for your message! We will get back to you at ${email}.`);
// In a real application, you would send this email to a backend service
};
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
@@ -25,217 +37,98 @@ export default function LandingPage() {
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "/",
},
{
name: "About Us",
id: "/about",
},
{
name: "Services",
id: "/services",
},
{
name: "Tenders",
id: "/tenders",
},
{
name: "Contact",
id: "/contact",
},
]}
logoSrc="http://img.b2bpic.net/free-vector/detailed-travel-company-logo_23-2148625160.jpg"
logoAlt="Carlstra Aero Ltd Logo"
brandName="Carlstra Aero Ltd"
button={{
text: "Request a Quote",
href: "/contact",
}}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About Us", id: "/about" },
{ name: "Services", id: "/services" },
{ name: "Tenders", id: "/tenders" },
{ name: "Contact", id: "/contact" },
]}
logoSrc="http://img.b2bpic.net/free-vector/detailed-travel-company-logo_23-2148625160.jpg"
logoAlt="Carlstra Aero Ltd Logo"
brandName="Carlstra Aero Ltd"
button={{ text: "Request a Quote", href: "/contact" }}
/>
</div>
<div id="main-contact-form" data-section="main-contact-form">
<ContactSplitForm
useInvertedBackground={false}
title="Get In Touch With Us"
description="Have a question or need support? Fill out the form below and our dedicated team will get back to you as soon as possible."
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Full Name",
required: true,
},
{
name: "email",
type: "email",
placeholder: "Your Email Address",
required: true,
},
{
name: "subject",
type: "text",
placeholder: "Subject of Inquiry",
required: true,
},
]}
textarea={{
name: "message",
placeholder: "Your Message Here...",
rows: 4,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/portrait-beautiful-african-woman-glass-smiling-talking-phone_176420-12470.jpg?_wi=2"
imageAlt="modern corporate contact office"
mediaAnimation="blur-reveal"
buttonText="Send Message"
/>
</div>
<div id="contact-form" data-section="contact-form">
<ContactCenter
tag="Get In Touch"
title="How Can We Help You?"
description="We're here to answer your questions and provide the information you need. Fill out the form below or reach out directly."
inputPlaceholder="Your Email Address"
buttonText="Send Message"
onSubmit={handleSubmit}
useInvertedBackground={false}
background={{ variant: "plain" }}
/>
</div>
<div id="contact-info-metrics" data-section="contact-info-metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{
id: "1",
value: "Email Us",
title: "info@carlstraaero.com",
description: "For general inquiries and information.",
icon: Mail,
},
{
id: "2",
value: "Call Us",
title: "+254 700 000 000",
description: "Speak directly with our support team.",
icon: Phone,
},
{
id: "3",
value: "Visit Our Office",
title: "Nairobi, Kenya",
description: "Our physical location for meetings and consultations.",
icon: MapPin,
},
]}
title="Reach Us Directly"
description="Connect with our team through various channels tailored for your convenience."
tag="Direct Contact"
tagIcon={Contact}
/>
</div>
<div id="company-details" data-section="company-details" className="py-16 md:py-24 bg-background-accent">
<div className="container mx-auto px-4 text-center">
<h2 className="text-3xl font-bold mb-8 text-foreground">Our Details & Location</h2>
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 max-w-4xl mx-auto">
<div className="flex flex-col items-center p-6 rounded-lg bg-card shadow-lg">
<MapPin className="h-8 w-8 text-primary-cta mb-3" />
<h3 className="text-xl font-semibold mb-2 text-foreground">Address</h3>
<p className="text-foreground/80">Carlstra Aero Ltd</p>
<p className="text-foreground/80">Acme Building, 123 Industrial Area</p>
<p className="text-foreground/80">Nairobi, Kenya</p>
</div>
<div className="flex flex-col items-center p-6 rounded-lg bg-card shadow-lg">
<Phone className="h-8 w-8 text-primary-cta mb-3" />
<h3 className="text-xl font-semibold mb-2 text-foreground">Phone</h3>
<p className="text-foreground/80">+254 7XX XXX XXX</p>
<p className="text-foreground/80">Monday - Friday, 9 AM - 5 PM (EAT)</p>
</div>
<div className="flex flex-col items-center p-6 rounded-lg bg-card shadow-lg">
<Mail className="h-8 w-8 text-primary-cta mb-3" />
<h3 className="text-xl font-semibold mb-2 text-foreground">Email</h3>
<p className="text-foreground/80">info@carlstraaero.com</p>
<p className="text-foreground/80">We typically respond within 24 hours.</p>
</div>
</div>
</div>
</div>
<div id="general-contact-faq" data-section="general-contact-faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "What are your business hours?",
content: "Our main office operates from Monday to Friday, 8:00 AM to 5:00 PM (EAT). Emergency support is available 24/7 for critical services.",
},
{
id: "2",
title: "How long does it take to get a response?",
content: "We strive to respond to all inquiries within 24-48 business hours. For urgent matters, please use our direct phone line.",
},
{
id: "3",
title: "Where are you located?",
content: "Our main headquarters are located in Nairobi, Kenya. We serve clients regionally and internationally through our robust network.",
},
]}
title="Common Questions"
description="Find quick answers to the most frequently asked questions about Carlstra Aero Ltd. and our operations."
tag="Support"
tagIcon={MessageCircle}
faqsAnimation="slide-up"
/>
</div>
<div id="final-contact-cta" data-section="final-contact-cta">
<ContactCTA
useInvertedBackground={false}
background={{
variant: "sparkles-gradient",
}}
tag="Still Need Help?"
tagIcon={MessageSquare}
title="Your Success, Our Priority."
description="Don't hesitate to reach out. We're here to provide clarity and solutions, ensuring your experience with us is seamless."
buttons={[
{
text: "Chat With Us",
href: "/contact",
},
]}
/>
</div>
<div id="footer-contact" data-section="footer-contact">
<FooterBase
columns={[
{
title: "Contact",
items: [
{
label: "Email",
href: "mailto:info@carlstraaero.com",
},
{
label: "Phone",
href: "tel:+254700000000",
},
{
label: "Location",
href: "#",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Services",
href: "/services",
},
{
label: "Tenders",
href: "/tenders",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "/privacy",
},
{
label: "Terms of Service",
href: "/terms",
},
],
},
]}
logoText="Carlstra Aero Ltd."
copyrightText="© 2024 Carlstra Aero Ltd. All rights reserved."
/>
</div>
<div id="footer" data-section="footer">
<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={[
{
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" },
],
},
]}
copyrightText="© 2025 Carlstra Aero Ltd. Registered in Kenya. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);