Add src/app/work/page.tsx

This commit is contained in:
2026-06-07 21:12:42 +00:00
parent 53e03efbd1
commit 2ec56394a6

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

@@ -0,0 +1,109 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
import BlogCardTwo from "@/components/sections/blog/BlogCardTwo";
import FooterBase from "@/components/sections/footer/FooterBase";
import { ArrowUpRight } from "lucide-react";
export default function PortfolioPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="metallic"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingOverlay
brandName="Webild"
navItems={[
{ name: "Work", href: "/work" },
{ name: "Services", id: "services" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Get Started", href: "#contact" }}
/>
<FeatureCardMedia
title="Our Portfolio"
description="Explore a selection of our recent projects, showcasing our expertise in web design and development."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
features={[
{
id: "umbra-skincare", title: "Umbra Skincare", description: "Luxury fragrance e-commerce platform with custom product configurator.", tag: "E-commerce", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", imageAlt: "Umbra Skincare website design", buttons: [{ text: "View Case Study", href: "#case-studies" }],
},
{
id: "luxuria-travel", title: "Luxuria Travel", description: "Bespoke luxury travel experiences website, focusing on immersive visuals and booking flow.", tag: "Travel & Hospitality", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", imageAlt: "Luxuria Travel website design", buttons: [{ text: "View Case Study", href: "#case-studies" }],
},
{
id: "dental-care", title: "Dental Care", description: "Modern and user-friendly website for a premier dental practice, improving patient engagement.", tag: "Healthcare", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp", imageAlt: "Luxury Dental Care website design", buttons: [{ text: "View Case Study", href: "#case-studies" }],
},
{
id: "summit-roofing", title: "Summit Roofing", description: "Responsive website for professional roofing services, generating high-quality leads.", tag: "Construction", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp", imageAlt: "Summit Roofing website design", buttons: [{ text: "View Case Study", href: "#case-studies" }],
},
{
id: "dubai-real-estate", title: "Dubai Real Estate", description: "Luxury property listings portal with advanced search and interactive map features.", tag: "Real Estate", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp", imageAlt: "Dubai Real Estate website design", buttons: [{ text: "View Case Study", href: "#case-studies" }],
}
]}
/>
<BlogCardTwo
id="case-studies"
title="Case Studies & Insights"
description="Dive deeper into our process and the measurable results we deliver for our clients."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
blogs={[
{
id: "case-study-1", category: "E-commerce", title: "Boosting Conversions for Umbra Skincare", excerpt: "Learn how our strategic design and development process helped Umbra Skincare achieve a 40% increase in online sales.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp", imageAlt: "Umbra Skincare case study thumbnail", authorName: "Webild Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp", date: "March 15, 2024"},
{
id: "case-study-2", category: "Travel", title: "Crafting a Digital Journey for Luxuria Travel", excerpt: "Discover the bespoke solutions we implemented to enhance Luxuria Travel's online presence and customer engagement.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp", imageAlt: "Luxuria Travel case study thumbnail", authorName: "Webild Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp", date: "February 28, 2024"},
{
id: "case-study-3", category: "Healthcare", title: "Modernizing Digital Patient Experience for Dental Care", excerpt: "See how a refreshed website design and improved user experience led to higher appointment bookings for Dental Care.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-3.webp", imageAlt: "Dental Care case study thumbnail", authorName: "Webild Team", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp", date: "January 10, 2024"}
]}
/>
<FooterBase
logoText="Webild"
copyrightText="© 2026 | Webild"
columns={[
{
title: "Company", items: [
{ label: "About", id: "about" },
{ label: "Services", id: "services" },
{ label: "Work", href: "/work" },
{ label: "Contact", id: "contact" }
]
},
{
title: "Services", items: [
{ label: "Web Development", href: "#" },
{ label: "SEO", href: "#" },
{ label: "Branding", href: "#" },
{ label: "UI/UX Design", href: "#" }
]
},
{
title: "Connect", items: [
{ label: "Twitter", href: "#" },
{ label: "LinkedIn", href: "#" },
{ label: "Instagram", href: "#" },
{ label: "Dribbble", href: "#" }
]
}
]}
/>
</ReactLenis>
</ThemeProvider>
);
}