Merge version_1 into main #2
273
src/app/page.tsx
273
src/app/page.tsx
@@ -17,23 +17,21 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Collection",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "Why Us",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{ name: "Collection", id: "#products" },
|
||||
{ name: "Why Us", id: "#features" },
|
||||
{ name: "Reviews", id: "#testimonials" },
|
||||
]}
|
||||
brandName="SF ESSENTIALS"
|
||||
/>
|
||||
@@ -44,16 +42,10 @@ export default function LandingPage() {
|
||||
logoText="SF ESSENTIALS"
|
||||
description="Premium watches that elevate your style — without the premium price. Luxury that doesn’t ask for permission."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Now",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
text: "Explore Collection",
|
||||
href: "#products",
|
||||
},
|
||||
{ text: "Shop Now", href: "#products" },
|
||||
{ text: "Explore Collection", href: "#products" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/closeup-watch_53876-32028.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/closeup-watch_53876-32028.jpg"
|
||||
imageAlt="SF Essentials luxury watch hero shot"
|
||||
showDimOverlay={true}
|
||||
/>
|
||||
@@ -66,60 +58,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "SF Essentials",
|
||||
name: "Classic Gold",
|
||||
price: "$129",
|
||||
rating: 5,
|
||||
reviewCount: "1.2k",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/clock-plate-with-sequins_23-2147992707.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "SF Essentials",
|
||||
name: "Midnight Silver",
|
||||
price: "$115",
|
||||
rating: 5,
|
||||
reviewCount: "890",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metal-pieces-close-up-background_23-2148882603.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "SF Essentials",
|
||||
name: "Heritage Leather",
|
||||
price: "$149",
|
||||
rating: 4.8,
|
||||
reviewCount: "2.1k",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-casual-cloth-suit-with-accessories-hands_158538-9455.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "SF Essentials",
|
||||
name: "Chronograph Elite",
|
||||
price: "$189",
|
||||
rating: 5,
|
||||
reviewCount: "670",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/new-year-party-concept-with-girl-holding-clock_23-2147995152.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "SF Essentials",
|
||||
name: "Rose Gold Minimalist",
|
||||
price: "$135",
|
||||
rating: 4.9,
|
||||
reviewCount: "940",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-coffee-keyboard-decoration_23-2148604907.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "SF Essentials",
|
||||
name: "Signature Sapphire",
|
||||
price: "$199",
|
||||
rating: 5,
|
||||
reviewCount: "1.5k",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/everyday-home-utensils-wood-background_58702-17792.jpg",
|
||||
},
|
||||
{ id: "p1", brand: "SF Essentials", name: "Classic Gold", price: "$129", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/clock-plate-with-sequins_23-2147992707.jpg" },
|
||||
{ id: "p2", brand: "SF Essentials", name: "Midnight Silver", price: "$115", rating: 5, reviewCount: "890", imageSrc: "http://img.b2bpic.net/free-photo/metal-pieces-close-up-background_23-2148882603.jpg" },
|
||||
{ id: "p3", brand: "SF Essentials", name: "Heritage Leather", price: "$149", rating: 4.8, reviewCount: "2.1k", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-casual-cloth-suit-with-accessories-hands_158538-9455.jpg" },
|
||||
{ id: "p4", brand: "SF Essentials", name: "Chronograph Elite", price: "$189", rating: 5, reviewCount: "670", imageSrc: "http://img.b2bpic.net/free-photo/new-year-party-concept-with-girl-holding-clock_23-2147995152.jpg" },
|
||||
{ id: "p5", brand: "SF Essentials", name: "Rose Gold Minimalist", price: "$135", rating: 4.9, reviewCount: "940", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-coffee-keyboard-decoration_23-2148604907.jpg" },
|
||||
{ id: "p6", brand: "SF Essentials", name: "Signature Sapphire", price: "$199", rating: 5, reviewCount: "1.5k", imageSrc: "http://img.b2bpic.net/free-photo/everyday-home-utensils-wood-background_58702-17792.jpg" },
|
||||
]}
|
||||
title="Timeless Elegance"
|
||||
description="Crafted to look expensive. Priced to feel smart."
|
||||
@@ -130,47 +74,24 @@ export default function LandingPage() {
|
||||
<FeatureCardNine
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Premium Aesthetics",
|
||||
description: "Designed with the attention to detail typically found in pieces ten times the price.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241140.jpg",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cool-round-shaped-futuristic-sci-fi-techno-lights-perfect-futuristic-backgrounds_181624-10024.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-watch_53876-32028.jpg?_wi=2",
|
||||
imageAlt: "luxury watch dark velvet background",
|
||||
},
|
||||
{
|
||||
title: "Smart Pricing",
|
||||
description: "By eliminating retail markups, we deliver luxury craftsmanship directly to your wrist.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-s-hand-with-stylish-watch-sleeve_8353-10475.jpg",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-vintage-clock_23-2150315175.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-sitting-cafe_176420-5923.jpg?_wi=1",
|
||||
imageAlt: "luxury watch dark velvet background",
|
||||
},
|
||||
{
|
||||
title: "Verified Quality",
|
||||
description: "Thousands of customers have verified our commitment to quality, comfort, and durability.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/watch-blank-paper-father-s-day_23-2147683462.jpg",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gold-watch-with-white-leather-band-lights-isolated-white_181624-28414.jpg",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-smiling-look-camera_197531-33893.jpg?_wi=1",
|
||||
imageAlt: "luxury watch dark velvet background",
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
showStepNumbers={false}
|
||||
title="Why SF ESSENTIALS"
|
||||
description="Luxury that speaks for itself. We believe true class shouldn't have a prohibitive entry cost."
|
||||
features={[
|
||||
{
|
||||
title: "Premium Aesthetics", description: "Designed with the attention to detail typically found in pieces ten times the price.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241140.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/cool-round-shaped-futuristic-sci-fi-techno-lights-perfect-futuristic-backgrounds_181624-10024.jpg" }
|
||||
},
|
||||
{
|
||||
title: "Smart Pricing", description: "By eliminating retail markups, we deliver luxury craftsmanship directly to your wrist.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-s-hand-with-stylish-watch-sleeve_8353-10475.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/view-vintage-clock_23-2150315175.jpg" }
|
||||
},
|
||||
{
|
||||
title: "Verified Quality", description: "Thousands of customers have verified our commitment to quality, comfort, and durability.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/watch-blank-paper-father-s-day_23-2147683462.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/gold-watch-with-white-leather-band-lights-isolated-white_181624-28414.jpg" }
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -179,46 +100,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Amazing Product",
|
||||
quote: "Looks like premium. An amazing watch in this range.",
|
||||
name: "Alex R.",
|
||||
role: "Verified Buyer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-sitting-cafe_176420-5923.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "Value for Money",
|
||||
quote: "Awesome product. Value for money and looks so classy.",
|
||||
name: "Sarah J.",
|
||||
role: "Verified Buyer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-smiling-look-camera_197531-33893.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Classy Wear",
|
||||
quote: "Class meets everyday wear. I get compliments daily.",
|
||||
name: "Marcus T.",
|
||||
role: "Verified Buyer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gorgeous-adult-caucasian-blonde-silk-black-pajamas-uses-headphones-sits-balcony-day-leisure-lifestyle-beauty-concept_197531-31178.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Unexpected Quality",
|
||||
quote: "The build quality is stunning for the price. Truly a gem.",
|
||||
name: "Elena V.",
|
||||
role: "Verified Buyer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-model-dressed-warm-overcoat-posing-studio_158538-11456.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "Simply Perfect",
|
||||
quote: "This is a smart buy. Looks way more expensive than it is.",
|
||||
name: "David W.",
|
||||
role: "Verified Buyer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-stylish-blond-male-dressed-blue-suit_613910-12750.jpg",
|
||||
},
|
||||
{ id: "t1", title: "Amazing Product", quote: "Looks like premium. An amazing watch in this range.", name: "Alex R.", role: "Verified Buyer", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-sitting-cafe_176420-5923.jpg" },
|
||||
{ id: "t2", title: "Value for Money", quote: "Awesome product. Value for money and looks so classy.", name: "Sarah J.", role: "Verified Buyer", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-smiling-look-camera_197531-33893.jpg" },
|
||||
{ id: "t3", title: "Classy Wear", quote: "Class meets everyday wear. I get compliments daily.", name: "Marcus T.", role: "Verified Buyer", imageSrc: "http://img.b2bpic.net/free-photo/gorgeous-adult-caucasian-blonde-silk-black-pajamas-uses-headphones-sits-balcony-day-leisure-lifestyle-beauty-concept_197531-31178.jpg" },
|
||||
{ id: "t4", title: "Unexpected Quality", quote: "The build quality is stunning for the price. Truly a gem.", name: "Elena V.", role: "Verified Buyer", imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-model-dressed-warm-overcoat-posing-studio_158538-11456.jpg" },
|
||||
{ id: "t5", title: "Simply Perfect", quote: "This is a smart buy. Looks way more expensive than it is.", name: "David W.", role: "Verified Buyer", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-stylish-blond-male-dressed-blue-suit_613910-12750.jpg" },
|
||||
]}
|
||||
title="Loved by Customers"
|
||||
description="Don't just take our word for it. Join a community of style-conscious individuals."
|
||||
@@ -229,94 +115,31 @@ export default function LandingPage() {
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={true}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "Style for ",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/mid-section-businessman-holding-wristwatch-his-hand_23-2147941431.jpg",
|
||||
alt: "Luxury Lifestyle",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
content: " Every Moment",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Upgrade Your Style",
|
||||
href: "#products",
|
||||
},
|
||||
{ type: "text", content: "Style for " },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/mid-section-businessman-holding-wristwatch-his-hand_23-2147941431.jpg", alt: "Luxury Lifestyle" },
|
||||
{ type: "text", content: " Every Moment" },
|
||||
]}
|
||||
buttons={[{ text: "Upgrade Your Style", href: "#products" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Limited Time"
|
||||
title="Ready to own the look of luxury?"
|
||||
description="Join thousands of style leaders who choose SF ESSENTIALS. Limited stock available."
|
||||
buttons={[
|
||||
{
|
||||
text: "Upgrade Your Style Today",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Upgrade Your Style Today", href: "#products" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Collections",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Quality",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Shipping",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Returns",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Support",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ items: [{ label: "About Us", href: "#" }, { label: "Collections", href: "#products" }, { label: "Quality", href: "#features" }] },
|
||||
{ items: [{ label: "Shipping", href: "#" }, { label: "Returns", href: "#" }, { label: "Support", href: "#" }] },
|
||||
{ items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
|
||||
]}
|
||||
logoText="SF ESSENTIALS"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user