bender/693f79d8-6475-457a-8ce4-8ca713b7487a
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #2

Merged
bender merged 3 commits from version_2 into main 2026-03-27 21:18:50 +00:00
Conversation 0 Commits 3 Files Changed 3 +170 -286
3 changed files with 170 additions and 286 deletions
Download Patch File Download Diff File Expand all files Collapse all files

375
src/app/page.tsx
View File

@@ -4,12 +4,12 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterBase from '@/components/sections/footer/FooterBase';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import { CheckCircle, Gauge, Settings, Shield, Zap } from "lucide-react";
import { CheckCircle, Gauge, Settings, Shield, Zap, Facebook, Instagram, Linkedin, Mail, MapPin, Phone } from "lucide-react";
export default function LandingPage() {
return (
@@ -26,293 +26,102 @@ export default function LandingPage() {
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Services",
id: "services",
},
{
name: "Products",
id: "products",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="GBR Robocolor"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Products", id: "products" },
{ name: "Contact", id: "contact" },
]}
brandName="GBR Robocolor"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "gradient-bars",
}}
title="Advanced Surface Coating & Automotive Painting Solutions"
description="Delivering precision, durability, and innovation in industrial coating."
kpis={[
{
value: "15+",
label: "Years Experience",
},
{
value: "500+",
label: "Projects Completed",
},
{
value: "99%",
label: "Client Satisfaction",
},
]}
enableKpiAnimation={true}
buttons={[
{
text: "Explore Products",
href: "#products",
},
{
text: "Contact Us",
href: "#contact",
},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/industrial-automotive-painting-scene-wit-1774646099699-7c28f07d.png"
mediaAnimation="slide-up"
videoSrc="https://www.w3schools.com/howto/movie.mp4"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{ variant: "gradient-bars" }}
title="Advanced Surface Coating & Automotive Painting Solutions"
description="Delivering precision, durability, and innovation in industrial coating."
kpis={[
{ value: "15+", label: "Years Experience" },
{ value: "500+", label: "Projects Completed" },
{ value: "99%", label: "Client Satisfaction" },
]}
enableKpiAnimation={true}
buttons={[{ text: "Explore Products", href: "#products" }, { text: "Contact Us", href: "#contact" }]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/industrial-automotive-painting-scene-wit-1774646099699-7c28f07d.png"
mediaAnimation="slide-up"
videoSrc="https://www.w3schools.com/howto/movie.mp4"
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
useInvertedBackground={false}
heading={[
{
type: "text",
content: "About GBR Robocolor",
},
{
type: "image",
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/close-up-shot-of-high-precision-industri-1774646097787-db806f43.png",
alt: "Engineering precision",
},
]}
buttons={[
{
text: "Learn More",
href: "#",
},
]}
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
useInvertedBackground={false}
heading={[
{ type: "text", content: "About GBR Robocolor" },
{ type: "image", src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/close-up-shot-of-high-precision-industri-1774646097787-db806f43.png", alt: "Engineering precision" },
]}
buttons={[{ text: "Learn More", href: "#" }]}
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyFive
animationType="depth-3d"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
title: "Automotive Component Painting",
description: "Precision painting services for automotive exterior and interior components.",
icon: Zap,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=1",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/robotic-factory-floor-with-metallic-refl-1774646097584-a28bf7e3.png?_wi=1",
},
],
},
{
title: "Industrial Coating",
description: "Heavy-duty coating solutions for industrial machinery and parts.",
icon: Shield,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/close-up-metal-surface-finishing-texture-1774646097565-8ed0ad06.png?_wi=1",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/industrial-factory-lighting-with-clean-m-1774646097950-de5f55dc.png?_wi=1",
},
],
},
{
title: "Surface Finishing Solutions",
description: "Advanced finishing techniques for durability and aesthetics.",
icon: Settings,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-center-console-finisher-with--1774646097535-3c06649d.png?_wi=1",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-door-handle-or-controller-pan-1774646098072-5eba4e95.png?_wi=1",
},
],
},
{
title: "Robotic Automation",
description: "State-of-the-art robotic systems for consistent paint application.",
icon: Gauge,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/robotic-factory-floor-with-metallic-refl-1774646097584-a28bf7e3.png?_wi=2",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/industrial-factory-lighting-with-clean-m-1774646097950-de5f55dc.png?_wi=2",
},
],
},
{
title: "Quality Inspection",
description: "Rigorous testing protocols ensuring every part meets industrial standards.",
icon: CheckCircle,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=2",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/close-up-metal-surface-finishing-texture-1774646097565-8ed0ad06.png?_wi=2",
},
],
},
]}
title="Our Capabilities"
description="Specialized surface finishing solutions for industrial and automotive sectors."
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyFive
animationType="depth-3d"
textboxLayout="split"
useInvertedBackground={true}
features={[
{ title: "Automotive Component Painting", description: "Precision painting services.", icon: Zap, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/robotic-factory-floor-with-metallic-refl-1774646097584-a28bf7e3.png?_wi=1" }] },
{ title: "Industrial Coating", description: "Heavy-duty coating solutions.", icon: Shield, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/close-up-metal-surface-finishing-texture-1774646097565-8ed0ad06.png?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/industrial-factory-lighting-with-clean-m-1774646097950-de5f55dc.png?_wi=1" }] },
{ title: "Surface Finishing Solutions", description: "Advanced techniques.", icon: Settings, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-center-console-finisher-with--1774646097535-3c06649d.png?_wi=1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-door-handle-or-controller-pan-1774646098072-5eba4e95.png?_wi=1" }] },
{ title: "Robotic Automation", description: "State-of-the-art robotic systems.", icon: Gauge, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/robotic-factory-floor-with-metallic-refl-1774646097584-a28bf7e3.png?_wi=2" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/industrial-factory-lighting-with-clean-m-1774646097950-de5f55dc.png?_wi=2" }] },
{ title: "Quality Inspection", description: "Rigorous testing protocols.", icon: CheckCircle, mediaItems: [{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=2" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/close-up-metal-surface-finishing-texture-1774646097565-8ed0ad06.png?_wi=2" }] },
]}
title="Our Capabilities"
description="Specialized surface finishing solutions for industrial and automotive sectors."
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Nexon Interiors",
price: "View Details",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=3",
},
{
id: "p2",
name: "Tiago Interiors",
price: "View Details",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-center-console-finisher-with--1774646097535-3c06649d.png?_wi=2",
},
{
id: "p3",
name: "Harrier Interiors",
price: "View Details",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-door-handle-or-controller-pan-1774646098072-5eba4e95.png?_wi=2",
},
{
id: "p4",
name: "Tata Zest Fascia",
price: "View Details",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=4",
},
{
id: "p5",
name: "Safari Trim Pack",
price: "View Details",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-center-console-finisher-with--1774646097535-3c06649d.png?_wi=3",
},
]}
title="Our Products"
description="Premium range of interior components and fascia solutions."
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
animationType="slide-up"
gridVariant="four-items-2x2-equal-grid"
products={[
{ id: "p1", name: "Nexon Interiors", price: "View Details", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=3" },
{ id: "p2", name: "Tiago Interiors", price: "View Details", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-center-console-finisher-with--1774646097535-3c06649d.png?_wi=2" },
{ id: "p3", name: "Harrier Interiors", price: "View Details", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-door-handle-or-controller-pan-1774646098072-5eba4e95.png?_wi=2" },
{ id: "p4", name: "Tata Zest Fascia", price: "View Details", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png?_wi=4" },
{ id: "p5", name: "Safari Trim Pack", price: "View Details", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/automotive-center-console-finisher-with--1774646097535-3c06649d.png?_wi=3" },
]}
title="Our Products"
description="Premium range of interior components and fascia solutions."
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "rotated-rays-static",
}}
tag="Get In Touch"
title="Connect With GBR Robocolor"
description="Reach out for industrial coating inquiries. Pune & Ahmedabad locations available."
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{ variant: "rotated-rays-static" }}
tag="Get In Touch"
title="Connect With GBR Robocolor"
description="Reach out for industrial coating inquiries. Pune & Ahmedabad locations available."
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{
title: "Company",
items: [
{
label: "About",
href: "#about",
},
{
label: "Services",
href: "#services",
},
{
label: "Careers",
href: "#",
},
{
label: "Compliance",
href: "#",
},
],
},
{
title: "Products",
items: [
{
label: "Automotive Interior",
href: "#products",
},
{
label: "Industrial",
href: "#products",
},
{
label: "Custom Coating",
href: "#",
},
{
label: "Finishing Kits",
href: "#",
},
],
},
{
title: "Contact",
items: [
{
label: "Pune: +91 9011051305",
href: "#contact",
},
{
label: "Ahmedabad",
href: "#contact",
},
{
label: "Support",
href: "#",
},
],
},
]}
logoText="GBR Robocolor"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="GBR Robocolor"
copyrightText="© 2025 GBR Robocolor | All Rights Reserved"
socialLinks={[
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
{ icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);

75
src/app/product/[id]/page.tsx Normal file
View File

@@ -0,0 +1,75 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import FooterBase from '@/components/sections/footer/FooterBase';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import { useParams } from 'next/navigation';
export default function ProductDetailPage() {
const params = useParams();
const productData = {
title: "Product Detail: " + (params.id as string || "Item"),
description: "Detailed view of our precision-engineered component with high-quality finishes.", items: [
{ id: "p1", title: "Dashboard Panel Mid", description: "High-durability mid-section panel with luxury finish.", tag: "Interior" },
{ id: "p2", title: "Deco Finisher", description: "Decorative trim for refined aesthetics.", tag: "Trim" },
{ id: "p3", title: "Console Rear Finisher", description: "Precision-molded console component.", tag: "Interior" },
{ id: "p4", title: "Controller Panel", description: "Ergonomic control interface panel.", tag: "Control" },
{ id: "p5", title: "Front Inside Panel", description: "Reinforced interior door panel assembly.", tag: "Structural" },
]
};
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="smallMedium"
sizing="mediumSizeLargeTitles"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "/" },
{ name: "Products", id: "/#products" },
{ name: "Contact", id: "/#contact" },
]}
brandName="GBR Robocolor"
/>
</div>
<div id="detail" data-section="detail" className="py-20">
<FeatureCardMedia
title={productData.title}
description={productData.description}
animationType="blur-reveal"
textboxLayout="split"
useInvertedBackground={false}
features={productData.items.map(item => ({
...item,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXr3kg0u7laX1YirWrEUvPBuL5/luxury-car-dashboard-panel-finished-with-1774646097481-6d575ba3.png", imageAlt: item.title
}))}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
columns={[
{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Products", href: "/#products" }] },
{ title: "Contact", items: [{ label: "Pune: +91 9011051305", href: "/#contact" }] }
]}
logoText="GBR Robocolor"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

6
src/app/styles/variables.css
View File

@@ -15,10 +15,10 @@
--foreground: #ffffff;
--primary-cta: #ff6207;
--primary-cta-text: #ffffff;
--secondary-cta: #1a1a1a;
--secondary-cta: #1f1f1f;
--secondary-cta-text: #ffffff;
--accent: #535353;
--background-accent: #1f1f1f;
--accent: #737373;
--background-accent: #535353;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);