Add src/app/projects/page.tsx

2026-03-06 20:18:37 +00:00
parent 712c4a31de
commit 77fb27da3c
1 changed files with 108 additions and 0 deletions
--- a/src/app/projects/page.tsx
+++ b/src/app/projects/page.tsx
@@ -0,0 +1,108 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import ProductCardOne from "@/components/sections/product/ProductCardOne";
+import ContactCenter from "@/components/sections/contact/ContactCenter";
+import FooterCard from "@/components/sections/footer/FooterCard";
+import { Image, Mail, Twitter, Linkedin } from "lucide-react";
+
+export default function ProjectsPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="directional-hover"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="rounded"
+      contentWidth="smallMedium"
+      sizing="mediumLargeSizeMediumTitles"
+      background="circleGradient"
+      cardStyle="gradient-radial"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="solid"
+      headingFontWeight="semibold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          brandName="Alfabs"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Services", id: "/services" },
+            { name: "About", id: "/about" },
+            { name: "Projects", id: "/projects" },
+            { name: "Contact", id: "/contact" },
+          ]}
+          bottomLeftText="Aluminum Excellence"
+          bottomRightText="hello@alfabs.com"
+        />
+      </div>
+
+      <div id="projects" data-section="projects">
+        <ProductCardOne
+          title="Featured Projects"
+          description="Showcasing our finest work across residential and commercial sectors in Karachi. Each project represents our commitment to quality, precision, and customer satisfaction. From modern office complexes to luxury residential developments, explore how Alfabs has transformed architectural visions into reality."
+          tag="Portfolio"
+          tagIcon={Image}
+          products={[
+            {
+              id: "1",              name: "Downtown Office Complex",              price: "Commercial",              imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-skyscrapers_1359-44.jpg?_wi=2",              imageAlt: "Downtown office building with aluminum facades"
+            },
+            {
+              id: "2",              name: "Luxury Residential Tower",              price: "Residential",              imageSrc: "http://img.b2bpic.net/free-photo/modern-design-stone-building_23-2148252734.jpg?_wi=3",              imageAlt: "Modern residential tower with premium aluminum systems"
+            },
+            {
+              id: "3",              name: "Retail Center Renovation",              price: "Commercial",              imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-skyscrapers_1359-44.jpg?_wi=3",              imageAlt: "Retail center with modern aluminum storefronts"
+            },
+            {
+              id: "4",              name: "Corporate Headquarters",              price: "Commercial",              imageSrc: "http://img.b2bpic.net/free-photo/modern-design-stone-building_23-2148252734.jpg?_wi=4",              imageAlt: "Corporate headquarters with custom aluminum facade"
+            },
+            {
+              id: "5",              name: "Residential Complex",              price: "Residential",              imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-skyscrapers_1359-44.jpg?_wi=4",              imageAlt: "Multi-story residential complex with aluminum windows and doors"
+            },
+            {
+              id: "6",              name: "Shopping Mall Extension",              price: "Commercial",              imageSrc: "http://img.b2bpic.net/free-photo/modern-design-stone-building_23-2148252734.jpg?_wi=5",              imageAlt: "Shopping mall extension with modern aluminum design"
+            },
+          ]}
+          gridVariant="three-columns-all-equal-width"
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={true}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactCenter
+          tag="Get In Touch"
+          title="Start Your Next Project"
+          description="Ready to bring your vision to life? Contact our team today to discuss your aluminum fabrication and installation requirements."
+          tagIcon={Mail}
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+          inputPlaceholder="your@email.com"
+          buttonText="Send Inquiry"
+          termsText="We respect your privacy. Your information will be used only to assist with your project inquiry."
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="Alfabs"
+          copyrightText="© 2025 Alfabs Aluminum Services. All rights reserved."
+          socialLinks={[
+            {
+              icon: Linkedin,
+              href: "https://linkedin.com",              ariaLabel: "LinkedIn"
+            },
+            {
+              icon: Twitter,
+              href: "https://twitter.com",              ariaLabel: "Twitter"
+            },
+            {
+              icon: Mail,
+              href: "mailto:hello@alfabs.com",              ariaLabel: "Email"
+            },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}