Update src/app/products/page.tsx

This commit is contained in:
2026-03-06 17:34:39 +00:00
parent 7761bb5d64
commit 0b00e0158b

View File

@@ -17,7 +17,7 @@ export default function ProductsPage() {
borderRadius="pill"
contentWidth="smallMedium"
sizing="largeSmallSizeMediumTitles"
background="grid"
background="circleGradient"
cardStyle="gradient-bordered"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
@@ -51,95 +51,32 @@ export default function ProductsPage() {
gridVariant="three-columns-all-equal-width"
products={[
{
id: "prod-1",
brand: "Digital Store",
name: "Complete Python Programming Guide",
price: "$29.99",
rating: 5,
reviewCount: "2.3k",
imageSrc: "http://img.b2bpic.net/free-photo/funny-little-girl-headphones-with-laptop-plays-games-game-addiction-concept_169016-53925.jpg?_wi=4",
imageAlt: "Python Programming Course",
},
id: "prod-1", brand: "Digital Store", name: "Complete Python Programming Guide", price: "$29.99", rating: 5,
reviewCount: "2.3k", imageSrc: "http://img.b2bpic.net/free-photo/funny-little-girl-headphones-with-laptop-plays-games-game-addiction-concept_169016-53925.jpg", imageAlt: "Python Programming Course"},
{
id: "prod-2",
brand: "Digital Store",
name: "Web Design Templates Bundle",
price: "$49.99",
rating: 5,
reviewCount: "1.8k",
imageSrc: "http://img.b2bpic.net/free-photo/happy-female-working-art-studio_23-2148372142.jpg?_wi=4",
imageAlt: "Web Design Templates",
},
id: "prod-2", brand: "Digital Store", name: "Web Design Templates Bundle", price: "$49.99", rating: 5,
reviewCount: "1.8k", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-working-art-studio_23-2148372142.jpg", imageAlt: "Web Design Templates"},
{
id: "prod-3",
brand: "Digital Store",
name: "Digital Marketing Masterclass",
price: "$39.99",
rating: 5,
reviewCount: "3.1k",
imageSrc: "http://img.b2bpic.net/free-photo/funny-little-girl-headphones-with-laptop-plays-games-game-addiction-concept_169016-53925.jpg?_wi=5",
imageAlt: "Marketing Course",
},
id: "prod-3", brand: "Digital Store", name: "Digital Marketing Masterclass", price: "$39.99", rating: 5,
reviewCount: "3.1k", imageSrc: "http://img.b2bpic.net/free-photo/funny-little-girl-headphones-with-laptop-plays-games-game-addiction-concept_169016-53925.jpg", imageAlt: "Marketing Course"},
{
id: "prod-4",
brand: "Digital Store",
name: "Advanced JavaScript eBook",
price: "$24.99",
rating: 5,
reviewCount: "1.5k",
imageSrc: "http://img.b2bpic.net/free-vector/online-learning-landing-page-design_23-2149058254.jpg?_wi=5",
imageAlt: "JavaScript eBook",
},
id: "prod-4", brand: "Digital Store", name: "Advanced JavaScript eBook", price: "$24.99", rating: 5,
reviewCount: "1.5k", imageSrc: "http://img.b2bpic.net/free-vector/online-learning-landing-page-design_23-2149058254.jpg", imageAlt: "JavaScript eBook"},
{
id: "prod-5",
brand: "Digital Store",
name: "UI/UX Design System Kit",
price: "$59.99",
rating: 5,
reviewCount: "2.7k",
imageSrc: "http://img.b2bpic.net/free-photo/happy-female-working-art-studio_23-2148372142.jpg?_wi=5",
imageAlt: "Design System Kit",
},
id: "prod-5", brand: "Digital Store", name: "UI/UX Design System Kit", price: "$59.99", rating: 5,
reviewCount: "2.7k", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-working-art-studio_23-2148372142.jpg", imageAlt: "Design System Kit"},
{
id: "prod-6",
brand: "Digital Store",
name: "SEO Optimization Blueprint",
price: "$34.99",
rating: 5,
reviewCount: "2.1k",
imageSrc: "http://img.b2bpic.net/free-vector/online-learning-landing-page-design_23-2149058254.jpg?_wi=6",
imageAlt: "SEO Guide",
},
id: "prod-6", brand: "Digital Store", name: "SEO Optimization Blueprint", price: "$34.99", rating: 5,
reviewCount: "2.1k", imageSrc: "http://img.b2bpic.net/free-vector/online-learning-landing-page-design_23-2149058254.jpg", imageAlt: "SEO Guide"},
{
id: "prod-7",
brand: "Digital Store",
name: "Mobile App Development Bootcamp",
price: "$44.99",
rating: 5,
reviewCount: "2.9k",
imageSrc: "http://img.b2bpic.net/free-photo/funny-little-girl-headphones-with-laptop-plays-games-game-addiction-concept_169016-53925.jpg?_wi=6",
imageAlt: "Mobile Development Course",
},
id: "prod-7", brand: "Digital Store", name: "Mobile App Development Bootcamp", price: "$44.99", rating: 5,
reviewCount: "2.9k", imageSrc: "http://img.b2bpic.net/free-photo/funny-little-girl-headphones-with-laptop-plays-games-game-addiction-concept_169016-53925.jpg", imageAlt: "Mobile Development Course"},
{
id: "prod-8",
brand: "Digital Store",
name: "Content Strategy Playbook",
price: "$19.99",
rating: 5,
reviewCount: "1.2k",
imageSrc: "http://img.b2bpic.net/free-vector/online-learning-landing-page-design_23-2149058254.jpg?_wi=7",
imageAlt: "Content Strategy Guide",
},
id: "prod-8", brand: "Digital Store", name: "Content Strategy Playbook", price: "$19.99", rating: 5,
reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-vector/online-learning-landing-page-design_23-2149058254.jpg", imageAlt: "Content Strategy Guide"},
{
id: "prod-9",
brand: "Digital Store",
name: "Data Science Fundamentals",
price: "$54.99",
rating: 5,
reviewCount: "3.4k",
imageSrc: "http://img.b2bpic.net/free-photo/happy-female-working-art-studio_23-2148372142.jpg?_wi=6",
imageAlt: "Data Science Course",
},
id: "prod-9", brand: "Digital Store", name: "Data Science Fundamentals", price: "$54.99", rating: 5,
reviewCount: "3.4k", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-working-art-studio_23-2148372142.jpg", imageAlt: "Data Science Course"},
]}
/>
</div>
@@ -157,29 +94,13 @@ export default function ProductsPage() {
gridVariant="four-items-2x2-equal-grid"
features={[
{
title: "Expert-Created Content",
description: "All courses and guides are developed by industry experts with years of practical experience and proven track records.",
imageSrc: "http://img.b2bpic.net/free-photo/call-center-senior-agent-providing-guidance-help-customers-using-ai_482257-126049.jpg?_wi=2",
imageAlt: "Expert Content",
},
title: "Expert-Created Content", description: "All courses and guides are developed by industry experts with years of practical experience and proven track records.", imageSrc: "http://img.b2bpic.net/free-photo/call-center-senior-agent-providing-guidance-help-customers-using-ai_482257-126049.jpg", imageAlt: "Expert Content"},
{
title: "Lifetime Access",
description: "Purchase once and access your digital products forever. Enjoy free updates and improvements throughout your ownership.",
imageSrc: "http://img.b2bpic.net/free-vector/digital-cloud-computing-futuristic-background-cyber-service_1017-56275.jpg?_wi=2",
imageAlt: "Lifetime Access",
},
title: "Lifetime Access", description: "Purchase once and access your digital products forever. Enjoy free updates and improvements throughout your ownership.", imageSrc: "http://img.b2bpic.net/free-vector/digital-cloud-computing-futuristic-background-cyber-service_1017-56275.jpg", imageAlt: "Lifetime Access"},
{
title: "Regular Updates",
description: "Industry standards change, and our products change with them. Receive regular updates at no additional cost.",
imageSrc: "http://img.b2bpic.net/free-vector/dashboard-user-panel-template_52683-29382.jpg?_wi=2",
imageAlt: "Regular Updates",
},
title: "Regular Updates", description: "Industry standards change, and our products change with them. Receive regular updates at no additional cost.", imageSrc: "http://img.b2bpic.net/free-vector/dashboard-user-panel-template_52683-29382.jpg", imageAlt: "Regular Updates"},
{
title: "Money-Back Guarantee",
description: "Try any product with confidence. Our 30-day guarantee ensures complete satisfaction or a full refund.",
imageSrc: "http://img.b2bpic.net/free-photo/hand-with-card-laptop_1208-197.jpg?_wi=2",
imageAlt: "Money-Back Guarantee",
},
title: "Money-Back Guarantee", description: "Try any product with confidence. Our 30-day guarantee ensures complete satisfaction or a full refund.", imageSrc: "http://img.b2bpic.net/free-photo/hand-with-card-laptop_1208-197.jpg", imageAlt: "Money-Back Guarantee"},
]}
/>
</div>
@@ -191,7 +112,7 @@ export default function ProductsPage() {
description="Get notified about exclusive product launches, special discounts, and industry insights delivered straight to your inbox."
tagIcon={Mail}
tagAnimation="slide-up"
background={{ variant: "grid" }}
background={{ variant: "animated-grid" }}
useInvertedBackground={true}
inputPlaceholder="your@email.com"
buttonText="Notify Me"
@@ -203,8 +124,7 @@ export default function ProductsPage() {
<FooterBaseReveal
columns={[
{
title: "Product",
items: [
title: "Product", items: [
{ label: "Browse Products", href: "/products" },
{ label: "Categories", href: "/products" },
{ label: "New Releases", href: "/products" },
@@ -212,8 +132,7 @@ export default function ProductsPage() {
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
@@ -221,8 +140,7 @@ export default function ProductsPage() {
],
},
{
title: "Support",
items: [
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Account", href: "#" },
{ label: "Downloads", href: "#" },