bender/5db78d4c-cf5f-452c-9878-979802d3702f
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: bender:version_1
Branches Tags
bender:main bender:version_2 bender:version_1
...
pull from: bender:main
Branches Tags
bender:main bender:version_2 bender:version_1

8 Commits
version_1 ... main

Author SHA1 Message Date
bender
9d5f0e6ea9 Merge version_2 into main 
Merge version_2 into main
 2026-04-06 19:07:00 +00:00
bender
70001bb4c1 Update src/app/products/page.tsx 2026-04-06 19:06:54 +00:00
bender
ba164d3bed Merge version_2 into main 
Merge version_2 into main
 2026-04-06 19:06:28 +00:00
bender
9381f51c25 Add src/app/products/page.tsx 2026-04-06 19:06:25 +00:00
bender
eeb4cc4185 Update src/app/page.tsx 2026-04-06 19:06:25 +00:00
bender
2a990ca74b Merge version_1 into main 
Merge version_1 into main
 2026-04-06 19:03:52 +00:00
bender
2586a80034 Merge version_1 into main 
Merge version_1 into main
 2026-04-06 19:03:25 +00:00
bender
415154dc82 Merge version_1 into main 
Merge version_1 into main
 2026-04-06 19:02:54 +00:00
2 changed files with 102 additions and 7 deletions
Expand all files Collapse all files

14
src/app/page.tsx
View File

@@ -29,10 +29,10 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: "Men", id: "#men" },
{ name: "Women", id: "#women" },
{ name: "New Arrivals", id: "#new-arrivals" },
{ name: "Trending", id: "#trending" },
{ name: "Men", id: "/products" },
{ name: "Women", id: "/products" },
{ name: "New Arrivals", id: "/products" },
{ name: "Trending", id: "/products" },
]}
brandName="VOXE"
/>
@@ -59,7 +59,7 @@ export default function LandingPage() {
{ imageSrc: "http://img.b2bpic.net/free-photo/view-young-man-smiling-camera_197531-33438.jpg?_wi=11", imageAlt: "Model in inclusive fashion 5" },
{ imageSrc: "http://img.b2bpic.net/free-photo/view-young-man-smiling-camera_197531-33438.jpg?_wi=12", imageAlt: "Model in inclusive fashion 6" },
]}
buttons={[{ text: "Shop Men", href: "#men" }, { text: "Shop Women", href: "#women" }]}
buttons={[{ text: "Shop Men", href: "/products" }, { text: "Shop Women", href: "/products" }]}
avatars={[
{ src: "http://img.b2bpic.net/free-photo/young-woman-blue-suit-posing-with-mirror-outdoors_23-2149445026.jpg", alt: "User 1" },
{ src: "http://img.b2bpic.net/free-photo/elegant-female-model-posing-window-elegant-waistcoat-new-feminity-concept_23-2148951061.jpg", alt: "User 2" },
@@ -158,8 +158,8 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Men", href: "#men" }, { label: "Women", href: "#women" }] },
{ items: [{ label: "Contact Us", href: "#contact" }, { label: "Privacy Policy", href: "#" }] },
{ items: [{ label: "Men", href: "/products" }, { label: "Women", href: "/products" }] },
{ items: [{ label: "Contact Us", href: "/products" }, { label: "Privacy Policy", href: "#" }] },
{ items: [{ label: "Instagram", href: "#" }, { label: "Twitter", href: "#" }] },
]}
logoText="VOXE"

95
src/app/products/page.tsx Normal file
View File

@@ -0,0 +1,95 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ChevronRight, Filter, SlidersHorizontal } from "lucide-react";
export default function ProductListingPage() {
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
defaultTextAnimation="reveal-blur"
borderRadius="pill"
contentWidth="medium"
sizing="mediumSizeLargeTitles"
background="noiseDiagonalGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: "Men", id: "/products" },
{ name: "Women", id: "/products" },
{ name: "Shop All", id: "/products" },
]}
brandName="VOXE"
/>
</div>
<main className="pt-24 pb-16 px-4 md:px-8 max-w-7xl mx-auto flex gap-8">
<aside className="hidden md:block w-64 space-y-8">
<div className="flex items-center gap-2 font-semibold text-lg border-b pb-4 mb-4">
<SlidersHorizontal className="w-5 h-5" />
Filters
</div>
{['Category', 'Type', 'Size', 'Color', 'Price Range'].map((filter) => (
<div key={filter} className="space-y-3">
<h4 className="font-medium">{filter}</h4>
<div className="space-y-1.5">
{['Option 1', 'Option 2', 'Option 3'].map(opt => (
<label key={opt} className="flex items-center gap-2 text-sm cursor-pointer hover:text-amber-600">
<input type="checkbox" className="accent-amber-500" /> {opt}
</label>
))}
</div>
</div>
))}
</aside>
<div className="flex-1">
<div className="flex justify-between items-center mb-6 text-sm text-gray-500">
<div className="flex items-center gap-2">
<span>Home</span> <ChevronRight className="w-4 h-4" /> <span>Shop All</span>
</div>
<span>Showing 124 products</span>
</div>
<div id="products" data-section="products">
<ProductCardTwo
animationType="slide-up"
gridVariant="four-items-2x2-equal-grid"
textboxLayout="default"
title=""
description=""
useInvertedBackground={false}
products={[
{ id: "p1", brand: "VOXE", name: "Signature Blazer", price: "$185", rating: 5, reviewCount: "24", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-blue-suit-posing-with-mirror-outdoors_23-2149445026.jpg" },
{ id: "p2", brand: "VOXE", name: "Essential Loafer", price: "$140", rating: 4, reviewCount: "42", imageSrc: "http://img.b2bpic.net/free-photo/elegant-female-model-posing-window-elegant-waistcoat-new-feminity-concept_23-2148951061.jpg" },
{ id: "p3", brand: "VOXE", name: "Urban Tee", price: "$55", rating: 5, reviewCount: "89", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2718.jpg" },
{ id: "p4", brand: "VOXE", name: "Classic Trouser", price: "$125", rating: 4, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-linens_23-2148817547.jpg" }
]}
/>
</div>
</div>
</main>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Shop All", href: "/products" }, { label: "Help", href: "#" }] },
{ items: [{ label: "Contact Us", href: "#" }, { label: "Terms", href: "#" }] },
]}
logoText="VOXE"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}