15 Commits

Author SHA1 Message Date
e8ea416dc1 Update src/app/work/page.tsx 2026-06-01 05:10:05 +00:00
d1f824898b Update src/app/work/page.tsx 2026-06-01 05:09:32 +00:00
1fdb7c49af Update src/app/contact/page.tsx 2026-06-01 05:09:31 +00:00
4e00408f7c Update src/app/about/page.tsx 2026-06-01 05:09:31 +00:00
328382eec6 Update src/app/work/page.tsx 2026-06-01 05:08:43 +00:00
a5ca0ad154 Add src/app/services/page.tsx 2026-06-01 05:08:43 +00:00
075e637271 Update src/app/page.tsx 2026-06-01 05:08:43 +00:00
7e0ecb0e0d Add src/app/contact/page.tsx 2026-06-01 05:08:42 +00:00
7a7670fad9 Add src/app/about/page.tsx 2026-06-01 05:08:42 +00:00
0fc3626d96 Merge version_2 into main
Merge version_2 into main
2026-06-01 05:02:59 +00:00
78277fada2 Update src/app/work/page.tsx 2026-06-01 05:02:53 +00:00
d6887ac55b Update src/app/page.tsx 2026-06-01 05:02:52 +00:00
05b27a0c00 Merge version_2 into main
Merge version_2 into main
2026-06-01 05:02:31 +00:00
b9c07bf37b Add src/app/work/page.tsx 2026-06-01 05:02:28 +00:00
27ba72252c Update src/app/page.tsx 2026-06-01 05:02:28 +00:00
5 changed files with 330 additions and 93 deletions

77
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,77 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import SplitAbout from "@/components/sections/about/SplitAbout";
import ContactText from "@/components/sections/contact/ContactText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Globe, Star, Users, Twitter, Instagram, Linkedin } from "lucide-react";
export default function AboutPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Services", id: "/services" },
{ name: "Work", id: "/work" },
{ name: "Contact", id: "/contact" }
];
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="aurora"
cardStyle="layered-gradient"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="Web Design Tech360"
button={{ text: "Get in Touch", href: "/contact" }}
/>
<div id="about" data-section="about">
<SplitAbout
title="About Web Design Tech360"
description="Web Design Tech360 is a leading digital agency dedicated to transforming businesses through innovative web design, development, and strategic digital marketing. With over 15 years of experience, we partner with clients worldwide to create impactful online experiences that drive growth and deliver measurable results."
tag="Our Story"
bulletPoints={[
{ title: "Mission", description: "To empower businesses with exceptional digital solutions that enhance their online presence and achieve their strategic objectives.", icon: Globe },
{ title: "Vision", description: "To be the go-to partner for transformative web design and digital growth, recognized for creativity, technical excellence, and client success.", icon: Star },
{ title: "Values", description: "Innovation, Integrity, Collaboration, Excellence, Client-Centricity.", icon: Users }
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/team/team1.webp"
imageAlt="Web Design Tech360 Team Collaboration"
mediaAnimation="slide-up"
useInvertedBackground={true}
textboxLayout="default"
/>
</div>
<ContactText
text="Ready to elevate your online presence? Let's build your next digital success story together."
buttons={[
{ text: "Start a Project", href: "/contact" },
{ text: "Schedule a Call", href: "/contact#schedule-call" }
]}
background={{ variant: "canvas-reveal" }}
useInvertedBackground={false}
/>
<FooterCard
logoText="Web Design Tech360"
copyrightText="© 2025 Web Design Tech360. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Follow us on Twitter" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Follow us on Instagram" },
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "Connect on LinkedIn" }
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

62
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,62 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import { Phone, Mail, Twitter, Instagram, Linkedin } from "lucide-react";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterCard from "@/components/sections/footer/FooterCard";
export default function ContactPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "/contact" }
];
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="aurora"
cardStyle="layered-gradient"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="Web Design Tech360"
button={{ text: "Get in Touch", href: "/contact" }}
/>
<div id="contact-cta" data-section="contact-cta">
<ContactCTA
tag="Contact Us"
tagIcon={Mail}
title="Get in Touch with Web Design Tech360"
description="Reach out to us via email or phone for inquiries, project discussions, or support."
buttons={[
{ text: "Email Us", href: "mailto:info@webdesigntech360.com" },
{ text: "Call Us", href: "tel:+919672864324" }
]}
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
/>
</div>
<FooterCard
logoText="Web Design Tech360"
copyrightText="© 2025 Web Design Tech360. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Follow us on Twitter" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Follow us on Instagram" },
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "Connect on LinkedIn" }
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -18,8 +18,7 @@ export default function WebAgencyThemePage() {
const navItems = [
{ name: "Home", id: "home" },
{ name: "Services", id: "services" },
{ name: "Work", id: "work" },
{ name: "Contact", id: "contact" },
{ name: "Contact", id: "/contact" }
];
return (
@@ -38,8 +37,8 @@ export default function WebAgencyThemePage() {
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="Studio"
button={{ text: "Get in Touch", href: "#contact" }}
brandName="Web Design Tech360"
button={{ text: "Get in Touch", href: "/contact" }}
/>
<HeroSplitKpi
background={{ variant: "radial-gradient" }}
@@ -55,12 +54,10 @@ export default function WebAgencyThemePage() {
]}
buttons={[
{
text: "Start Project",
href: "#contact",
text: "Start Project", href: "/contact"
},
{
text: "View Work",
href: "#work",
text: "View Work", href: "/work"
},
]}
avatars={[
@@ -102,37 +99,13 @@ export default function WebAgencyThemePage() {
tagIcon={Layers}
features={[
{
tag: "Service 01",
title: "01",
subtitle: "Web Development",
description: "Your website should be more than functional—it should resonate. We craft bespoke digital experiences that merge innovation with creativity, delivering intuitive, visually stunning platforms that captivate audiences, reflect your brand's essence, and adapt to future opportunities.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process1.webp",
imageAlt: "Web development",
},
tag: "Service 01", title: "01", subtitle: "Web Development", description: "Your website should be more than functional—it should resonate. We craft bespoke digital experiences that merge innovation with creativity, delivering intuitive, visually stunning platforms that captivate audiences, reflect your brand's essence, and adapt to future opportunities.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process1.webp", imageAlt: "Web development"},
{
tag: "Service 02",
title: "02",
subtitle: "Marketing",
description: "Impactful marketing goes beyond visibility—it creates connections. We fuse creativity with analytics to craft adaptive strategies that engage your audience authentically, keeping your brand relevant and resonant while delivering measurable results in an ever-evolving digital world.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process2.webp",
imageAlt: "Marketing",
},
tag: "Service 02", title: "02", subtitle: "Marketing", description: "Impactful marketing goes beyond visibility—it creates connections. We fuse creativity with analytics to craft adaptive strategies that engage your audience authentically, keeping your brand relevant and resonant while delivering measurable results in an ever-evolving digital world.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process2.webp", imageAlt: "Marketing"},
{
tag: "Service 03",
title: "03",
subtitle: "Design",
description: "Design is your brand's voice. We craft visuals and layouts that communicate purpose, inspire trust, and connect emotionally. By harmonizing artistry with intent, our designs transform user interactions into meaningful, memorable experiences that align with your identity.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process3.webp",
imageAlt: "Design",
},
tag: "Service 03", title: "03", subtitle: "Design", description: "Design is your brand's voice. We craft visuals and layouts that communicate purpose, inspire trust, and connect emotionally. By harmonizing artistry with intent, our designs transform user interactions into meaningful, memorable experiences that align with your identity.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process3.webp", imageAlt: "Design"},
{
tag: "Service 04",
title: "04",
subtitle: "Software Development",
description: "We build custom software that evolves with your business. By addressing unique challenges, our tailored solutions streamline workflows, eliminate inefficiencies, and foster innovation—empowering you to scale, adapt, and maintain a competitive edge in an ever-changing landscape.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process4.webp",
imageAlt: "Software development",
},
tag: "Service 04", title: "04", subtitle: "Software Development", description: "We build custom software that evolves with your business. By addressing unique challenges, our tailored solutions streamline workflows, eliminate inefficiencies, and foster innovation—empowering you to scale, adapt, and maintain a competitive edge in an ever-changing landscape.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process4.webp", imageAlt: "Software development"},
]}
textboxLayout="default"
useInvertedBackground={false}
@@ -159,53 +132,13 @@ export default function WebAgencyThemePage() {
tagIcon={Star}
testimonials={[
{
id: "1",
name: "Sarah Johnson",
date: "CEO, TechStart",
title: "Transformed Our Digital Presence",
quote: "Working with Studio was a game-changer for our startup. They delivered a website that not only looks stunning but converts visitors into customers at twice our previous rate.",
tag: "Web Development",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp",
avatarAlt: "Sarah Johnson",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp",
imageAlt: "TechStart project showcase",
},
id: "1", name: "Sarah Johnson", date: "CEO, TechStart", title: "Transformed Our Digital Presence", quote: "Working with Studio was a game-changer for our startup. They delivered a website that not only looks stunning but converts visitors into customers at twice our previous rate.", tag: "Web Development", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp", avatarAlt: "Sarah Johnson", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp?_wi=1", imageAlt: "TechStart project showcase"},
{
id: "2",
name: "Michael Chen",
date: "Founder, GrowthLab",
title: "Exceeded All Expectations",
quote: "The team's attention to detail and creative vision brought our brand to life in ways we never imagined. Our new platform has received incredible feedback from users.",
tag: "Brand Design",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp",
avatarAlt: "Michael Chen",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp",
imageAlt: "GrowthLab project showcase",
},
id: "2", name: "Michael Chen", date: "Founder, GrowthLab", title: "Exceeded All Expectations", quote: "The team's attention to detail and creative vision brought our brand to life in ways we never imagined. Our new platform has received incredible feedback from users.", tag: "Brand Design", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp", avatarAlt: "Michael Chen", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp?_wi=1", imageAlt: "GrowthLab project showcase"},
{
id: "3",
name: "Emily Rodriguez",
date: "Marketing Director, Elevate",
title: "A True Partnership",
quote: "From strategy to execution, Studio understood our vision and delivered beyond what we hoped for. The new website has become our most powerful marketing asset.",
tag: "E-commerce",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp",
avatarAlt: "Emil Svenson",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp",
imageAlt: "Elevate project showcase",
},
id: "3", name: "Emily Rodriguez", date: "Marketing Director, Elevate", title: "A True Partnership", quote: "From strategy to execution, Studio understood our vision and delivered beyond what we hoped for. The new website has become our most powerful marketing asset.", tag: "E-commerce", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp", avatarAlt: "Emil Svenson", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp?_wi=1", imageAlt: "Elevate project showcase"},
{
id: "4",
name: "David Park",
date: "CTO, InnovateCo",
title: "Technical Excellence",
quote: "The development team delivered a high-performance application that handles our complex requirements with ease. Their technical expertise is unmatched in the industry.",
tag: "Web Application",
avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp",
avatarAlt: "David Park",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp",
imageAlt: "InnovateCo project showcase",
},
id: "4", name: "David Park", date: "CTO, InnovateCo", title: "Technical Excellence", quote: "The development team delivered a high-performance application that handles our complex requirements with ease. Their technical expertise is unmatched in the industry.", tag: "Web Application", avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp", avatarAlt: "David Park", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp", imageAlt: "InnovateCo project showcase"},
]}
textboxLayout="default"
useInvertedBackground={false}
@@ -220,9 +153,7 @@ export default function WebAgencyThemePage() {
useInvertedBackground={false}
features={[
{
title: "Discovery & Strategy",
description: "We start by understanding your goals, audience, and market to build a roadmap tailored to your business.",
media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how1.webp", imageAlt: "Discovery and strategy" },
title: "Discovery & Strategy", description: "We start by understanding your goals, audience, and market to build a roadmap tailored to your business.", media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how1.webp", imageAlt: "Discovery and strategy" },
reverse: false,
items: [
{ icon: Code, text: "In-depth research and audits" },
@@ -231,9 +162,7 @@ export default function WebAgencyThemePage() {
],
},
{
title: "Design & Prototyping",
description: "We translate strategy into visual concepts, iterating with you until every detail feels right.",
media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how2.webp", imageAlt: "Design and prototyping" },
title: "Design & Prototyping", description: "We translate strategy into visual concepts, iterating with you until every detail feels right.", media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how2.webp", imageAlt: "Design and prototyping" },
reverse: true,
items: [
{ icon: Palette, text: "Wireframes and mockups" },
@@ -242,9 +171,7 @@ export default function WebAgencyThemePage() {
],
},
{
title: "Build & Launch",
description: "We develop, test, and deploy your project with precision, ensuring a smooth launch and measurable impact.",
media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how3.webp", imageAlt: "Build and launch" },
title: "Build & Launch", description: "We develop, test, and deploy your project with precision, ensuring a smooth launch and measurable impact.", media: { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how3.webp", imageAlt: "Build and launch" },
reverse: false,
items: [
{ icon: TrendingUp, text: "Agile development sprints" },
@@ -257,15 +184,15 @@ export default function WebAgencyThemePage() {
<ContactText
text="Ready to transform your digital presence? Let's create something extraordinary together."
buttons={[
{ text: "Start a Project", href: "#contact" },
{ text: "Start a Project", href: "/contact" },
{ text: "Schedule a Call", href: "#call" },
]}
background={{ variant: "canvas-reveal" }}
useInvertedBackground={false}
/>
<FooterCard
logoText="Studio"
copyrightText="© 2025 Studio. All rights reserved."
logoText="Web Design Tech360"
copyrightText="© 2025 Web Design Tech360. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Follow us on Twitter" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Follow us on Instagram" },
@@ -275,4 +202,4 @@ export default function WebAgencyThemePage() {
</ReactLenis>
</ThemeProvider>
);
}
}

83
src/app/services/page.tsx Normal file
View File

@@ -0,0 +1,83 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FeatureCardEight from "@/components/sections/feature/FeatureCardEight";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Twitter, Instagram, Linkedin } from "lucide-react";
import { Layers, Palette, Code, TrendingUp, ShoppingCart, ShieldCheck, HardDrive } from "lucide-react";
export default function ServicesPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Work", id: "/work" },
{ name: "Contact", id: "/contact" }
];
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="aurora"
cardStyle="layered-gradient"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="Studio"
button={{ text: "Get in Touch", href: "/contact" }}
/>
<div id="services" data-section="services">
<FeatureCardEight
title="Our Web Design & Development Services"
description="Web Design Tech360 offers a comprehensive suite of services to build and maintain your online presence, ensuring digital success."
tag="What We Offer"
tagIcon={Layers}
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Website Design", description: "Crafting visually stunning and user-friendly website designs that captivate your audience and reflect your brand identity.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process3.webp", imageAlt: "Website Design"
},
{
title: "Website Development", description: "Bringing designs to life with robust and scalable website development, ensuring seamless functionality and performance.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process1.webp", imageAlt: "Website Development"
},
{
title: "WordPress Development", description: "Specializing in custom WordPress solutions, from bespoke themes and plugins to comprehensive platform management.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process4.webp", imageAlt: "WordPress Development"
},
{
title: "Ecommerce Websites", description: "Building powerful online stores that drive sales and provide an intuitive shopping experience for your customers.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how3.webp", imageAlt: "Ecommerce Websites"
},
{
title: "SEO Optimization", description: "Boosting your visibility on search engines, driving organic traffic and increasing your online reach with expert SEO strategies.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/process/process2.webp", imageAlt: "SEO Optimization"
},
{
title: "Website Maintenance", description: "Ensuring your website remains secure, updated, and performing optimally with our ongoing maintenance services.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how1.webp", imageAlt: "Website Maintenance"
},
{
title: "Web Hosting", description: "Reliable and secure web hosting solutions tailored to your needs, ensuring fast loading times and maximum uptime.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how2.webp", imageAlt: "Web Hosting"
}
]}
/>
</div>
<FooterCard
logoText="Studio"
copyrightText="© 2025 Studio. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Follow us on Twitter" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Follow us on Instagram" },
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "Connect on LinkedIn" }
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

88
src/app/work/page.tsx Normal file
View File

@@ -0,0 +1,88 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Twitter, Instagram, Linkedin, Briefcase } from "lucide-react";
export default function WorkPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Work", id: "/work" },
{ name: "Contact", id: "/contact" }
];
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="aurora"
cardStyle="layered-gradient"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="Studio"
button={{ text: "Get in Touch", href: "/contact" }}
/>
<div id="work" data-section="work">
<ProductCardTwo
title="Our Web Design & Development Portfolio"
description="Explore our recent projects that showcase our expertise in creating impactful digital experiences across various industries."
tag="Our Work"
tagIcon={Briefcase}
textboxLayout="default"
animationType="slide-up"
gridVariant="uniform-all-items-equal"
uniformGridCustomHeightClasses="min-h-[300px] lg:min-h-[400px]"
useInvertedBackground={false}
products={[
{
id: "1", name: "Innovate Solutions", brand: "Client Project", price: "", rating: 5,
reviewCount: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero1.webp", imageAlt: "Modern Business Website"
},
{
id: "2", name: "ShopSphere", brand: "Client Project", price: "", rating: 5,
reviewCount: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero2.webp?_wi=1", imageAlt: "E-commerce Platform Redesign"
},
{
id: "3", name: "Global Connect", brand: "Client Project", price: "", rating: 5,
reviewCount: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero3.webp?_wi=1", imageAlt: "Corporate WordPress Site"
},
{
id: "4", name: "LaunchPad", brand: "Client Project", price: "", rating: 5,
reviewCount: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero4.webp?_wi=1", imageAlt: "Startup Landing Page"
},
{
id: "5", name: "DataDash App", brand: "Client Project", price: "", rating: 5,
reviewCount: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/hero/hero5.webp", imageAlt: "Custom Web Application"
},
{
id: "6", name: "Creative Canvas", brand: "Client Project", price: "", rating: 5,
reviewCount: "", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency/services/how2.webp", imageAlt: "Portfolio Site for Artist"
}
]}
/>
</div>
<FooterCard
logoText="Studio"
copyrightText="© 2025 Studio. All rights reserved."
socialLinks={[
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Follow us on Twitter" },
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Follow us on Instagram" },
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "Connect on LinkedIn" }
]}
/>
</ReactLenis>
</ThemeProvider>
);
}