Update src/app/products/page.tsx

This commit is contained in:
2026-01-22 21:00:38 +00:00
parent 6fa24e0e43
commit b17f7b06e3

View File

@@ -2,9 +2,9 @@
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Sparkles, Zap, Star, Heart, Crown } from "lucide-react";
@@ -71,29 +71,33 @@ export default function ProductsPage() {
</div>
<div id="features" data-section="features">
<FeatureCardEight
<FeatureHoverPattern
title="The Science Behind Our Formulations"
description="Each product is engineered to deliver powerful results while maintaining the gentleness your skin deserves"
tag="How It Works"
tagIcon={Zap}
textboxLayout="default"
useInvertedBackground="invertDefault"
animationType="slide-up"
features={[
{
id: "1", title: "Deep Hydration", description: "Our proprietary blend of hyaluronic acid and botanical extracts penetrates multiple skin layers to deliver intense, long-lasting moisture", imageSrc: "https://images.unsplash.com/photo-1556228578-8c89e6adf883?w=400&h=400&fit=crop", imageAlt: "Hydration benefits visualization"
icon: Sparkles,
title: "Deep Hydration", description: "Our proprietary blend of hyaluronic acid and botanical extracts penetrates multiple skin layers to deliver intense, long-lasting moisture"
},
{
id: "2", title: "Protective Shield", description: "Advanced antioxidant complex protects against environmental stressors while strengthening your skin barrier", imageSrc: "https://images.unsplash.com/photo-1596755094514-f87e34085b2c?w=400&h=400&fit=crop", imageAlt: "Skin protection technology demonstration"
icon: Zap,
title: "Protective Shield", description: "Advanced antioxidant complex protects against environmental stressors while strengthening your skin barrier"
},
{
id: "3", title: "Natural Nourishment", description: "Plant-based vitamins and peptides work synergistically to improve texture, elasticity, and radiance", imageSrc: "https://images.unsplash.com/photo-1576426863848-c21cb6cb1e6d?w=400&h=400&fit=crop", imageAlt: "Natural ingredients and their benefits"
icon: Star,
title: "Natural Nourishment", description: "Plant-based vitamins and peptides work synergistically to improve texture, elasticity, and radiance"
}
]}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardOne
<PricingCardTwo
title="Choose Your Skincare Journey"
description="Select the perfect plan to achieve your best skin"
tag="Pricing Plans"
@@ -104,8 +108,7 @@ export default function ProductsPage() {
plans={[
{
id: "1", badge: "Starter", badgeIcon: Star,
price: 49,
subtitle: "Essential skincare basics", buttons: [
price: "$49", subtitle: "Essential skincare basics", buttons: [
{ text: "Get Started", href: "/products" },
{ text: "Learn More", href: "/pricing" }
],
@@ -115,8 +118,7 @@ export default function ProductsPage() {
},
{
id: "2", badge: "Most Popular", badgeIcon: Heart,
price: 129,
subtitle: "Complete daily routine", buttons: [
price: "$129", subtitle: "Complete daily routine", buttons: [
{ text: "Get Started", href: "/products" },
{ text: "Contact Sales", href: "/contact" }
],
@@ -126,8 +128,7 @@ export default function ProductsPage() {
},
{
id: "3", badge: "Luxury", badgeIcon: Crown,
price: 249,
subtitle: "Full professional regimen", buttons: [
price: "$249", subtitle: "Full professional regimen", buttons: [
{ text: "Get Started", href: "/products" },
{ text: "Contact Sales", href: "/contact" }
],
@@ -139,7 +140,34 @@ export default function ProductsPage() {
/>
</div>
<FooterLogoReveal logoText="LuxeGlow" />
<FooterSimple
columns={[
{
title: "Navigate", items: [
{ label: "Home", href: "/" },
{ label: "Products", href: "/products" },
{ label: "Pricing", href: "/pricing" },
{ label: "FAQ", href: "/faq" }
]
},
{
title: "Support", items: [
{ label: "Contact", href: "/contact" },
{ label: "Help Center", href: "/help" },
{ label: "Skincare Guide", href: "/guide" }
]
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "/privacy" },
{ label: "Terms of Service", href: "/terms" },
{ label: "Return Policy", href: "/returns" }
]
}
]}
bottomLeftText="© 2025 LuxeGlow. All rights reserved."
bottomRightText="Made with Webild"
/>
</ThemeProvider>
);
}