Add src/app/portfolio/page.tsx

This commit is contained in:
2026-03-07 10:56:39 +00:00
parent 94c3a54863
commit d97a85db89

128
src/app/portfolio/page.tsx Normal file
View File

@@ -0,0 +1,128 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
import FooterSimple from "@/components/sections/footer/FooterSimple";
export default function PortfolioPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="largeSmallSizeMediumTitles"
background="fluid"
cardStyle="glass-depth"
primaryButtonStyle="shadow"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Collections", id: "/" },
{ name: "About", id: "/" },
{ name: "Craftsmanship", id: "/" },
{ name: "Reviews", id: "/" },
{ name: "Portfolio", id: "/portfolio" },
{ name: "Contact", id: "/" },
]}
button={{ text: "Shop Now", href: "/" }}
brandName="TimeLux"
/>
</div>
<div id="portfolio-hero" data-section="portfolio-hero">
<HeroLogoBillboardSplit
logoText="Portfolio"
description="Explore our curated collection of exceptional timepieces and the stories behind each design. From exclusive limited editions to heritage classics, discover the TimeLux portfolio of precision engineering and artistic excellence."
buttons={[
{ text: "Explore Gallery", href: "#portfolio-examples" },
{ text: "Back to Home", href: "/" },
]}
buttonAnimation="slide-up"
layoutOrder="default"
imageSrc="http://img.b2bpic.net/free-photo/cupcake-still-life_23-2148097701.jpg"
imageAlt="TimeLux Portfolio Showcase"
mediaAnimation="slide-up"
frameStyle="card"
background={{ variant: "plain" }}
ariaLabel="Portfolio hero section"
/>
</div>
<div id="portfolio-examples" data-section="portfolio-examples">
<ProductCardOne
title="Featured Portfolio Pieces"
description="A selection of our most acclaimed designs, each representing the pinnacle of watchmaking craftsmanship and innovation"
tag="Showcase"
products={[
{
id: "1", name: "Heritage Chronograph Series", price: "$4,500", imageSrc: "http://img.b2bpic.net/free-photo/closeup-mockup-smartwatch-isolated-whtie-background_53876-42330.jpg?_wi=1", imageAlt: "Heritage Chronograph Series limited edition"},
{
id: "2", name: "Celestial Night Edition", price: "$3,950", imageSrc: "http://img.b2bpic.net/free-photo/senior-man-posing-white-shirt-hat_23-2149487992.jpg?_wi=1", imageAlt: "Celestial Night Edition exclusive watch"},
{
id: "3", name: "Ocean Depths Collection", price: "$4,200", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-checking-clock_23-2148662074.jpg?_wi=1", imageAlt: "Ocean Depths Collection professional timepiece"},
{
id: "4", name: "Vintage Elegance Reissue", price: "$3,500", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-bearded-man_171337-4226.jpg", imageAlt: "Vintage Elegance Reissue classic design"},
{
id: "5", name: "Urban Motion Pro", price: "$2,800", imageSrc: "http://img.b2bpic.net/free-photo/elderly-businesswoman-sitting-outside-cafe_1303-19450.jpg", imageAlt: "Urban Motion Pro contemporary sports watch"},
{
id: "6", name: "Golden Heritage Limited", price: "$5,200", imageSrc: "http://img.b2bpic.net/free-photo/young-stylish-macho-boy-black-jacket-posed-outdoor-street-amazing-model-man_627829-6126.jpg", imageAlt: "Golden Heritage Limited luxury timepiece"},
]}
gridVariant="bento-grid"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="portfolio-about" data-section="portfolio-about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "Every piece" },
{ type: "image", src: "http://img.b2bpic.net/free-photo/medium-shot-jeweler-making-jewellery_23-2150931439.jpg", alt: "Portfolio craftsmanship" },
{ type: "text", content: "tells a story" },
]}
buttons={[{ text: "View Collections", href: "/" }]}
buttonAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Shop", items: [
{ label: "Collections", href: "/" },
{ label: "Portfolio", href: "/portfolio" },
{ label: "Limited Editions", href: "/" },
],
},
{
title: "Support", items: [
{ label: "About Us", href: "/" },
{ label: "Contact", href: "/" },
{ label: "Warranty", href: "/" },
],
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "/" },
{ label: "Terms of Service", href: "/" },
{ label: "Shipping Info", href: "/" },
],
},
]}
bottomLeftText="© 2025 TimeLux Watches. All rights reserved."
bottomRightText="Crafted with precision and passion"
/>
</div>
</ThemeProvider>
);
}