Compare commits
20 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 4c543f66a0 | |||
| f8b887cd5a | |||
| d4f1f24210 | |||
| ae8a61fab9 | |||
| 0c31b2de7b | |||
| d3952bcf3e | |||
| e3f1f794e0 | |||
| 2a2a3cf087 | |||
| d5c9544d45 | |||
| f67d61ae42 | |||
| 8fb68892b5 | |||
| 5b2ab82858 | |||
| e22caec5de | |||
| ee5f7dba2b | |||
| 93a4b50374 | |||
| 1a359fe6fb | |||
| 60723f0e93 | |||
| d7a665aed1 | |||
| 7ced2f056a | |||
| 055523a17c |
126
src/app/collections/[collectionId]/page.tsx
Normal file
126
src/app/collections/[collectionId]/page.tsx
Normal file
@@ -0,0 +1,126 @@
|
|||||||
|
"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?_wi=1", 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?_wi=1", 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?_wi=1", 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?_wi=1", 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?_wi=1", 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?_wi=1", 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?_wi=1", 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?_wi=2", 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?_wi=1", 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?_wi=2", 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"};
|
||||||
|
|
||||||
|
const consistentNavItems = [
|
||||||
|
{ name: "Home", id: "/"},
|
||||||
|
{ name: "Best Sellers", id: "/#best-sellers"},
|
||||||
|
{ name: "Aqua Collection", id: "/collections/p-aqua"},
|
||||||
|
{ name: "EmberCell Collection", id: "/collections/p-embercell"},
|
||||||
|
{ name: "PrismaStem Collection", id: "/collections/p-prismastem"},
|
||||||
|
{ name: "About", id: "/#about"},
|
||||||
|
{ name: "Contact", id: "/#contact"},
|
||||||
|
];
|
||||||
|
|
||||||
|
const consistentFooterColumns = [
|
||||||
|
{
|
||||||
|
title: "SHOP", items: [
|
||||||
|
{ label: "Best Sellers", href: "/#best-sellers"},
|
||||||
|
{ label: "Aqua Collection", href: "/collections/p-aqua"},
|
||||||
|
{ label: "EmberCell Collection", href: "/collections/p-embercell"},
|
||||||
|
{ label: "PrismaStem Collection", href: "/collections/p-prismastem"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "CUSTOMER SERVICE", items: [
|
||||||
|
{ label: "Contact Us", href: "/#contact"},
|
||||||
|
{ label: "FAQ", href: "/#faq"},
|
||||||
|
{ label: "Shipping & Returns", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "ABOUT US", items: [
|
||||||
|
{ label: "Our Story", href: "/#about"},
|
||||||
|
{ label: "Our Philosophy", href: "/#about"},
|
||||||
|
{ label: "Careers", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "LEGAL", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#"},
|
||||||
|
{ label: "Terms of Service", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function CollectionPage() {
|
||||||
|
const params = useParams();
|
||||||
|
const collectionId = params.collectionId as string;
|
||||||
|
const products = collectionProducts[collectionId] || [];
|
||||||
|
const collectionTitle = collectionTitles[collectionId] || "Unknown Collection";
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-bubble"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="medium"
|
||||||
|
sizing="large"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="subtle-shadow"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="layered"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered
|
||||||
|
navItems={consistentNavItems}
|
||||||
|
brandName="Introstem"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="collection-products" data-section="collection-products" className="py-24 md:py-32">
|
||||||
|
<ProductCardThree
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
gridVariant="three-columns-all-equal-width"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
carouselMode="buttons"
|
||||||
|
products={products}
|
||||||
|
title={`${collectionTitle} Products`}
|
||||||
|
description={`Explore all the premium skincare products from our ${collectionTitle}.`}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterBase
|
||||||
|
columns={consistentFooterColumns}
|
||||||
|
logoText="Introstem"
|
||||||
|
copyrightText="© 2024 Introstem. All Rights Reserved."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
84
src/app/collections/aqua/page.tsx
Normal file
84
src/app/collections/aqua/page.tsx
Normal file
@@ -0,0 +1,84 @@
|
|||||||
|
"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: "Home", id: "/"},
|
||||||
|
{ name: "Best Sellers", id: "/#best-sellers"},
|
||||||
|
{ name: "Aqua Collection", id: "/collections/p-aqua"},
|
||||||
|
{ name: "EmberCell Collection", id: "/collections/p-embercell"},
|
||||||
|
{ name: "PrismaStem Collection", id: "/collections/p-prismastem"},
|
||||||
|
{ name: "About", id: "/#about"},
|
||||||
|
{ name: "Contact", id: "/#contact"},
|
||||||
|
];
|
||||||
|
|
||||||
|
const consistentFooterColumns = [
|
||||||
|
{
|
||||||
|
title: "SHOP", items: [
|
||||||
|
{ label: "Best Sellers", href: "/#best-sellers"},
|
||||||
|
{ label: "Aqua Collection", href: "/collections/p-aqua"},
|
||||||
|
{ label: "EmberCell Collection", href: "/collections/p-embercell"},
|
||||||
|
{ label: "PrismaStem Collection", href: "/collections/p-prismastem"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "CUSTOMER SERVICE", items: [
|
||||||
|
{ label: "Contact Us", href: "/#contact"},
|
||||||
|
{ label: "FAQ", href: "/#faq"},
|
||||||
|
{ label: "Shipping & Returns", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "ABOUT US", items: [
|
||||||
|
{ label: "Our Story", href: "/#about"},
|
||||||
|
{ label: "Our Philosophy", href: "/#about"},
|
||||||
|
{ label: "Careers", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "LEGAL", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#"},
|
||||||
|
{ label: "Terms of Service", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function AquaCollectionPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-bubble"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="medium"
|
||||||
|
sizing="large"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="subtle-shadow"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="layered"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
|
||||||
|
<h1 className="text-5xl font-bold mb-4">Aqua Collection</h1>
|
||||||
|
<p className="text-xl text-foreground/70 mb-8 max-w-2xl">Dive into deep hydration with the Aqua Collection, designed to replenish and revitalize your skin.</p>
|
||||||
|
{/* Add specific product details or marketing content for Aqua Collection here */}
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterBase
|
||||||
|
columns={consistentFooterColumns}
|
||||||
|
logoText="Introstem"
|
||||||
|
copyrightText="© 2024 Introstem. All Rights Reserved."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
84
src/app/collections/embercell/page.tsx
Normal file
84
src/app/collections/embercell/page.tsx
Normal file
@@ -0,0 +1,84 @@
|
|||||||
|
"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: "Home", id: "/"},
|
||||||
|
{ name: "Best Sellers", id: "/#best-sellers"},
|
||||||
|
{ name: "Aqua Collection", id: "/collections/p-aqua"},
|
||||||
|
{ name: "EmberCell Collection", id: "/collections/p-embercell"},
|
||||||
|
{ name: "PrismaStem Collection", id: "/collections/p-prismastem"},
|
||||||
|
{ name: "About", id: "/#about"},
|
||||||
|
{ name: "Contact", id: "/#contact"},
|
||||||
|
];
|
||||||
|
|
||||||
|
const consistentFooterColumns = [
|
||||||
|
{
|
||||||
|
title: "SHOP", items: [
|
||||||
|
{ label: "Best Sellers", href: "/#best-sellers"},
|
||||||
|
{ label: "Aqua Collection", href: "/collections/p-aqua"},
|
||||||
|
{ label: "EmberCell Collection", href: "/collections/p-embercell"},
|
||||||
|
{ label: "PrismaStem Collection", href: "/collections/p-prismastem"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "CUSTOMER SERVICE", items: [
|
||||||
|
{ label: "Contact Us", href: "/#contact"},
|
||||||
|
{ label: "FAQ", href: "/#faq"},
|
||||||
|
{ label: "Shipping & Returns", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "ABOUT US", items: [
|
||||||
|
{ label: "Our Story", href: "/#about"},
|
||||||
|
{ label: "Our Philosophy", href: "/#about"},
|
||||||
|
{ label: "Careers", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "LEGAL", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#"},
|
||||||
|
{ label: "Terms of Service", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function EmberCellCollectionPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-bubble"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="medium"
|
||||||
|
sizing="large"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="subtle-shadow"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="layered"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
|
||||||
|
<h1 className="text-5xl font-bold mb-4">EmberCell Collection</h1>
|
||||||
|
<p className="text-xl text-foreground/70 mb-8 max-w-2xl">Experience advanced rejuvenation with the EmberCell Collection, designed to firm and restore your skin's youthful vitality.</p>
|
||||||
|
{/* Add specific product details or marketing content for EmberCell Collection here */}
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterBase
|
||||||
|
columns={consistentFooterColumns}
|
||||||
|
logoText="Introstem"
|
||||||
|
copyrightText="© 2024 Introstem. All Rights Reserved."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
99
src/app/collections/page.tsx
Normal file
99
src/app/collections/page.tsx
Normal file
@@ -0,0 +1,99 @@
|
|||||||
|
"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: "Home", id: "/"},
|
||||||
|
{ name: "Best Sellers", id: "/#best-sellers"},
|
||||||
|
{ name: "Aqua Collection", id: "/collections/p-aqua"},
|
||||||
|
{ name: "EmberCell Collection", id: "/collections/p-embercell"},
|
||||||
|
{ name: "PrismaStem Collection", id: "/collections/p-prismastem"},
|
||||||
|
{ name: "About", id: "/#about"},
|
||||||
|
{ name: "Contact", id: "/#contact"},
|
||||||
|
];
|
||||||
|
|
||||||
|
const consistentFooterColumns = [
|
||||||
|
{
|
||||||
|
title: "SHOP", items: [
|
||||||
|
{ label: "Best Sellers", href: "/#best-sellers"},
|
||||||
|
{ label: "Aqua Collection", href: "/collections/p-aqua"},
|
||||||
|
{ label: "EmberCell Collection", href: "/collections/p-embercell"},
|
||||||
|
{ label: "PrismaStem Collection", href: "/collections/p-prismastem"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "CUSTOMER SERVICE", items: [
|
||||||
|
{ label: "Contact Us", href: "/#contact"},
|
||||||
|
{ label: "FAQ", href: "/#faq"},
|
||||||
|
{ label: "Shipping & Returns", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "ABOUT US", items: [
|
||||||
|
{ label: "Our Story", href: "/#about"},
|
||||||
|
{ label: "Our Philosophy", href: "/#about"},
|
||||||
|
{ label: "Careers", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "LEGAL", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#"},
|
||||||
|
{ label: "Terms of Service", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function CollectionsIndexPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-bubble"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="medium"
|
||||||
|
sizing="large"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="subtle-shadow"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="layered"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
|
||||||
|
<h1 className="text-5xl font-bold mb-4">Our Collections</h1>
|
||||||
|
<p className="text-xl text-foreground/70 mb-8 max-w-2xl">
|
||||||
|
Explore our exquisite range of skincare collections, each crafted with unique formulations to address your specific beauty needs.
|
||||||
|
</p>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 w-full max-w-4xl">
|
||||||
|
<a href="/collections/aqua" className="p-6 border rounded-lg hover:shadow-lg transition-shadow bg-card flex flex-col items-center justify-center text-center">
|
||||||
|
<h2 className="text-2xl font-semibold">Aqua Collection</h2>
|
||||||
|
<p className="text-foreground/60">Deep Hydration</p>
|
||||||
|
</a>
|
||||||
|
<a href="/collections/embercell" className="p-6 border rounded-lg hover:shadow-lg transition-shadow bg-card flex flex-col items-center justify-center text-center">
|
||||||
|
<h2 className="text-2xl font-semibold">EmberCell Collection</h2>
|
||||||
|
<p className="text-foreground/60">Rejuvenating & Anti-Aging</p>
|
||||||
|
</a>
|
||||||
|
<a href="/collections/prismastem" className="p-6 border rounded-lg hover:shadow-lg transition-shadow bg-card flex flex-col items-center justify-center text-center">
|
||||||
|
<h2 className="text-2xl font-semibold">PrismaStem Collection</h2>
|
||||||
|
<p className="text-foreground/60">Radiant Brightening</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterBase
|
||||||
|
columns={consistentFooterColumns}
|
||||||
|
logoText="Introstem"
|
||||||
|
copyrightText="© 2024 Introstem. All Rights Reserved."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
84
src/app/collections/prismastem/page.tsx
Normal file
84
src/app/collections/prismastem/page.tsx
Normal file
@@ -0,0 +1,84 @@
|
|||||||
|
"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: "Home", id: "/"},
|
||||||
|
{ name: "Best Sellers", id: "/#best-sellers"},
|
||||||
|
{ name: "Aqua Collection", id: "/collections/p-aqua"},
|
||||||
|
{ name: "EmberCell Collection", id: "/collections/p-embercell"},
|
||||||
|
{ name: "PrismaStem Collection", id: "/collections/p-prismastem"},
|
||||||
|
{ name: "About", id: "/#about"},
|
||||||
|
{ name: "Contact", id: "/#contact"},
|
||||||
|
];
|
||||||
|
|
||||||
|
const consistentFooterColumns = [
|
||||||
|
{
|
||||||
|
title: "SHOP", items: [
|
||||||
|
{ label: "Best Sellers", href: "/#best-sellers"},
|
||||||
|
{ label: "Aqua Collection", href: "/collections/p-aqua"},
|
||||||
|
{ label: "EmberCell Collection", href: "/collections/p-embercell"},
|
||||||
|
{ label: "PrismaStem Collection", href: "/collections/p-prismastem"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "CUSTOMER SERVICE", items: [
|
||||||
|
{ label: "Contact Us", href: "/#contact"},
|
||||||
|
{ label: "FAQ", href: "/#faq"},
|
||||||
|
{ label: "Shipping & Returns", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "ABOUT US", items: [
|
||||||
|
{ label: "Our Story", href: "/#about"},
|
||||||
|
{ label: "Our Philosophy", href: "/#about"},
|
||||||
|
{ label: "Careers", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "LEGAL", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#"},
|
||||||
|
{ label: "Terms of Service", href: "#"},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function PrismaStemCollectionPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="hover-bubble"
|
||||||
|
defaultTextAnimation="reveal-blur"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="medium"
|
||||||
|
sizing="large"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="subtle-shadow"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="layered"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarStyleCentered navItems={consistentNavItems} brandName="Introstem" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<main className="min-h-screen py-20 flex flex-col items-center justify-center text-center px-4">
|
||||||
|
<h1 className="text-5xl font-bold mb-4">PrismaStem Collection</h1>
|
||||||
|
<p className="text-xl text-foreground/70 mb-8 max-w-2xl">Achieve radiant brightness with the PrismaStem Collection, formulated to illuminate and even out your skin tone.</p>
|
||||||
|
{/* Add specific product details or marketing content for PrismaStem Collection here */}
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterBase
|
||||||
|
columns={consistentFooterColumns}
|
||||||
|
logoText="Introstem"
|
||||||
|
copyrightText="© 2024 Introstem. All Rights Reserved."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
101
src/app/page.tsx
101
src/app/page.tsx
@@ -8,7 +8,7 @@ import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwent
|
|||||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
||||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
|
||||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||||
@@ -33,20 +33,13 @@ export default function LandingPage() {
|
|||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarStyleCentered
|
<NavbarStyleCentered
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{ name: "Home", id: "/"},
|
||||||
name: "Shop", id: "#shop"},
|
{ name: "Best Sellers", id: "/#best-sellers"},
|
||||||
{
|
{ name: "Aqua Collection", id: "/collections/p-aqua"},
|
||||||
name: "Best Sellers", id: "#best-sellers"},
|
{ name: "EmberCell Collection", id: "/collections/p-embercell"},
|
||||||
{
|
{ name: "PrismaStem Collection", id: "/collections/p-prismastem"},
|
||||||
name: "Collections", id: "#collections"},
|
{ name: "About", id: "/#about"},
|
||||||
{
|
{ name: "Contact", id: "/#contact"},
|
||||||
name: "Products", id: "#products"},
|
|
||||||
{
|
|
||||||
name: "Concerns", id: "#concerns"},
|
|
||||||
{
|
|
||||||
name: "About", id: "#about"},
|
|
||||||
{
|
|
||||||
name: "Contact", id: "#contact"},
|
|
||||||
]}
|
]}
|
||||||
brandName="Introstem"
|
brandName="Introstem"
|
||||||
/>
|
/>
|
||||||
@@ -58,9 +51,9 @@ export default function LandingPage() {
|
|||||||
description="Discover beauty in all our products, harnessing the power of Grape Stem Cells in every drop."
|
description="Discover beauty in all our products, harnessing the power of Grape Stem Cells in every drop."
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{
|
||||||
text: "Unlock Your Skin's Youthful Radiance", href: "#best-sellers"},
|
text: "Unlock Your Skin's Youthful Radiance", href: "/#best-sellers"},
|
||||||
{
|
{
|
||||||
text: "Learn More About Grape Stem Cells", href: "#about"},
|
text: "Learn More About Grape Stem Cells", href: "/#about"},
|
||||||
]}
|
]}
|
||||||
slides={[
|
slides={[
|
||||||
{
|
{
|
||||||
@@ -101,13 +94,13 @@ export default function LandingPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
features={[
|
features={[
|
||||||
{
|
{
|
||||||
title: "Deep Hydration", description: "Infuse your skin with essential moisture, leaving it plump, soft, and supple throughout the day.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-pearls-make-up_23-2148871296.jpg", imageAlt: "Close-up of healthy skin with water drops, symbolizing hydration", buttonIcon: Droplet,
|
title: "Deep Hydration", description: "Infuse your skin with essential moisture, leaving it plump, soft, and supple throughout the day.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-pearls-make-up_23-2148871296.jpg?_wi=2", imageAlt: "Close-up of healthy skin with water drops, symbolizing hydration", buttonIcon: Droplet,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Advanced Anti-Aging", description: "Target fine lines and wrinkles, promoting a smoother, more youthful complexion with our potent formulas.", imageSrc: "http://img.b2bpic.net/free-photo/young-blonde-female-model-portrait_23-2149012592.jpg", imageAlt: "Luxurious anti-aging cream jar with elegant lighting", buttonIcon: HeartPulse,
|
title: "Advanced Anti-Aging", description: "Target fine lines and wrinkles, promoting a smoother, more youthful complexion with our potent formulas.", imageSrc: "http://img.b2bpic.net/free-photo/young-blonde-female-model-portrait_23-2149012592.jpg", imageAlt: "Luxurious anti-aging cream jar with elegant lighting", buttonIcon: HeartPulse,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Firmer, Tighter Skin", description: "Improve skin elasticity and firmness, giving you a visibly lifted and revitalized appearance.", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-serum-plant_23-2148899353.jpg", imageAlt: "Elegant serum bottle for skin firming", buttonIcon: Nut,
|
title: "Firmer, Tighter Skin", description: "Improve skin elasticity and firmness, giving you a visibly lifted and revitalized appearance.", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-serum-plant_23-2148899353.jpg?_wi=2", imageAlt: "Elegant serum bottle for skin firming", buttonIcon: Nut,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Radiant Brightening", description: "Enhance your natural glow and achieve an even skin tone, reducing the appearance of dark spots.", imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-orange-slices-near-her-face_171337-1765.jpg", imageAlt: "Brightening serum with a luminous effect on skin", buttonIcon: Lightbulb,
|
title: "Radiant Brightening", description: "Enhance your natural glow and achieve an even skin tone, reducing the appearance of dark spots.", imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-orange-slices-near-her-face_171337-1765.jpg", imageAlt: "Brightening serum with a luminous effect on skin", buttonIcon: Lightbulb,
|
||||||
@@ -127,17 +120,17 @@ export default function LandingPage() {
|
|||||||
carouselMode="buttons"
|
carouselMode="buttons"
|
||||||
products={[
|
products={[
|
||||||
{
|
{
|
||||||
id: "p1", name: "VitisCell Hydra Fresh Toner", price: "$250.00", imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-moisturizer_23-2147710598.jpg", imageAlt: "Introstem VitisCell Hydra Fresh Toner bottle"},
|
id: "p1", name: "VitisCell Hydra Fresh Toner", price: "$250.00", imageSrc: "http://img.b2bpic.net/free-photo/bottle-with-moisturizer_23-2147710598.jpg?_wi=2", imageAlt: "Introstem VitisCell Hydra Fresh Toner bottle"},
|
||||||
{
|
{
|
||||||
id: "p2", 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: "Introstem VitisCell Fresh Cleanser tube"},
|
id: "p2", 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?_wi=3", imageAlt: "Introstem VitisCell Fresh Cleanser tube"},
|
||||||
{
|
{
|
||||||
id: "p3", name: "EmberCell Resurfacing Mask", price: "$320.00", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-body-butter-pink-cloth_23-2148305543.jpg", imageAlt: "Introstem EmberCell Resurfacing Mask jar"},
|
id: "p3", name: "EmberCell Resurfacing Mask", price: "$320.00", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-body-butter-pink-cloth_23-2148305543.jpg?_wi=2", imageAlt: "Introstem EmberCell Resurfacing Mask jar"},
|
||||||
{
|
{
|
||||||
id: "p4", name: "Lumi-Cell Brightening Serum", price: "$450.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg", imageAlt: "Introstem Lumi-Cell Brightening Serum dropper bottle"},
|
id: "p4", name: "Lumi-Cell Brightening Serum", price: "$450.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hyaluronic-acid-tratment_23-2149286738.jpg?_wi=3", imageAlt: "Introstem Lumi-Cell Brightening Serum dropper bottle"},
|
||||||
{
|
{
|
||||||
id: "p5", name: "Intro Eye Cream", price: "$290.00", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-bathrobe-doing-make-up_114579-27518.jpg", imageAlt: "Introstem Intro Eye Cream jar"},
|
id: "p5", name: "Intro Eye Cream", price: "$290.00", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-bathrobe-doing-make-up_114579-27518.jpg?_wi=2", imageAlt: "Introstem Intro Eye Cream jar"},
|
||||||
{
|
{
|
||||||
id: "p6", name: "Transforming Daily Moisturizer", price: "$380.00", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-applying-body-lotion-after-shower_171337-12785.jpg", imageAlt: "Introstem Transforming Daily Moisturizer jar"},
|
id: "p6", name: "Transforming Daily Moisturizer", price: "$380.00", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-applying-body-lotion-after-shower_171337-12785.jpg?_wi=2", imageAlt: "Introstem Transforming Daily Moisturizer jar"},
|
||||||
]}
|
]}
|
||||||
title="Our Best Sellers"
|
title="Our Best Sellers"
|
||||||
description="Explore our most loved facial care products, chosen by our valued customers for their exceptional results and luxurious feel."
|
description="Explore our most loved facial care products, chosen by our valued customers for their exceptional results and luxurious feel."
|
||||||
@@ -165,44 +158,6 @@ export default function LandingPage() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="collections" data-section="collections">
|
|
||||||
<PricingCardEight
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
plans={[
|
|
||||||
{
|
|
||||||
id: "p-aqua", badge: "Hydrating", badgeIcon: Droplet,
|
|
||||||
price: "$599.00", subtitle: "Aqua Collection", buttons: [
|
|
||||||
{
|
|
||||||
text: "Explore Collection", href: "#"},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Deep Hydration Complex", "Refreshing Cleanser", "Nourishing Moisturizer", "Plumping Serum", "Suitable for Dry Skin"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p-embercell", badge: "Rejuvenating", badgeIcon: Leaf,
|
|
||||||
price: "$899.00", subtitle: "EmberCell Collection", buttons: [
|
|
||||||
{
|
|
||||||
text: "Explore Collection", href: "#"},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Advanced Anti-Aging Formula", "Resurfacing Mask", "Firming Cream", "Restorative Serum", "Combats Fine Lines"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p-prismastem", badge: "Brightening", badgeIcon: Sun,
|
|
||||||
price: "$749.00", subtitle: "PrismaStem Collection", buttons: [
|
|
||||||
{
|
|
||||||
text: "Explore Collection", href: "#"},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Radiance-Boosting Complex", "Brightening Cleanser", "Tone-Correcting Moisturizer", "Illuminating Serum", "Evens Skin Tone"],
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
title="Curated Skincare Collections"
|
|
||||||
description="Unlock your skin's full potential with our exclusive product bundles, tailored for every need and designed to deliver comprehensive care."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
<div id="faq" data-section="faq">
|
||||||
<FaqDouble
|
<FaqDouble
|
||||||
@@ -249,7 +204,7 @@ export default function LandingPage() {
|
|||||||
description="Have questions, need personalized skincare advice, or want to learn more about our products? Our dedicated team is here to help you achieve radiant, healthy skin."
|
description="Have questions, need personalized skincare advice, or want to learn more about our products? Our dedicated team is here to help you achieve radiant, healthy skin."
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{
|
||||||
text: "Contact Us", href: "#"},
|
text: "Contact Us", href: "/#contact"},
|
||||||
]}
|
]}
|
||||||
buttonAnimation="opacity"
|
buttonAnimation="opacity"
|
||||||
/>
|
/>
|
||||||
@@ -261,23 +216,21 @@ export default function LandingPage() {
|
|||||||
{
|
{
|
||||||
title: "SHOP", items: [
|
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: "PrismaStem Collection", href: "/collections/p-prismastem"},
|
||||||
{
|
|
||||||
label: "Masks", href: "#products"},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "CUSTOMER SERVICE", items: [
|
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: "#"},
|
label: "Shipping & Returns", href: "#"},
|
||||||
],
|
],
|
||||||
@@ -285,9 +238,9 @@ export default function LandingPage() {
|
|||||||
{
|
{
|
||||||
title: "ABOUT US", items: [
|
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: "#"},
|
label: "Careers", href: "#"},
|
||||||
],
|
],
|
||||||
|
|||||||
Reference in New Issue
Block a user