Add src/app/services/page.tsx
This commit is contained in:
125
src/app/services/page.tsx
Normal file
125
src/app/services/page.tsx
Normal file
@@ -0,0 +1,125 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "next-themes";
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import { ArrowRight, Sparkles, CheckCircle } from 'lucide-react';
|
||||
|
||||
const serviceCategories = [
|
||||
{
|
||||
id: "general-supplies", tag: "GS", name: "General Supplies", description: "Providing a wide range of essential goods, equipment, and materials to support various operational needs across different sectors.", bulletPoints: [
|
||||
"Office Stationery", "IT Hardware & Software", "Cleaning & Janitorial Supplies", "Safety & PPE", "Building Materials", "Consumables & Perishables"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=General+Supplies"
|
||||
},
|
||||
{
|
||||
id: "logistics-transport", tag: "LT", name: "Logistics & Transport", description: "Comprehensive logistics solutions including cargo handling, transportation, warehousing, and supply chain management to ensure efficient movement of goods.", bulletPoints: [
|
||||
"Freight Forwarding", "Ground Transportation", "Air & Sea Cargo", "Warehousing & Distribution", "Customs Clearance", "Fleet Management"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=Logistics+%26+Transport"
|
||||
},
|
||||
{
|
||||
id: "aviation-technical-support", tag: "AT", name: "Aviation & Technical Support", description: "Specialized services for the aviation sector, encompassing aircraft maintenance, ground support equipment, and technical personnel.", bulletPoints: [
|
||||
"Aircraft Maintenance", "GSE Supply & Maintenance", "Technical Personnel Provision", "Aviation Fuel Services", "Flight Operations Support", "Airfield Management"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=Aviation+%26+Technical+Support"
|
||||
},
|
||||
{\n id: "ict-digital-solutions", tag: "ID", name: "ICT & Digital Solutions", description: "Cutting-edge information and communication technology services, including network infrastructure, software development, and digital transformation initiatives.", bulletPoints: [
|
||||
"Network Design & Implementation", "Software Development", "Cybersecurity", "Cloud Services", "IT Consulting", "Data Management"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=ICT+%26+Digital+Solutions"
|
||||
},
|
||||
{
|
||||
id: "construction-facility-maintenance", tag: "CF", name: "Construction & Facility Maintenance", description: "Expert services in construction, renovation, and ongoing facility maintenance to ensure optimal functionality and safety of infrastructure.", bulletPoints: [
|
||||
"Building Construction", "Renovation & Remodeling", "HVAC Maintenance", "Electrical & Plumbing", "Landscaping & Groundskeeping", "Integrated Facility Management"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=Construction+%26+Facility+Maintenance"
|
||||
},
|
||||
{
|
||||
id: "consultancy-project-support", tag: "CP", name: "Consultancy & Project Support", description: "Strategic advisory and hands-on project management support to help organizations achieve their goals efficiently and effectively.", bulletPoints: [
|
||||
"Strategic Planning", "Project Management", "Risk Assessment", "Feasibility Studies", "Financial Advisory", "HR & Training Solutions"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=Consultancy+%26+Project+Support"
|
||||
},
|
||||
{
|
||||
id: "specialized-tender-based-services", tag: "ST", name: "Specialized Tender-Based Services", description: "Tailored services delivered through competitive tendering, offering bespoke solutions to meet unique client requirements.", bulletPoints: [
|
||||
"Custom Procurement Solutions", "Public Sector Bids", "Private Sector Contracts", "Proposal Development", "Contract Negotiation", "Specialized Project Execution"
|
||||
],
|
||||
imageSrc: "https://via.placeholder.com/800x600?text=Specialized+Tender-Based+Services"
|
||||
}
|
||||
];
|
||||
|
||||
export default function ServicesPage() {
|
||||
const heroCarouselItems = [
|
||||
{ imageSrc: "https://via.placeholder.com/400x300?text=Service+Image+1", imageAlt: "Service Image 1" },
|
||||
{ imageSrc: "https://via.placeholder.com/400x300?text=Service+Image+2", imageAlt: "Service Image 2" },
|
||||
{ imageSrc: "https://via.placeholder.com/400x300?text=Service+Image+3", imageAlt: "Service Image 3" },
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
attribute="class"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="none"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "General Supplies", id: "#general-supplies" },
|
||||
{ name: "Logistics", id: "#logistics-transport" },
|
||||
{ name: "Aviation", id: "#aviation-technical-support" },
|
||||
{ name: "ICT", id: "#ict-digital-solutions" },
|
||||
{ name: "Construction", id: "#construction-facility-maintenance" },
|
||||
{ name: "Consultancy", id: "#consultancy-project-support" },
|
||||
{ name: "Specialized Tenders", id: "#specialized-tender-based-services" }
|
||||
]}
|
||||
brandName="OurCompany"
|
||||
logoSrc="https://via.placeholder.com/50x50?text=Logo"
|
||||
button={{ text: "Contact Us", href: "#contact" }}
|
||||
/>
|
||||
<div id="services-page-wrapper">
|
||||
<HeroSplitDoubleCarousel
|
||||
title="Our Comprehensive Services"
|
||||
description="Delivering tailored solutions across various sectors, from essential supplies to specialized project support. We are committed to excellence and efficiency in every service we provide."
|
||||
tag="Trusted Solutions"
|
||||
tagIcon={Sparkles}
|
||||
background={{ variant: 'animated-grid' }}
|
||||
buttons={[{ text: "Explore Our Services", href: "#general-supplies" }]}
|
||||
leftCarouselItems={heroCarouselItems}
|
||||
rightCarouselItems={heroCarouselItems}
|
||||
carouselPosition="right"
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
|
||||
{serviceCategories.map((service) => (
|
||||
<div id={service.id} data-section={service.id} key={service.id}>
|
||||
<SplitAbout
|
||||
title={service.name}
|
||||
description={service.description}
|
||||
tag={service.tag}
|
||||
bulletPoints={service.bulletPoints.map(point => ({ title: point, description: '', icon: CheckCircle }))}
|
||||
buttons={[{ text: "Request This Service →", href: "#contact", icon: ArrowRight }]}
|
||||
imageSrc={service.imageSrc}
|
||||
imageAlt={service.name}
|
||||
imagePosition="right"
|
||||
useInvertedBackground={false}
|
||||
textboxLayout="default"
|
||||
mediaAnimation="slide-up"
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user