Update src/app/work/page.tsx

This commit is contained in:
2026-06-03 21:07:20 +00:00
parent f3c2b7b4a9
commit b2b0b32b7b

View File

@@ -3,11 +3,11 @@
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroSplit from "@/components/sections/hero/HeroSplit";
import HeroSplit from "@/components/sections/hero/HeroSplitDoubleCarousel";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterBase from "@/components/sections/footer/FooterBase";
import { ArrowUpRight } from "lucide-react";
import ContactText from "@/components/sections/contact/ContactText";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import { Sparkles } from "lucide-react";
export default function WorkPage() {
return (
@@ -27,80 +27,70 @@ export default function WorkPage() {
<NavbarLayoutFloatingOverlay
brandName="Webild"
navItems={[
{ name: "Work", href: "/work" },
{ name: "Services", href: "/services" },
{ name: "About", href: "/#about" },
{ name: "Contact", href: "/#contact" }
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Get Started", href: "/#contact" }}
button={{ text: "Get Started", href: "/contact" }}
/>
<HeroSplit
title="Our Portfolio & Case Studies"
description="Explore a selection of our award-winning projects that demonstrate our commitment to design excellence and measurable results."
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp"
imageAlt="Portfolio showcase image"
title="Our Latest Work"
description="Explore our diverse portfolio of projects, showcasing innovative design and powerful development solutions."
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/work-hero-1.webp"
imageAlt="Digital portfolio showcasing various web design projects"
background={{ variant: "plain" }}
buttons={[
{ text: "Our Services", href: "/services" },
{ text: "Contact Us", href: "#contact-form" },
{ text: "Get a Quote", href: "/contact" },
{ text: "Learn More", href: "/about" },
]}
buttonAnimation="slide-up"
mediaAnimation="slide-up"
/>
<ProductCardFour
title="Featured Projects"
description="A selection of our most impactful and visually striking projects."
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
useInvertedBackground={false}
textboxLayout="default"
products={[
{
id: "1", name: "Umbra Skincare", price: "Luxury E-commerce", variant: "Web Design, Development", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", imageAlt: "Umbra Skincare website design"},
{
id: "2", name: "Luxuria Travel", price: "Bespoke Travel Platform", variant: "UI/UX, Branding", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", imageAlt: "Luxuria Travel website design"},
{
id: "3", name: "Dental Care", price: "Premier Clinic Website", variant: "Web Design, SEO", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp", imageAlt: "Dental Care website design"},
{
id: "4", name: "Summit Roofing", price: "Contractor Digital Presence", variant: "Web Development, Marketing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp", imageAlt: "Summit Roofing website design"},
{
id: "5", name: "Dubai Real Estate", price: "Luxury Property Listings", variant: "UI/UX, Backend", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp", imageAlt: "Dubai Real Estate website design"},
{
id: "6", name: "AgentFlow AI", price: "AI Platform Dashboard", variant: "UI/UX, SaaS Design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-6.webp", imageAlt: "AgentFlow AI platform design"},
]}
/>
<ContactText
text="Ready to Transform Your Digital Presence?"
buttons={[
{ text: "Start Your Project", href: "/contact" },
{ text: "View Our Services", href: "/services" },
]}
background={{ variant: "rotated-rays-animated" }}
useInvertedBackground={false}
/>
<div id="featured-projects" data-section="featured-projects">
<ProductCardFour
title="Featured Projects"
description="Dive into our recent work and see how we've helped businesses like yours succeed online."
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
useInvertedBackground={false}
products={[
{
id: "umbra-skincare", name: "Umbra Skincare", price: "E-commerce", variant: "Web Design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", imageAlt: "Umbra Skincare website"},
{
id: "luxuria-travel", name: "Luxuria Travel", price: "Luxury Booking", variant: "UI/UX Design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", imageAlt: "Luxuria Travel website"},
{
id: "dental-care", name: "Dental Care", price: "Health Portal", variant: "Web Development", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp", imageAlt: "Luxury Dental Care website"},
{
id: "summit-roofing", name: "Summit Roofing", price: "Local Business", variant: "Web Design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp", imageAlt: "Summit Roofing website"},
{
id: "dubai-real-estate", name: "Dubai Real Estate", price: "Property Listing", variant: "UI/UX & Branding", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp", imageAlt: "Dubai Real Estate website"},
{
id: "agentflow-ai", name: "AgentFlow AI", price: "SaaS Platform", variant: "Full-Stack Dev", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp", imageAlt: "AgentFlow AI platform screenshot"},
{
id: "architecture-studio", name: "Architecture Studio", price: "Digital Presence", variant: "Custom Website", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-1.webp", imageAlt: "Architecture studio website"},
{
id: "lumine-skincare", name: "Luminé Skincare", price: "Beauty Brand", variant: "E-commerce Design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-6.webp", imageAlt: "Luminé skincare website"}
]}
/>
</div>
<div id="contact-form" data-section="contact-form">
<ContactSplitForm
title="Have a Project in Mind?"
description="We're excited to hear about your ideas. Let's create something remarkable together and bring your vision to life."
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp"
imageAlt="Team member working on a project"
useInvertedBackground={false}
inputs={[
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email", required: true },
]}
textarea={{ name: "projectDetails", placeholder: "Tell us about your project and goals", rows: 5, required: true }}
buttonText="Get in Touch"
mediaAnimation="slide-up"
/>
</div>
<FooterBase
<FooterBaseCard
logoText="Webild"
copyrightText="© 2026 | Webild"
columns={[
{
title: "Company", items: [
{ label: "About", href: "/#about" },
{ label: "About", href: "/about" },
{ label: "Services", href: "/services" },
{ label: "Work", href: "/work" },
{ label: "Contact", href: "/#contact" },
{ label: "Contact", href: "/contact" }
],
},
{