Merge version_1 into main #1
252
src/app/page.tsx
252
src/app/page.tsx
@@ -32,22 +32,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Portfolio",
|
||||
id: "#portfolio",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Portfolio", id: "#portfolio" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Tech Systems Co."
|
||||
/>
|
||||
@@ -55,42 +43,17 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Empowering Future Technology"
|
||||
description="Tech Systems Company provides cutting-edge IT support, cybersecurity, AI tools, and enterprise software solutions to scale your business and secure your digital future."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Get Started", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/server-cabinets-data-center-maintaining-large-scale-ai-datasets_482257-124181.jpg",
|
||||
imageAlt: "Server Infrastructure",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technological-blue-background-circuit_1017-3795.jpg",
|
||||
imageAlt: "Device Ecosystem",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fiber-optics-lights-abstract-background_23-2148241393.jpg",
|
||||
imageAlt: "AI Network",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blockchain-technology-cartoon-illustration_23-2151572163.jpg",
|
||||
imageAlt: "Cyber Security",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg",
|
||||
imageAlt: "Software Tools",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/billboard-with-fake-news-message_23-2148876043.jpg",
|
||||
imageAlt: "Graphic Design",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/server-cabinets-data-center-maintaining-large-scale-ai-datasets_482257-124181.jpg", imageAlt: "Server Infrastructure" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/technological-blue-background-circuit_1017-3795.jpg", imageAlt: "Device Ecosystem" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/fiber-optics-lights-abstract-background_23-2148241393.jpg", imageAlt: "AI Network" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/blockchain-technology-cartoon-illustration_23-2151572163.jpg", imageAlt: "Cyber Security" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg", imageAlt: "Software Tools" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/billboard-with-fake-news-message_23-2148876043.jpg", imageAlt: "Graphic Design" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -100,26 +63,10 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Delivering Measurable Impact"
|
||||
metrics={[
|
||||
{
|
||||
icon: CheckCircle,
|
||||
label: "Client Satisfaction",
|
||||
value: "99%",
|
||||
},
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Security Uptime",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
label: "Processing Speed",
|
||||
value: "450%",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Projects Completed",
|
||||
value: "850+",
|
||||
},
|
||||
{ icon: CheckCircle, label: "Client Satisfaction", value: "99%" },
|
||||
{ icon: ShieldCheck, label: "Security Uptime", value: "100%" },
|
||||
{ icon: Zap, label: "Processing Speed", value: "450%" },
|
||||
{ icon: Award, label: "Projects Completed", value: "850+" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -131,23 +78,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "IT Support",
|
||||
description: "24/7 technical assistance for all your hardware and network requirements.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-cleaning-her-laptop-key-board_23-2149402395.jpg",
|
||||
imageAlt: "IT Support",
|
||||
},
|
||||
title: "IT Support", description: "24/7 technical assistance for all your hardware and network requirements.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-cleaning-her-laptop-key-board_23-2149402395.jpg", imageAlt: "IT Support"},
|
||||
{
|
||||
title: "Cyber Security",
|
||||
description: "Advanced threat detection, firewall management, and digital identity protection.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-data-center_23-2151997031.jpg",
|
||||
imageAlt: "Security",
|
||||
},
|
||||
title: "Cyber Security", description: "Advanced threat detection, firewall management, and digital identity protection.", imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-data-center_23-2151997031.jpg", imageAlt: "Security"},
|
||||
{
|
||||
title: "School & Business Software",
|
||||
description: "Custom platforms for managing education and corporate workflows efficiently.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0jyu4l",
|
||||
imageAlt: "Software",
|
||||
},
|
||||
title: "School & Business Software", description: "Custom platforms for managing education and corporate workflows efficiently.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0jyu4l", imageAlt: "Software"},
|
||||
]}
|
||||
title="Our Specialized Solutions"
|
||||
description="Tailored technology systems to solve complex business and educational challenges."
|
||||
@@ -161,42 +96,12 @@ export default function LandingPage() {
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Web Design",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/communication-social-media-icons-keyboard_23-2150781065.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Server Setup",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-hallways-background_23-2149745363.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "AI Automation",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/engineer-writes-ai-code-laptop_482257-96435.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Security Hardening",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-time-machines-design_23-2151599356.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Graphic Design",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/senior-call-center-agent-helping-customers-regain-access-accounts_482257-126627.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Online Coupons",
|
||||
price: "Unlimited",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cyber-security-expert-working-with-technology-neon-lights_23-2151645683.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Web Design", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/communication-social-media-icons-keyboard_23-2150781065.jpg" },
|
||||
{ id: "p2", name: "Server Setup", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/minimalist-hallways-background_23-2149745363.jpg" },
|
||||
{ id: "p3", name: "AI Automation", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/engineer-writes-ai-code-laptop_482257-96435.jpg" },
|
||||
{ id: "p4", name: "Security Hardening", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-time-machines-design_23-2151599356.jpg" },
|
||||
{ id: "p5", name: "Graphic Design", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/senior-call-center-agent-helping-customers-regain-access-accounts_482257-126627.jpg" },
|
||||
{ id: "p6", name: "Online Coupons", price: "Unlimited", imageSrc: "http://img.b2bpic.net/free-photo/cyber-security-expert-working-with-technology-neon-lights_23-2151645683.jpg" },
|
||||
]}
|
||||
title="Portfolio Showcase"
|
||||
description="Featured projects demonstrating our 3D, design, and development capabilities."
|
||||
@@ -210,26 +115,11 @@ export default function LandingPage() {
|
||||
rating={5}
|
||||
author="Marcus Thorne, Tech Director"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-handsome-man-car-showroom_1303-17444.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-happy-young-businesswoman-lift-hands-up-does-fist-pump-celebrates-victory-wins-smth-achi_1258-123471.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-sceptical-creative-man-green-blazer-dark-background_613910-3829.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-handsome-man-car-showroom_1303-17444.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-happy-young-businesswoman-lift-hands-up-does-fist-pump-celebrates-victory-wins-smth-achi_1258-123471.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-sceptical-creative-man-green-blazer-dark-background_613910-3829.jpg", alt: "Client 5" },
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
@@ -242,39 +132,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "plan1",
|
||||
badge: "Essential",
|
||||
price: "R 499",
|
||||
subtitle: "For small business",
|
||||
features: [
|
||||
"IT Support",
|
||||
"Basic Security",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "plan2",
|
||||
badge: "Advanced",
|
||||
price: "R 999",
|
||||
subtitle: "For growth-focused",
|
||||
features: [
|
||||
"Everything in Essential",
|
||||
"AI Tools",
|
||||
"Unlimited Coupons",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "plan3",
|
||||
badge: "Enterprise",
|
||||
price: "Custom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/golden-gift-box-with-deer-stars_187299-46480.jpg",
|
||||
subtitle: "For large organizations",
|
||||
features: [
|
||||
"Full Stack Management",
|
||||
"Server Installations",
|
||||
"Custom Software",
|
||||
],
|
||||
},
|
||||
{ id: "plan1", badge: "Essential", price: "R 499", subtitle: "For small business", features: ["IT Support", "Basic Security"] },
|
||||
{ id: "plan2", badge: "Advanced", price: "R 999", subtitle: "For growth-focused", features: ["Everything in Essential", "AI Tools", "Unlimited Coupons"] },
|
||||
{ id: "plan3", badge: "Enterprise", price: "Custom", subtitle: "For large organizations", features: ["Full Stack Management", "Server Installations", "Custom Software"] },
|
||||
]}
|
||||
title="Flexible Service Plans"
|
||||
description="Packages to suit businesses and educational institutions of all sizes."
|
||||
@@ -285,21 +145,9 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Do you support remote IT?",
|
||||
content: "Yes, we provide 24/7 remote monitoring and support globally.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Can you design custom software?",
|
||||
content: "Absolutely. Our development team builds tailored solutions for education and business.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "What security measures do you take?",
|
||||
content: "We implement multi-layered encryption, threat detection, and regular audits.",
|
||||
},
|
||||
{ id: "1", title: "Do you support remote IT?", content: "Yes, we provide 24/7 remote monitoring and support globally." },
|
||||
{ id: "2", title: "Can you design custom software?", content: "Absolutely. Our development team builds tailored solutions for education and business." },
|
||||
{ id: "3", title: "What security measures do you take?", content: "We implement multi-layered encryption, threat detection, and regular audits." },
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Need more info? Here are common queries about our tech solutions."
|
||||
@@ -310,9 +158,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "cell-wave",
|
||||
}}
|
||||
background={{ variant: "cell-wave" }}
|
||||
tag="Contact Us"
|
||||
title="Ready to Scale? Connect Now."
|
||||
description="Email: techsystems576@gmail.com | Phone: +27 84 567 0292. Follow us on Facebook, Instagram, and X @ Tech systems Inc."
|
||||
@@ -324,26 +170,10 @@ export default function LandingPage() {
|
||||
logoText="Tech Systems Co."
|
||||
copyrightText="© 2025 Tech systems Inc. All rights reserved."
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Facebook,
|
||||
href: "https://facebook.com",
|
||||
ariaLabel: "Facebook",
|
||||
},
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "https://instagram.com",
|
||||
ariaLabel: "Instagram",
|
||||
},
|
||||
{
|
||||
icon: Twitter,
|
||||
href: "https://twitter.com",
|
||||
ariaLabel: "X",
|
||||
},
|
||||
{
|
||||
icon: MessageCircle,
|
||||
href: "https://wa.me/27845670292",
|
||||
ariaLabel: "WhatsApp",
|
||||
},
|
||||
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
|
||||
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
|
||||
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "X" },
|
||||
{ icon: MessageCircle, href: "https://wa.me/27845670292", ariaLabel: "WhatsApp" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user