Merge version_2 into main

Merge version_2 into main
This commit was merged in pull request #2.
This commit is contained in:
2026-03-25 06:34:46 +00:00
3 changed files with 169 additions and 47 deletions

70
src/app/about-us/page.tsx Normal file
View File

@@ -0,0 +1,70 @@
"use client";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Award, Star, Headphones } from "lucide-react";
export default function AboutUsPage() {
const commonNavItems = [
{ name: "Services", id: "/services-page" },
{ name: "About Us", id: "/about-us" },
{ name: "Projects", id: "projects" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" }
];
const commonFooterColumns = [
{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services-page" }, { label: "Projects", href: "#projects" }] },
{ items: [{ label: "About Us", href: "/about-us" }, { label: "Testimonials", href: "#testimonials" }, { label: "Contact", href: "#contact" }] },
{ items: [{ label: "Call Us: +92 300 1234567", href: "tel:+923001234567" }, { label: "Email: info@yourcompany.com", href: "mailto:info@yourcompany.com" }, { label: "WhatsApp Us", href: "https://wa.me/923001234567" }] }
];
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="reveal-blur"
borderRadius="pill"
contentWidth="small"
sizing="mediumLargeSizeLargeTitles"
background="fluid"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
brandName="CCTV & Solar Solutions"
navItems={commonNavItems}
bottomLeftText="Lahore & Punjab"
bottomRightText="+92 300 1234567"
/>
</div>
<div id="about-us-section" data-section="about-us-section">
<SplitAbout
title="About Our Company"
description="We are a leading provider of CCTV and solar solutions in Lahore and across Punjab, dedicated to enhancing security and promoting sustainable energy for our community. With years of expertise, certified technicians, and a customer-first approach, we ensure top-quality installations and reliable support."
bulletPoints={[
{ title: "Our Mission", description: "To deliver advanced, reliable, and cost-effective security and solar energy solutions.", icon: Award },
{ title: "Our Vision", description: "To be the most trusted partner in Punjab for integrated smart living solutions.", icon: Star },
{ title: "Our Values", description: "Integrity, innovation, customer satisfaction, and environmental responsibility.", icon: Headphones }
]}
mediaAnimation="slide-up"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/a-professional-team-of-cctv-and-solar-te-1774418442329-c68cab70.png"
imageAlt="Our Team"
imagePosition="right"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="CCTV & Solar Solutions"
columns={commonFooterColumns}
/>
</div>
</ThemeProvider>
);
}

80
src/app/blog/page.tsx Normal file
View File

@@ -0,0 +1,80 @@
"use client";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Sparkles } from "lucide-react"; // For the blog section tagIcon
export default function BlogPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="reveal-blur"
borderRadius="pill"
contentWidth="small"
sizing="mediumLargeSizeLargeTitles"
background="fluid"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
{/* Navbar - copied from home page, but updated for Blog link */}
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
brandName="CCTV & Solar Solutions"
navItems={[
{ name: "Services", id: "services" },
{ name: "Why Choose Us", id: "why-choose-us" },
{ name: "Projects", id: "projects" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" },
{ name: "Blog", id: "/blog" } // Updated nav item for blog
]}
bottomLeftText="Lahore & Punjab"
bottomRightText="+92 300 1234567"
/>
</div>
{/* Blog Section */}
<div id="blog" data-section="blog">
<BlogCardOne
title="Our Latest Insights"
description="Stay updated with our articles on CCTV security, solar energy, industry trends, and more."
tag="Blog"
tagIcon={Sparkles}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
blogs={[
{
id: "1", category: "Solar Energy", title: "The Future of Solar in Punjab", excerpt: "Explore how solar energy is transforming homes and businesses across Punjab.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/solar-panels-on-rooftop-with-skyline-background.png", authorName: "Ahmed Khan", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/person-avatar-male.png", date: "July 20, 2024"
},
{
id: "2", category: "CCTV Security", title: "Choosing the Right CCTV System for Your Home", excerpt: "A comprehensive guide to selecting and installing the best security cameras for residential properties.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/modern-outdoor-security-cameras.png", authorName: "Sara Ali", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/person-avatar-female.png", date: "July 15, 2024"
},
{
id: "3", category: "Hybrid Solutions", title: "Integrating Solar with Your Security System", excerpt: "Learn the benefits of combining solar power with your CCTV for enhanced resilience and cost savings.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/solar-powered-security-camera.png", authorName: "Usman Tariq", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/person-avatar-male-2.png", date: "July 10, 2024"
},
{
id: "4", category: "Maintenance", title: "Tips for Maintaining Your Solar Panels", excerpt: "Maximize the efficiency and lifespan of your solar investment with these simple maintenance tips.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/solar-panel-maintenance.png", authorName: "Ayesha Noor", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/person-avatar-female-2.png", date: "July 05, 2024"
}
]}
/>
</div>
{/* Footer - copied from home page, but updated for Blog link */}
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="CCTV & Solar Solutions"
columns={[
{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "#services" }, { label: "Projects", href: "#projects" }, { label: "Blog", href: "/blog" }] }, // Updated with blog link
{ items: [{ label: "Why Choose Us", href: "#why-choose-us" }, { label: "Testimonials", href: "#testimonials" }, { label: "Contact", href: "#contact" }] },
{ items: [{ label: "Call Us: +92 300 1234567", href: "tel:+923001234567" }, { label: "Email: info@yourcompany.com", href: "mailto:info@yourcompany.com" }, { label: "WhatsApp Us", href: "https://wa.me/923001234567" }] }
]}
/>
</div>
</ThemeProvider>
);
}

View File

@@ -2,8 +2,7 @@
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import SplitAbout from '@/components/sections/about/SplitAbout';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
@@ -12,6 +11,20 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { MapPin, Award, Headphones, DollarSign, Star } from "lucide-react";
export default function LandingPage() {
const commonNavItems = [
{ name: "Services", id: "/services-page" },
{ name: "About Us", id: "/about-us" },
{ name: "Projects", id: "projects" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" }
];
const commonFooterColumns = [
{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services-page" }, { label: "Projects", href: "#projects" }] },
{ items: [{ label: "About Us", href: "/about-us" }, { label: "Testimonials", href: "#testimonials" }, { label: "Contact", href: "#contact" }] },
{ items: [{ label: "Call Us: +92 300 1234567", href: "tel:+923001234567" }, { label: "Email: info@yourcompany.com", href: "mailto:info@yourcompany.com" }, { label: "WhatsApp Us", href: "https://wa.me/923001234567" }] }
];
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
@@ -28,13 +41,7 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
brandName="CCTV & Solar Solutions"
navItems={[
{ name: "Services", id: "services" },
{ name: "Why Choose Us", id: "why-choose-us" },
{ name: "Projects", id: "projects" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" }
]}
navItems={commonNavItems}
bottomLeftText="Lahore & Punjab"
bottomRightText="+92 300 1234567"
/>
@@ -51,38 +58,7 @@ export default function LandingPage() {
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/modern-outdoor-security-cameras-and-sola-1774418442660-ab7202dd.png"
/>
</div>
<div id="services" data-section="services">
<FeatureCardOne
title="Our Services"
description="Providing peace of mind with advanced security and sustainable energy solutions."
features={[
{ title: "CCTV Installation", description: "Professional-grade surveillance systems for homes, offices, and commercial sites.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/an-illustration-of-a-modern-cctv-camera--1774418441595-781e6b69.png", imageAlt: "CCTV Installation", button: { text: "Learn More", href: "#contact" } },
{ title: "Solar Solutions", description: "Clean, renewable energy systems tailored for Punjabs climate and power needs.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/an-illustration-of-solar-panels-efficien-1774418442391-8165fffa.png", imageAlt: "Solar Solutions", button: { text: "Learn More", href: "#contact" } },
{ title: "Hybrid Systems", description: "Integrated solar-powered CCTV setups for maximum security and energy efficiency.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/an-illustration-depicting-an-integrated--1774418441683-0a0ac90e.png", imageAlt: "Hybrid Systems", button: { text: "Learn More", href: "#contact" } }
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="why-choose-us" data-section="why-choose-us">
<SplitAbout
title="Why Choose Us"
description="Our commitment to quality, expertise, and customer satisfaction sets us apart."
bulletPoints={[
{ title: "Local Experts", description: "Based in Lahore, we understand the unique needs of Punjabs residents.", icon: MapPin },
{ title: "Certified Technicians", description: "Our team is trained and certified in both security and solar technologies.", icon: Award },
{ title: "24/7 Support", description: "Were always available for maintenance, troubleshooting, and emergency help.", icon: Headphones },
{ title: "Affordable Packages", description: "Flexible pricing to suit homes, businesses, and institutions.", icon: DollarSign }
]}
mediaAnimation="slide-up"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BQPU2XvbmkOvuR7PxX9UHMCGI0/a-professional-team-of-cctv-and-solar-te-1774418442329-c68cab70.png"
imagePosition="right"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="projects" data-section="projects">
<ProductCardOne
title="Featured Projects"
@@ -132,13 +108,9 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="CCTV & Solar Solutions"
columns={[
{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "#services" }, { label: "Projects", href: "#projects" }] },
{ items: [{ label: "Why Choose Us", href: "#why-choose-us" }, { label: "Testimonials", href: "#testimonials" }, { label: "Contact", href: "#contact" }] },
{ items: [{ label: "Call Us: +92 300 1234567", href: "tel:+923001234567" }, { label: "Email: info@yourcompany.com", href: "mailto:info@yourcompany.com" }, { label: "WhatsApp Us", href: "https://wa.me/923001234567" }] }
]}
columns={commonFooterColumns}
/>
</div>
</ThemeProvider>
);
}
}