Merge version_2 into main

Merge version_2 into main
This commit was merged in pull request #3.
This commit is contained in:
2026-02-13 16:32:08 +00:00
2 changed files with 200 additions and 200 deletions

View File

@@ -82,45 +82,45 @@ export default function ProductPage({ params }: ProductPageProps) {
>
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
{ name: "Home", id: "/" },
{ name: "What We Do", id: "about" },
{ name: "Work", id: "case-studies" },
{ name: "Contact", id: "contact" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
{ name: "Home", id: "/" },
{ name: "What We Do", id: "about" },
{ name: "Work", id: "case-studies" },
{ name: "Contact", id: "contact" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
</div>
<main className="min-h-screen flex items-center justify-center pt-20">
<p className="text-foreground">Loading product...</p>
</main>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
{
items: [
{ label: "Home", href: "hero" },
{ label: "Our Approach", href: "about" }
]
},
{
items: [
{ label: "Case Studies", href: "case-studies" },
{ label: "Contact", href: "contact" }
]
},
{
items: [
{ label: "Privacy", href: "https://example.com/privacy" },
{ label: "Terms", href: "https://example.com/terms" }
]
}
]}
/>
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
{
items: [
{ label: "Home", href: "hero" },
{ label: "Our Approach", href: "about" }
]
},
{
items: [
{ label: "Case Studies", href: "case-studies" },
{ label: "Contact", href: "contact" }
]
},
{
items: [
{ label: "Privacy", href: "https://example.com/privacy" },
{ label: "Terms", href: "https://example.com/terms" }
]
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
@@ -167,6 +167,99 @@ export default function ProductPage({ params }: ProductPageProps) {
</div>
</main>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
{
items: [
{ label: "Home", href: "hero" },
{ label: "Our Approach", href: "about" }
]
},
{
items: [
{ label: "Case Studies", href: "case-studies" },
{ label: "Contact", href: "contact" }
]
},
{
items: [
{ label: "Privacy", href: "https://example.com/privacy" },
{ label: "Terms", href: "https://example.com/terms" }
]
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
return (
<ThemeProvider
defaultButtonVariant="slide-background"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="mediumLargeSizeMediumTitles"
background="floatingGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="inset-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
{ name: "Home", id: "/" },
{ name: "What We Do", id: "about" },
{ name: "Work", id: "case-studies" },
{ name: "Contact", id: "contact" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
</div>
<div id="productDetailCard" data-section="productDetailCard">
<ProductDetailCard
layout="page"
name={product.name}
price={product.price}
salePrice={meta.salePrice}
rating={product.rating || 0}
description={product.description}
images={images}
variants={variants.length > 0 ? variants : undefined}
quantity={quantityVariant}
ribbon={meta.ribbon}
inventoryStatus={meta.inventoryStatus}
inventoryQuantity={meta.inventoryQuantity}
sku={meta.sku}
buttons={[
{ text: "Add To Cart", onClick: handleAddToCart },
{ text: "Buy Now", onClick: handleBuyNow },
]}
/>
</div>
<div id="productCart" data-section="productCart">
<ProductCart
isOpen={cartOpen}
onClose={() => setCartOpen(false)}
items={cartItems}
onQuantityChange={updateQuantity}
onRemove={removeItem}
total={`$${cartTotal}`}
buttons={[
{
text: isCheckoutLoading ? "Processing..." : "Check Out", onClick: handleCheckout,
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
@@ -190,99 +283,6 @@ export default function ProductPage({ params }: ProductPageProps) {
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
return (
<ThemeProvider
defaultButtonVariant="slide-background"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="mediumLargeSizeMediumTitles"
background="floatingGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="inset-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
{ name: "Home", id: "/" },
{ name: "What We Do", id: "about" },
{ name: "Work", id: "case-studies" },
{ name: "Contact", id: "contact" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
</div>
<div id="productDetailCard" data-section="productDetailCard">
<ProductDetailCard
layout="page"
name={product.name}
price={product.price}
salePrice={meta.salePrice}
rating={product.rating || 0}
description={product.description}
images={images}
variants={variants.length > 0 ? variants : undefined}
quantity={quantityVariant}
ribbon={meta.ribbon}
inventoryStatus={meta.inventoryStatus}
inventoryQuantity={meta.inventoryQuantity}
sku={meta.sku}
buttons={[
{ text: "Add To Cart", onClick: handleAddToCart },
{ text: "Buy Now", onClick: handleBuyNow },
]}
/>
</div>
<div id="productCart" data-section="productCart">
<ProductCart
isOpen={cartOpen}
onClose={() => setCartOpen(false)}
items={cartItems}
onQuantityChange={updateQuantity}
onRemove={removeItem}
total={`$${cartTotal}`}
buttons={[
{
text: isCheckoutLoading ? "Processing..." : "Check Out", onClick: handleCheckout,
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
{
items: [
{ label: "Home", href: "hero" },
{ label: "Our Approach", href: "about" }
]
},
{
items: [
{ label: "Case Studies", href: "case-studies" },
{ label: "Contact", href: "contact" }
]
},
{
items: [
{ label: "Privacy", href: "https://example.com/privacy" },
{ label: "Terms", href: "https://example.com/terms" }
}
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>

View File

@@ -35,6 +35,66 @@ export default function ShopPage() {
>
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
{ name: "Home", id: "/" },
{ name: "What We Do", id: "about" },
{ name: "Work", id: "case-studies" },
{ name: "Contact", id: "contact" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
</div>
<main className="min-h-screen flex items-center justify-center pt-20">
<p className="text-foreground">Loading products...</p>
</main>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
{
items: [
{ label: "Home", href: "hero" },
{ label: "Our Approach", href: "about" }
]
},
{
items: [
{ label: "Case Studies", href: "case-studies" },
{ label: "Contact", href: "contact" }
]
},
{
items: [
{ label: "Privacy", href: "https://example.com/privacy" },
{ label: "Terms", href: "https://example.com/terms" }
]
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
return (
<ThemeProvider
defaultButtonVariant="slide-background"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="mediumLargeSizeMediumTitles"
background="floatingGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="inset-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
@@ -46,11 +106,19 @@ export default function ShopPage() {
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
</div>
<main className="min-h-screen flex items-center justify-center pt-20">
<p className="text-foreground">Loading products...</p>
</main>
<div id="footer" data-section="footer">
</div>
<div id="productCatalog" data-section="productCatalog">
<ProductCatalog
layout="page"
products={products}
searchValue={search}
onSearchChange={setSearch}
searchPlaceholder="Search products..."
filters={filters}
emptyMessage="No products found"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
@@ -74,74 +142,6 @@ export default function ShopPage() {
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
return (
<ThemeProvider
defaultButtonVariant="slide-background"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="mediumLargeSizeMediumTitles"
background="floatingGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="inset-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
brandName="McLaren Labs"
navItems={[
{ name: "Home", id: "/" },
{ name: "What We Do", id: "about" },
{ name: "Work", id: "case-studies" },
{ name: "Contact", id: "contact" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
/>
</div>
<div id="productCatalog" data-section="productCatalog">
<ProductCatalog
layout="page"
products={products}
searchValue={search}
onSearchChange={setSearch}
searchPlaceholder="Search products..."
filters={filters}
emptyMessage="No products found"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="McLaren Labs"
columns={[
{
items: [
{ label: "Home", href: "hero" },
{ label: "Our Approach", href: "about" }
]
},
{
items: [
{ label: "Case Studies", href: "case-studies" },
{ label: "Contact", href: "contact" }
}
},
{
items: [
{ label: "Privacy", href: "https://example.com/privacy" },
{ label: "Terms", href: "https://example.com/terms" }
}
}
]}
/>
</div>
</ReactLenis>
</ThemeProvider>