diff --git a/src/app/collections/[collectionId]/page.tsx b/src/app/collections/[collectionId]/page.tsx new file mode 100644 index 0000000..8ee2b7c --- /dev/null +++ b/src/app/collections/[collectionId]/page.tsx @@ -0,0 +1,122 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import { useParams } from 'next/navigation'; +import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; +import ProductCardThree from '@/components/sections/product/ProductCardThree'; +import FooterBase from '@/components/sections/footer/FooterBase'; + +// Placeholder product data for collections +const collectionProducts: { [key: string]: any[] } = { + "p-aqua": [ + { id: "p-aqua-1", name: "VitisCell Hydra Fresh Toner", price: "$250.00", imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-moisturizer_23-2147710598.jpg", imageAlt: "VitisCell Hydra Fresh Toner" }, + { id: "p-aqua-2", name: "VitisCell Fresh Cleanser", price: "$180.00", imageSrc: "http://img.b2bpic.net/free-photo/front-view-tube-cream-pink-plastic-tube-with-white-cap_140725-13882.jpg", imageAlt: "VitisCell Fresh Cleanser" }, + { id: "p-aqua-3", name: "Intense Hydration Serum", price: "$350.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg", imageAlt: "Intense Hydration Serum" }, + { id: "p-aqua-4", name: "Dewy Glow Moisturizer", price: "$290.00", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-applying-body-lotion-after-shower_171337-12785.jpg", imageAlt: "Dewy Glow Moisturizer" }, + ], + "p-embercell": [ + { id: "p-embercell-1", name: "EmberCell Resurfacing Mask", price: "$320.00", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-body-butter-pink-cloth_23-2148305543.jpg", imageAlt: "EmberCell Resurfacing Mask" }, + { id: "p-embercell-2", name: "EmberCell Night Cream", price: "$420.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-luxurious-cream-golden-pot_23-2148761498.jpg", imageAlt: "EmberCell Night Cream" }, + { id: "p-embercell-3", name: "Age-Defying Serum", price: "$490.00", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-serum-plant_23-2148899353.jpg", imageAlt: "Age-Defying Serum" }, + { id: "p-embercell-4", name: "Regenerative Eye Cream", price: "$380.00", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-bathrobe-doing-make-up_114579-27518.jpg", imageAlt: "Regenerative Eye Cream" }, + ], + "p-prismastem": [ + { id: "p-prismastem-1", name: "Lumi-Cell Brightening Serum", price: "$450.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg", imageAlt: "Lumi-Cell Brightening Serum" }, + { id: "p-prismastem-2", name: "Radiant Glow Day Cream", price: "$310.00", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-pearls-make-up_23-2148871296.jpg", imageAlt: "Radiant Glow Day Cream" }, + { id: "p-prismastem-3", name: "Even Tone Cleanser", price: "$190.00", imageSrc: "http://img.b2bpic.net/free-photo/front-view-tube-cream-pink-plastic-tube-with-white-cap_140725-13882.jpg", imageAlt: "Even Tone Cleanser" }, + { id: "p-prismastem-4", name: "Spot Correction Treatment", price: "$390.00", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-orange-slices-near-face_171337-1765.jpg", imageAlt: "Spot Correction Treatment" }, + ], +}; + +const collectionTitles: { [key: string]: string } = { + "p-aqua": "Aqua Collection", "p-embercell": "EmberCell Collection", "p-prismastem": "PrismaStem Collection"}; + +export default function CollectionPage() { + const params = useParams(); + const collectionId = params.collectionId as string; + const products = collectionProducts[collectionId] || []; + const collectionTitle = collectionTitles[collectionId] || "Unknown Collection"; + + return ( + + + + +
+ +
+ + +
+
+ ); +} diff --git a/src/app/collections/aqua/page.tsx b/src/app/collections/aqua/page.tsx new file mode 100644 index 0000000..8cd0ce9 --- /dev/null +++ b/src/app/collections/aqua/page.tsx @@ -0,0 +1,83 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; +import FooterBase from '@/components/sections/footer/FooterBase'; + +const consistentNavItems = [ + { name: "Shop", id: "#shop" }, + { name: "Best Sellers", id: "#best-sellers" }, + { name: "Collections", id: "/collections" }, + { name: "Products", id: "#products" }, + { name: "Concerns", id: "#concerns" }, + { name: "About", id: "#about" }, + { name: "Contact", id: "#contact" }, +]; + +export default function AquaCollectionPage() { + return ( + + + + +
+

Aqua Collection

+

Dive into deep hydration with the Aqua Collection, designed to replenish and revitalize your skin.

+ {/* Add specific product details or marketing content for Aqua Collection here */} +
+ + +
+
+ ); +} \ No newline at end of file diff --git a/src/app/collections/embercell/page.tsx b/src/app/collections/embercell/page.tsx new file mode 100644 index 0000000..ee2f61c --- /dev/null +++ b/src/app/collections/embercell/page.tsx @@ -0,0 +1,83 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; +import FooterBase from '@/components/sections/footer/FooterBase'; + +const consistentNavItems = [ + { name: "Shop", id: "#shop" }, + { name: "Best Sellers", id: "#best-sellers" }, + { name: "Collections", id: "/collections" }, + { name: "Products", id: "#products" }, + { name: "Concerns", id: "#concerns" }, + { name: "About", id: "#about" }, + { name: "Contact", id: "#contact" }, +]; + +export default function EmberCellCollectionPage() { + return ( + + + + +
+

EmberCell Collection

+

Experience advanced rejuvenation with the EmberCell Collection, designed to firm and restore your skin's youthful vitality.

+ {/* Add specific product details or marketing content for EmberCell Collection here */} +
+ + +
+
+ ); +} \ No newline at end of file diff --git a/src/app/collections/page.tsx b/src/app/collections/page.tsx new file mode 100644 index 0000000..ff08310 --- /dev/null +++ b/src/app/collections/page.tsx @@ -0,0 +1,98 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; +import FooterBase from '@/components/sections/footer/FooterBase'; + +const consistentNavItems = [ + { name: "Shop", id: "#shop" }, + { name: "Best Sellers", id: "#best-sellers" }, + { name: "Collections", id: "/collections" }, + { name: "Products", id: "#products" }, + { name: "Concerns", id: "#concerns" }, + { name: "About", id: "#about" }, + { name: "Contact", id: "#contact" }, +]; + +export default function CollectionsIndexPage() { + return ( + + + + +
+

Our Collections

+

+ Explore our exquisite range of skincare collections, each crafted with unique formulations to address your specific beauty needs. +

+
+ +

Aqua Collection

+

Deep Hydration

+
+ +

EmberCell Collection

+

Rejuvenating & Anti-Aging

+
+ +

PrismaStem Collection

+

Radiant Brightening

+
+
+
+ + +
+
+ ); +} \ No newline at end of file diff --git a/src/app/collections/prismastem/page.tsx b/src/app/collections/prismastem/page.tsx new file mode 100644 index 0000000..0c352d5 --- /dev/null +++ b/src/app/collections/prismastem/page.tsx @@ -0,0 +1,82 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; +import FooterBase from '@/components/sections/footer/FooterBase'; + +const consistentNavItems = [ + { name: "Shop", id: "#shop" }, + { name: "Best Sellers", id: "#best-sellers" }, { name: "Collections", id: "/collections" }, + { name: "Products", id: "#products" }, + { name: "Concerns", id: "#concerns" }, + { name: "About", id: "#about" }, + { name: "Contact", id: "#contact" }, +]; + +export default function PrismaStemCollectionPage() { + return ( + + + + +
+

PrismaStem Collection

+

Achieve radiant brightness with the PrismaStem Collection, formulated to illuminate and even out your skin tone.

+ {/* Add specific product details or marketing content for PrismaStem Collection here */} +
+ + +
+
+ ); +} \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 9eea20b..f27b072 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -8,7 +8,7 @@ import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwent import FooterBase from '@/components/sections/footer/FooterBase'; import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo'; import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; -import PricingCardEight from '@/components/sections/pricing/PricingCardEight'; + import ProductCardThree from '@/components/sections/product/ProductCardThree'; import SocialProofOne from '@/components/sections/socialProof/SocialProofOne'; import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard'; @@ -33,20 +33,13 @@ export default function LandingPage() { -
- -
@@ -261,23 +216,21 @@ export default function LandingPage() { { title: "SHOP", items: [ { - label: "Best Sellers", href: "#best-sellers"}, + label: "Best Sellers", href: "/#best-sellers"}, { - label: "Collections", href: "#collections"}, + label: "Aqua Collection", href: "/collections/p-aqua"}, { - label: "Body Care", href: "#products"}, + label: "EmberCell Collection", href: "/collections/p-embercell"}, { - label: "Serums", href: "#products"}, - { - label: "Masks", href: "#products"}, + label: "PrismaStem Collection", href: "/collections/p-prismastem"}, ], }, { title: "CUSTOMER SERVICE", items: [ { - label: "Contact Us", href: "#contact"}, + label: "Contact Us", href: "/#contact"}, { - label: "FAQ", href: "#faq"}, + label: "FAQ", href: "/#faq"}, { label: "Shipping & Returns", href: "#"}, ], @@ -285,9 +238,9 @@ export default function LandingPage() { { title: "ABOUT US", items: [ { - label: "Our Story", href: "#about"}, + label: "Our Story", href: "/#about"}, { - label: "Our Philosophy", href: "#about"}, + label: "Our Philosophy", href: "/#about"}, { label: "Careers", href: "#"}, ],