Update src/app/page.tsx
This commit is contained in:
259
src/app/page.tsx
259
src/app/page.tsx
@@ -2,7 +2,6 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { Zap, Target, Shield, Clock } from "lucide-react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
@@ -28,125 +27,161 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Shop", id: "shop" },
|
||||
{ name: "Collection", id: "collection" },
|
||||
{ name: "Story", id: "story" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="TAMKIN"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Shop", id: "shop"},
|
||||
{
|
||||
name: "Collection", id: "collection"},
|
||||
{
|
||||
name: "Story", id: "story"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="TAMKIN"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "rotated-rays-static" }}
|
||||
title="Discipline. Focus. Control."
|
||||
description="Minimal. Purposeful. Halal."
|
||||
carouselItems={[
|
||||
{ id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/black-hipster-male-dressed-fleece-shirt-baseball-sits-near-window-using-smartphone_613910-10027.jpg" },
|
||||
{ id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/young-female-cook-black-apron_176474-93715.jpg" },
|
||||
{ id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/black-stylish-cap-light-background_185193-162839.jpg" },
|
||||
{ id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/delivery-man-covering-eyes-with-hand-black-t-shirt-cap-looking-cheerful_176474-19845.jpg" },
|
||||
{ id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing-with-trucker-hat_23-2149412790.jpg" },
|
||||
{ id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-smartphone-while-pointing-head-black-t-shirt_176474-20281.jpg" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "rotated-rays-static"}}
|
||||
title="Discipline. Focus. Control."
|
||||
description="Minimal. Purposeful. Halal."
|
||||
carouselItems={[
|
||||
{
|
||||
id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/black-hipster-male-dressed-fleece-shirt-baseball-sits-near-window-using-smartphone_613910-10027.jpg"},
|
||||
{
|
||||
id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/young-female-cook-black-apron_176474-93715.jpg"},
|
||||
{
|
||||
id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/black-stylish-cap-light-background_185193-162839.jpg"},
|
||||
{
|
||||
id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/delivery-man-covering-eyes-with-hand-black-t-shirt-cap-looking-cheerful_176474-19845.jpg"},
|
||||
{
|
||||
id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-posing-with-trucker-hat_23-2149412790.jpg"},
|
||||
{
|
||||
id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-smartphone-while-pointing-head-black-t-shirt_176474-20281.jpg"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="shop" data-section="shop">
|
||||
<ProductCardFour
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
products={[
|
||||
{ id: "p1", name: "Black Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-linens_23-2148817547.jpg" },
|
||||
{ id: "p2", name: "Beige Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/fedora-hats-arrangement-studio_23-2150737125.jpg" },
|
||||
{ id: "p3", name: "Navy Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/expressive-teenage-girl-is-posing_176474-60106.jpg" },
|
||||
{ id: "p4", name: "Charcoal Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/creative-trucker-hat-still-life_23-2149504625.jpg" },
|
||||
{ id: "p5", name: "Olive Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/fashionable-fedora-hat-studio_23-2150737133.jpg" },
|
||||
{ id: "p6", name: "Limited Edition Cap", price: "$85", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/young-man-t-shirt-hat-looking-shoulder-looking-cheerful-back-view_176474-92295.jpg" },
|
||||
]}
|
||||
title="Featured Essentials"
|
||||
description="The foundation of your disciplined wardrobe."
|
||||
/>
|
||||
</div>
|
||||
<div id="shop" data-section="shop">
|
||||
<ProductCardFour
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Black Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-linens_23-2148817547.jpg"},
|
||||
{
|
||||
id: "p2", name: "Beige Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/fedora-hats-arrangement-studio_23-2150737125.jpg"},
|
||||
{
|
||||
id: "p3", name: "Navy Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/expressive-teenage-girl-is-posing_176474-60106.jpg"},
|
||||
{
|
||||
id: "p4", name: "Charcoal Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/creative-trucker-hat-still-life_23-2149504625.jpg"},
|
||||
{
|
||||
id: "p5", name: "Olive Signature Cap", price: "$65", variant: "Cotton Twill", imageSrc: "http://img.b2bpic.net/free-photo/fashionable-fedora-hat-studio_23-2150737133.jpg"},
|
||||
{
|
||||
id: "p6", name: "Limited Edition Cap", price: "$85", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/young-man-t-shirt-hat-looking-shoulder-looking-cheerful-back-view_176474-92295.jpg"},
|
||||
]}
|
||||
title="Featured Essentials"
|
||||
description="The foundation of your disciplined wardrobe."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="details" data-section="details">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "100% Cotton Twill", descriptions: ["Breathable premium cotton for everyday comfort."], imageSrc: "http://img.b2bpic.net/free-photo/blue-blouse-made-silk_23-2148237590.jpg" },
|
||||
{ id: "f2", title: "3D Embroidery", descriptions: ["Precision-stitched brand mark for textured depth."], imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711584.jpg" },
|
||||
{ id: "f3", title: "Metal Clasp", descriptions: ["Adjustable premium clasp for a custom, secure fit."], imageSrc: "http://img.b2bpic.net/free-photo/fashion-hipster-male-model-posing-outdoor_158595-813.jpg" },
|
||||
]}
|
||||
title="Crafted for Control"
|
||||
description="Every element of the TAMKIN cap is designed with intention and durability in mind."
|
||||
/>
|
||||
</div>
|
||||
<div id="details" data-section="details">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1", title: "100% Cotton Twill", descriptions: [
|
||||
"Breathable premium cotton for everyday comfort."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-blouse-made-silk_23-2148237590.jpg"},
|
||||
{
|
||||
id: "f2", title: "3D Embroidery", descriptions: [
|
||||
"Precision-stitched brand mark for textured depth."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711584.jpg"},
|
||||
{
|
||||
id: "f3", title: "Metal Clasp", descriptions: [
|
||||
"Adjustable premium clasp for a custom, secure fit."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-hipster-male-model-posing-outdoor_158595-813.jpg"},
|
||||
]}
|
||||
title="Crafted for Control"
|
||||
description="Every element of the TAMKIN cap is designed with intention and durability in mind."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="story" data-section="story">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="TAMKIN: The Philosophy"
|
||||
description={[
|
||||
"TAMKIN stands for strength, empowerment, and control. Our brand is an extension of the values we hold dear: focus, discipline, and intentional living.", "We believe in the power of purposeful design to anchor your daily routine and remind you of your goals."]}
|
||||
/>
|
||||
</div>
|
||||
<div id="story" data-section="story">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Brand Story"
|
||||
description={[
|
||||
"Born from the need for clarity in a world of distraction. TAMKIN is our manifesto for disciplined, purposeful living.", "Each piece is crafted with minimalist aesthetics to ensure you focus on what truly matters without compromise."
|
||||
]}
|
||||
className="py-24 bg-background"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="collection" data-section="collection">
|
||||
<MetricCardThree
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", title: "Caps", value: "Current", icon: Zap },
|
||||
{ id: "m2", title: "Hoodies", value: "Soon", icon: Target },
|
||||
{ id: "m3", title: "Sweatshirts", value: "Soon", icon: Shield },
|
||||
{ id: "m4", title: "Pants", value: "Soon", icon: Clock },
|
||||
]}
|
||||
title="The Roadmap"
|
||||
description="Our upcoming collection releases."
|
||||
/>
|
||||
</div>
|
||||
<div id="collection" data-section="collection">
|
||||
<MetricCardThree
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", title: "Caps", value: "Current"},
|
||||
{
|
||||
id: "m2", title: "Hoodies", value: "Soon"},
|
||||
{
|
||||
id: "m3", title: "Sweatshirts", value: "Soon"},
|
||||
{
|
||||
id: "m4", title: "Pants", value: "Soon"},
|
||||
]}
|
||||
title="The Roadmap"
|
||||
description="Our upcoming collection releases."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="lifestyle" data-section="lifestyle">
|
||||
<TeamCardTen
|
||||
useInvertedBackground={false}
|
||||
title="Stay Focused"
|
||||
tag="TAMKIN Aesthetic"
|
||||
membersAnimation="opacity"
|
||||
members={[
|
||||
{ id: "l1", name: "Cinematic Look", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-friends-relaxing-with-electric-scooter_23-2149356827.jpg" },
|
||||
{ id: "l2", name: "Daily Discipline", imageSrc: "http://img.b2bpic.net/free-photo/young-lady-holding-clasped-hands-near-face-t-shirt-cap-looking-hopeful-front-view_176474-54690.jpg" },
|
||||
{ id: "l3", name: "Purposeful Wear", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-goth-teenager-posing-studio_23-2150501590.jpg" },
|
||||
]}
|
||||
memberVariant="default"
|
||||
/>
|
||||
</div>
|
||||
<div id="lifestyle" data-section="lifestyle">
|
||||
<TeamCardTen
|
||||
useInvertedBackground={false}
|
||||
title="Stay Focused"
|
||||
tag="TAMKIN Aesthetic"
|
||||
membersAnimation="opacity"
|
||||
members={[
|
||||
{
|
||||
id: "l1", name: "Cinematic Look", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CwaZiUZkZl9FoYeHzLcZ5JJp6X/uploaded-1777299207644-1vg71i0v.png"},
|
||||
{
|
||||
id: "l2", name: "Daily Discipline", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CwaZiUZkZl9FoYeHzLcZ5JJp6X/uploaded-1777299207644-vzkk4e7x.png"},
|
||||
]}
|
||||
memberVariant="card"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Stay Focused. Wear TAMKIN."
|
||||
description="Join our journey and stay updated with upcoming releases."
|
||||
inputs={[{ name: "email", type: "email", placeholder: "Email Address", required: true }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186466.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Get In Touch"
|
||||
description="Have questions about our products or philosophy? Reach out to us anytime."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email Address", required: true },
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Your message...", rows: 4 }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186466.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="TAMKIN"
|
||||
copyrightText="© 2025 TAMKIN | Discipline. Focus. Control."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="TAMKIN"
|
||||
copyrightText="© 2025 TAMKIN | Discipline. Focus. Control."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user