Initial commit
This commit is contained in:
263
src/app/projects/page.tsx
Normal file
263
src/app/projects/page.tsx
Normal file
@@ -0,0 +1,263 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
||||
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
|
||||
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
||||
import FooterMedia from "@/components/sections/footer/FooterMedia";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import { ImageIcon, Zap, Phone } from "lucide-react";
|
||||
|
||||
export default function ProjectsPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Projects", id: "/projects" },
|
||||
{ name: "About", id: "/about" },
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="smallMedium"
|
||||
sizing="large"
|
||||
background="floatingGradient"
|
||||
cardStyle="soft-shadow"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
{/* Navbar */}
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="Startec Construction"
|
||||
navItems={navItems.map((item) => ({
|
||||
name: item.name,
|
||||
id: item.id === "/" ? "/" : item.id,
|
||||
}))}
|
||||
button={{
|
||||
text: "Get Consultation",
|
||||
href: "/contact",
|
||||
}}
|
||||
animateOnLoad={true}
|
||||
navItemClassName="text-sm font-medium tracking-wide hover:text-primary-cta transition-colors"
|
||||
buttonClassName="bg-primary-cta hover:bg-opacity-90 text-primary-cta-text"
|
||||
buttonTextClassName="font-semibold"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Projects Gallery */}
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardOne
|
||||
title="Our Complete Project Gallery"
|
||||
description="Browse our extensive portfolio of completed renovations. Each project showcases our commitment to excellence, innovative design solutions, and premium craftsmanship across HDB, condo, and luxury residential spaces."
|
||||
tag="Before & After Gallery"
|
||||
tagIcon={ImageIcon}
|
||||
tagAnimation="slide-up"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Modern HDB Transformation",
|
||||
price: "Completed 2024",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/creative-people-talking-office_23-2147668785.jpg",
|
||||
imageAlt: "Modern HDB renovation project",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Luxury Condo Makeover",
|
||||
price: "Completed 2024",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-lounge-room-interior-office-building_1262-12374.jpg",
|
||||
imageAlt: "Luxury condo renovation project",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Premium Kitchen Suite",
|
||||
price: "Completed 2023",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-enjoying-quality-time-home_23-2149262112.jpg",
|
||||
imageAlt: "Premium kitchen renovation project",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Spa-Inspired Bathroom",
|
||||
price: "Completed 2023",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/backlit-mirror-minimalist-sink-spa-bathroom_169016-68891.jpg",
|
||||
imageAlt: "Luxury bathroom renovation project",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Custom Carpentry Showcase",
|
||||
price: "Completed 2024",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-starting-own-small-business-home-workshop_1163-3122.jpg",
|
||||
imageAlt: "Custom carpentry project showcase",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Complete Home Renovation",
|
||||
price: "Completed 2023",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/interior-shot-luxurious-house-dining-room_181624-10412.jpg",
|
||||
imageAlt: "Complete home renovation project",
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
gridVariant="bento-grid"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Project Impact Metrics */}
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
title="Our Project Excellence"
|
||||
description="Demonstrating our commitment to quality, timely delivery, and customer satisfaction across every renovation project we undertake."
|
||||
tag="Project Achievements",
|
||||
tagIcon={Zap}
|
||||
tagAnimation="slide-up"
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "150+",
|
||||
title: "Successful Projects",
|
||||
items: [
|
||||
"HDB renovations completed",
|
||||
"Condo transformations",
|
||||
"Luxury home upgrades",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "98%",
|
||||
title: "Client Satisfaction",
|
||||
items: [
|
||||
"5-star reviews and ratings",
|
||||
"Repeat clients and referrals",
|
||||
"Long-term relationships",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "10+",
|
||||
title: "Years Experience",
|
||||
items: [
|
||||
"Industry expertise and knowledge",
|
||||
"Award-winning designs",
|
||||
"Proven track record",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
value: "20+",
|
||||
title: "Design Awards",
|
||||
items: [
|
||||
"Recognition for excellence",
|
||||
"Innovation in renovation",
|
||||
"Premium craftsmanship accolades",
|
||||
],
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Contact Section */}
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Get Started"
|
||||
title="Interested in Your Next Renovation?"
|
||||
description="Browse our projects for inspiration and then schedule a consultation with our design team. Let's discuss how we can transform your space into something extraordinary."
|
||||
tagIcon={Phone}
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
inputPlaceholder="Your email address"
|
||||
buttonText="Get Free Consultation"
|
||||
termsText="We respect your privacy. We'll only contact you regarding your renovation consultation."
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/interior-shot-luxurious-house-dining-room_181624-10412.jpg"
|
||||
imageAlt="Luxury home interior renovation inspiration"
|
||||
logoText="Startec Construction Pte Ltd"
|
||||
copyrightText="© 2024 Startec Construction. All rights reserved. Singapore's Premium Renovation Partner."
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "HDB Renovation",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Condo Renovation",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Kitchen Remodel",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Bathroom Remodel",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Carpentry Services",
|
||||
href: "/services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Our Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "Testimonials",
|
||||
href: "/",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
{
|
||||
label: "WhatsApp",
|
||||
href: "https://wa.me/6581234567",
|
||||
},
|
||||
{
|
||||
label: "Email",
|
||||
href: "mailto:info@startec.sg",
|
||||
},
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "https://instagram.com",
|
||||
},
|
||||
{
|
||||
label: "Facebook",
|
||||
href: "https://facebook.com",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user