diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx new file mode 100644 index 0000000..5d10e5b --- /dev/null +++ b/src/app/about/page.tsx @@ -0,0 +1,373 @@ +"use client"; + +import { ThemeProvider } from "@/components/theme-provider"; +import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline"; +import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery"; +import MediaAbout from "@/components/sections/about/MediaAbout"; +import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve"; +import TimelineProcessFlow from "@/components/cardStack/layouts/timelines/TimelineProcessFlow"; +import MetricCardFourteen from "@/components/sections/metrics/MetricCardFourteen"; +import TeamCardTwo from "@/components/sections/team/TeamCardTwo"; +import ContactCTA from "@/components/sections/contact/ContactCTA"; +import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis"; +import { Mail } from "lucide-react"; + +const navItems = [ + { name: "Home", id: "/" }, + { name: "Services", id: "/services" }, + { name: "About", id: "/about" }, + { name: "Contact", id: "contact" }, +]; + +export default function AboutPage() { + return ( + + + +
+ +
+ +
+ +
+ +
+ {} }, + { text: "Contact", href: "contact" }, + ], + }, + { + id: "innovation", label: "Innovation", title: "Cutting-edge logistics technology", items: [ + "Real-time tracking systems", "AI-powered route optimization", "Digital documentation", "Continuous improvement culture"], + buttons: [ + { text: "Our Tech", onClick: () => {} }, + { text: "Learn More", href: "services" }, + ], + }, + { + id: "sustainability", label: "Sustainability", title: "Committed to environmental responsibility", items: [ + "Carbon-efficient routing", "Fleet modernization", "Eco-friendly packaging", "Regional economic growth"], + buttons: [ + { text: "Green Initiative", onClick: () => {} }, + { text: "Details", href: "#" }, + ], + }, + { + id: "people", label: "People-Centric", title: "Empowering our team and communities", items: [ + "Professional development programs", "Fair employment practices", "Community investments", "Diverse & inclusive culture"], + buttons: [ + { text: "Careers", onClick: () => {} }, + { text: "Join Us", href: "#" }, + ], + }, + ]} + animationType="slide-up" + title="Our Core Values", description="The principles that guide everything we do" + textboxLayout="default" + useInvertedBackground={false} + /> +
+ +
+ + ), + content: ( +
+

Regional Expansion

+

Establish operations in 15+ African countries and create a seamless pan-African logistics network.

+
    +
  • + → + Open regional hubs in key markets +
    • +
  • + → + Build strategic partnerships +
    • +
  • + → + Invest in local infrastructure +
    • +
+
+ ), + }, + { + id: "2", reverse: true, + media: ( + Technology + ), + content: ( +
+

Technology Leadership

+

Implement AI and IoT solutions for predictive logistics and enhanced customer experience.

+
    +
  • + → + Deploy advanced tracking systems +
    • +
  • + → + Develop mobile platform +
    • +
  • + → + Enable blockchain transparency +
    • +
+
+ ), + }, + { + id: "3", reverse: false, + media: ( + Capacity + ), + content: ( +
+

Capacity Enhancement

+

Double fleet capacity and warehouse space to serve growing demand across Africa.

+
    +
  • + → + Modernize vehicle fleet +
    • +
  • + → + Build new warehousing facilities +
    • +
  • + → + Expand team capacity +
    • +
+
+ ), + }, + { + id: "4", reverse: true, + media: ( + Sustainability + ), + content: ( +
+

Sustainability & Impact

+

Achieve carbon neutrality and create positive social impact across African communities.

+
    +
  • + → + Transition to green vehicles +
    • +
  • + → + Support local employment +
    • +
  • + → + Reduce environmental impact +
    • +
+
+ ), + }, + ]} + /> +
+ +
+ +
+ +
+ null, + url: "https://linkedin.com"}, + ], + }, + { + id: "2", name: "Maria Costa", role: "COO", description: + "Operations expert with proven track record in scaling logistics operations across multiple African markets.", imageSrc: + "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=500&h=500&fit=crop", socialLinks: [ + { + icon: () => null, + url: "https://linkedin.com"}, + ], + }, + { + id: "3", name: "Samuel Okafor", role: "Technology Lead", description: + "Tech innovator specializing in logistics automation and IoT solutions for African supply chains.", imageSrc: + "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=500&h=500&fit=crop", socialLinks: [ + { + icon: () => null, + url: "https://linkedin.com"}, + ], + }, + { + id: "4", name: "Amara Diallo", role: "Regional Manager", description: + "Strategic leader managing operations across West and Central Africa with deep regional knowledge.", imageSrc: + "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=500&h=500&fit=crop", socialLinks: [ + { + icon: () => null, + url: "https://linkedin.com"}, + ], + }, + ]} + title="Our Leadership Team" + description="Experienced professionals dedicated to transforming African logistics" + gridVariant="four-items-2x2-equal-grid" + animationType="slide-up" + textboxLayout="default" + useInvertedBackground={false} + /> +
+ +
+ {} }, + ]} + background={{ variant: "radial-gradient" }} + useInvertedBackground={false} + /> +
+ + + + ); +} diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx new file mode 100644 index 0000000..0572f95 --- /dev/null +++ b/src/app/contact/page.tsx @@ -0,0 +1,297 @@ +'use client'; + +import { ThemeProvider } from '@/providers/theme-provider'; +import { NavbarLayoutFloatingInline } from '@/components/navbar/NavbarLayoutFloatingInline'; +import { TextBox } from '@/components/Textbox'; +import { Input } from '@/components/form/Input'; +import { ButtonDirectionalHover } from '@/components/button/ButtonDirectionalHover/ButtonDirectionalHover'; +import { FooterMedia } from '@/components/sections/footer/FooterMedia'; +import { Mail, Phone, MapPin, Linkedin, Twitter, Globe } from 'lucide-react'; +import { useState } from 'react'; + +const navItems = [ + { name: 'Home', id: '/' }, + { name: 'About', id: '#about' }, + { name: 'Contact', id: '/contact' }, + { name: 'Services', id: '#services' }, +]; + +const footerColumns = [ + { + title: 'Product', + items: [ + { label: 'Features', href: '#services' }, + { label: 'Pricing', href: '#' }, + { label: 'Security', href: '#' }, + { label: 'Roadmap', href: '#' }, + ], + }, + { + title: 'Company', + items: [ + { label: 'About', href: '#about' }, + { label: 'Blog', href: '#' }, + { label: 'Careers', href: '#' }, + { label: 'Press', href: '#' }, + ], + }, + { + title: 'Resources', + items: [ + { label: 'Documentation', href: '#' }, + { label: 'Community', href: '#' }, + { label: 'Contact', href: '/contact' }, + { label: 'Support', href: '#' }, + ], + }, +]; + +interface FormData { + name: string; + email: string; + subject: string; + message: string; +} + +export default function ContactPage() { + const [formData, setFormData] = useState({ + name: '', + email: '', + subject: '', + message: '', + }); + + const [submitted, setSubmitted] = useState(false); + + const handleInputChange = (field: keyof FormData, value: string) => { + setFormData((prev) => ({ + ...prev, + [field]: value, + })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + console.log('Form submitted:', formData); + setSubmitted(true); + setFormData({ name: '', email: '', subject: '', message: '' }); + setTimeout(() => setSubmitted(false), 3000); + }; + + return ( + + + +
+
+ {/* Header Section */} +
+ +
+ + {/* Main Content Grid */} +
+ {/* Contact Form */} +
+
+

Send us a Message

+ +
+
+ + handleInputChange('name', value)} + type="text" + placeholder="Your name" + required + /> +
+ +
+ + handleInputChange('email', value)} + type="email" + placeholder="your.email@example.com" + required + /> +
+ +
+ + handleInputChange('subject', value)} + type="text" + placeholder="How can we help?" + required + /> +
+ +
+ +