Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 7537c57a8e | |||
| db1bfc2199 | |||
| 40a2b6af99 | |||
| 3acca3f834 | |||
| af1b043208 | |||
| d2b12bfa3a |
221
src/app/page.tsx
221
src/app/page.tsx
@@ -18,27 +18,23 @@ export default function LandingPage() {
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSmallSizeLargeTitles"
|
||||
background="floatingGradient"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noise"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Beauty", id: "products"},
|
||||
{
|
||||
name: "Kitchen", id: "kitchen"},
|
||||
{
|
||||
name: "Blog", id: "blog"},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Beauty", id: "products" },
|
||||
{ name: "Kitchen", id: "kitchen" },
|
||||
{ name: "Blog", id: "blog" },
|
||||
]}
|
||||
brandName="TrendPK"
|
||||
/>
|
||||
@@ -49,43 +45,12 @@ export default function LandingPage() {
|
||||
title="Top Trending Beauty & Kitchen Deals in Pakistan 🔥"
|
||||
description="Discover curated deals on premium skincare and kitchen essentials. Save big with Daraz today."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Ayesha Khan", handle: "Makeup Artist", testimonial: "I love how easy it is to find the best skincare deals here. Highly recommended!", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-customer-approving-new-offer_1262-17151.jpg"},
|
||||
{
|
||||
name: "Sara Ali", handle: "Baker", testimonial: "Found amazing cake tools at great prices. Very reliable!", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-holding-phone-paper-bags_23-2148339210.jpg"},
|
||||
{
|
||||
name: "Mehwish R.", handle: "Consumer", testimonial: "Fast updates on deals. My go-to for shopping.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/excited-joyful-beautiful-woman-gesturing-with-hand_74855-2753.jpg"},
|
||||
{
|
||||
name: "Fatima Z.", handle: "Influencer", testimonial: "Amazing collection and the affiliate links work perfectly.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shopping-girl-using-her-mobile-phone_23-2148023296.jpg"},
|
||||
{
|
||||
name: "Hina K.", handle: "Professional", testimonial: "Best deals I've found in Pakistan so far.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-showing-ok-sign_23-2148990150.jpg"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Beauty", href: "#products"},
|
||||
{
|
||||
text: "Shop Kitchen", href: "#kitchen"},
|
||||
{ name: "Ayesha Khan", handle: "Makeup Artist", testimonial: "I love how easy it is to find the best skincare deals here. Highly recommended!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/positive-customer-approving-new-offer_1262-17151.jpg" },
|
||||
{ name: "Sara Ali", handle: "Baker", testimonial: "Found amazing cake tools at great prices. Very reliable!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-holding-phone-paper-bags_23-2148339210.jpg" }
|
||||
]}
|
||||
buttons={[{ text: "Shop Beauty", href: "#products" }, { text: "Shop Kitchen", href: "#kitchen" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cutlery-tangerines-top-view_23-2148677999.jpg"
|
||||
imageAlt="beauty skincare products professional flatlay"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiley-woman-doing-thumbs-up_23-2148628939.jpg", alt: "Smiley woman doing the thumbs up"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-adult-pressing-buzzer-button_23-2149586564.jpg", alt: "Young adult pressing buzzer button"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-smiling-girl-shows-okay-ok-signs-look-satisfied-recommend-good-company-perfect-quality-praise-good-job-well-done-standing-pleased-against-white-background_176420-54380.jpg", alt: "Portrait of smiling girl shows okay OK signs look satisfied"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-blonde-woman-wearing-casual-blue-shirt-success-sign-doing-positive-gesture-with-hand-thumbs-up-smiling-happy-cheerful-expression-winner-gesture_839833-2022.jpg", alt: "Young blonde woman wearing casual blue shirt success sign"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-pretty-woman-smiling_23-2148316190.jpg", alt: "Front view pretty woman smiling"},
|
||||
]}
|
||||
avatarText="Join 10,000+ happy shoppers"
|
||||
imageAlt="Trending deals showcase"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -94,49 +59,15 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
title="Beauty Favorites"
|
||||
description="Professional skincare picks for your glow."
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Glow Serum", price: "Rs. 2,499", imageSrc: "http://img.b2bpic.net/free-photo/front-view-assortment-skin-care-cream_23-2148761485.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "p2", name: "Matte Lipstick", price: "Rs. 999", imageSrc: "http://img.b2bpic.net/free-photo/foundation-container-beauty-blender_23-2149705493.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "p3", name: "Moisturizer", price: "Rs. 1,899", imageSrc: "http://img.b2bpic.net/free-photo/creative-display-makeup-product_23-2150063086.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "p4", name: "Hair Oil", price: "Rs. 1,299", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-view-cosmetic-products-with-makeup-brush-black-backdrop_23-2147899405.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "p5", name: "Foundation", price: "Rs. 2,199", imageSrc: "http://img.b2bpic.net/free-photo/red-serum-bottle-with-dropper_187299-47321.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "p6", name: "Face Wash", price: "Rs. 899", imageSrc: "http://img.b2bpic.net/free-photo/top-view-blush-with-make-up-brush_23-2148210796.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{ id: "p1", name: "Hydrating Serum", price: "Rs. 2,499", imageSrc: "http://img.b2bpic.net/free-photo/front-view-assortment-skin-care-cream_23-2148761485.jpg" },
|
||||
{ id: "p2", name: "Matte Finish Lipstick", price: "Rs. 999", imageSrc: "http://img.b2bpic.net/free-photo/foundation-container-beauty-blender_23-2149705493.jpg" },
|
||||
{ id: "p3", name: "Gentle Cleanser", price: "Rs. 899", imageSrc: "http://img.b2bpic.net/free-photo/top-view-blush-with-make-up-brush_23-2148210796.jpg" },
|
||||
{ id: "p4", name: "Radiance Oil", price: "Rs. 1,299", imageSrc: "http://img.b2bpic.net/free-photo/red-serum-bottle-with-dropper_187299-47321.jpg" }
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "View Deal", href: "https://daraz.pk" }
|
||||
]}
|
||||
title="Trending Beauty Essentials"
|
||||
description="Top-rated skincare and makeup picks available on Daraz."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNineteen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
tag: "Beauty", title: "Skincare & Makeup", subtitle: "Premium Glow", description: "High-quality products for your skin.", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-foundation-bottle-plant_23-2149030339.jpg"},
|
||||
{
|
||||
tag: "Hair", title: "Hair Care", subtitle: "Silky Shine", description: "Best solutions for hair health.", imageSrc: "http://img.b2bpic.net/free-photo/serum-bottle-green-leaf-assortment_23-2149353093.jpg"},
|
||||
{
|
||||
tag: "Kitchen", title: "Baking Tools", subtitle: "Master Baker", description: "Professional tools for every baker.", imageSrc: "http://img.b2bpic.net/free-photo/lady-is-preparing-dessert-woman-bakes-cake_1157-42195.jpg"},
|
||||
]}
|
||||
title="Shop by Categories"
|
||||
description="Explore our curated collections."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -145,32 +76,28 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
title="Kitchen Essentials"
|
||||
description="Make cooking professional and simple."
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "k1", name: "Digital Scale", price: "Rs. 1,200", imageSrc: "http://img.b2bpic.net/free-photo/cupcake-with-icing-bag-sprinkle-nozzle-wooden-desk_23-2147942574.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "k2", name: "Cake Mold Set", price: "Rs. 2,500", imageSrc: "http://img.b2bpic.net/free-photo/top-view-table-arrangement-with-empty-dishes-tableware_23-2150310719.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "k3", name: "Whisk Mixer", price: "Rs. 800", imageSrc: "http://img.b2bpic.net/free-photo/white-eggs-carton-container-bowl-whisker-marble-surface_114579-53667.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "k4", name: "Measuring Cups", price: "Rs. 600", imageSrc: "http://img.b2bpic.net/free-photo/cupcakes-near-birthday-cake-ingredients_23-2147825800.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "k5", name: "Spatula Set", price: "Rs. 750", imageSrc: "http://img.b2bpic.net/free-photo/delicious-cupcakes-arrangement-flat-lay_23-2149653252.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{
|
||||
id: "k6", name: "Kitchen Timer", price: "Rs. 500", imageSrc: "http://img.b2bpic.net/free-photo/background-cutlery-set-cutlery-white-background_93675-134810.jpg", onProductClick: () => window.open("https://daraz.pk", "_blank")
|
||||
},
|
||||
{ id: "k1", name: "Digital Scale", price: "Rs. 1,200", imageSrc: "http://img.b2bpic.net/free-photo/cupcake-with-icing-bag-sprinkle-nozzle-wooden-desk_23-2147942574.jpg" },
|
||||
{ id: "k2", name: "Whisk Set", price: "Rs. 800", imageSrc: "http://img.b2bpic.net/free-photo/white-eggs-carton-container-bowl-whisker-marble-surface_114579-53667.jpg" },
|
||||
{ id: "k3", name: "Silicone Spatulas", price: "Rs. 750", imageSrc: "http://img.b2bpic.net/free-photo/delicious-cupcakes-arrangement-flat-lay_23-2149653252.jpg" },
|
||||
{ id: "k4", name: "Smart Timer", price: "Rs. 500", imageSrc: "http://img.b2bpic.net/free-photo/background-cutlery-set-cutlery-white-background_93675-134810.jpg" }
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "View Deal", href: "https://daraz.pk" }
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNineteen
|
||||
textboxLayout="split"
|
||||
features={[
|
||||
{ tag: "Beauty", title: "Glow Routine", subtitle: "Premium skincare", description: "High-quality dermatological care.", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-foundation-bottle-plant_23-2149030339.jpg" },
|
||||
{ tag: "Kitchen", title: "Bake Master", subtitle: "Pro tools", description: "Everything you need to bake perfectly.", imageSrc: "http://img.b2bpic.net/free-photo/lady-is-preparing-dessert-woman-bakes-cake_1157-42195.jpg" }
|
||||
]}
|
||||
title="Kitchen & Baking Gadgets"
|
||||
description="Smart tools to make cooking easier."
|
||||
title="Curated Collections"
|
||||
description="Quality products sourced for you."
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -178,23 +105,14 @@ export default function LandingPage() {
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Weekly Highlights"
|
||||
description="Proven results for our community."
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "500+", title: "Deals Updated", items: [
|
||||
"Daily refreshed", "Daraz verified"],
|
||||
},
|
||||
{
|
||||
id: "m2", value: "10K+", title: "Happy Shoppers", items: [
|
||||
"Satisfied users", "Trusted affiliate"],
|
||||
},
|
||||
{
|
||||
id: "m3", value: "99%", title: "Buy Rate", items: [
|
||||
"Seamless links", "Direct to Daraz"],
|
||||
},
|
||||
{ id: "m1", value: "500+", title: "Deals Updated", items: ["Daily refreshed", "Verified"] },
|
||||
{ id: "m2", value: "10K+", title: "Happy Shoppers", items: ["Trusted affiliate"] },
|
||||
{ id: "m3", value: "99%", title: "Buy Rate", items: ["Direct links"] }
|
||||
]}
|
||||
title="Trending Weekly Deals"
|
||||
description="See what's hot right now."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -202,16 +120,12 @@ export default function LandingPage() {
|
||||
<BlogCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
title="Expert Guides"
|
||||
description="Read our latest tips."
|
||||
useInvertedBackground={false}
|
||||
title="Review & Guides"
|
||||
description="Expert tips for Pakistani shoppers."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1", category: "Skincare", title: "Top 10 skincare products in Pakistan", excerpt: "Complete guide to local and international brands.", imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-jar_187299-45799.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/smiling-young-brunette-caucasian-girl-looks-points-camera-isolated-olive-green-background-with-copy-space_141793-67059.jpg", date: "Oct 24, 2024"},
|
||||
{
|
||||
id: "b2", category: "Baking", title: "Essential Baking Tools for Beginners", excerpt: "What you need in your kitchen.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-using-whisk_23-2149599587.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-joyful-woman-holding-mobile-phone_171337-4024.jpg", date: "Oct 23, 2024"},
|
||||
{
|
||||
id: "b3", category: "Makeup", title: "Best Foundation for Humidity", excerpt: "Stay glowing in Pakistani weather.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-orange-oil-spa-treatment-arrangement-cosmetics_23-2148645492.jpg", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-smiling_23-2148577162.jpg", date: "Oct 22, 2024"},
|
||||
{ id: "b1", category: "Beauty", title: "Top Skincare for Humidity", excerpt: "Stay fresh all day.", imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-jar_187299-45799.jpg", authorName: "Admin", authorAvatar: "", date: "Oct 2024" },
|
||||
{ id: "b2", category: "Kitchen", title: "Baking 101", excerpt: "Easy starters.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-using-whisk_23-2149599587.jpg", authorName: "Admin", authorAvatar: "", date: "Oct 2024" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -220,48 +134,31 @@ export default function LandingPage() {
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Community Love"
|
||||
description="What our shoppers say."
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Ayesha K", role: "Fan", testimonial: "Great service!", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-beautiful-ginger-girl-shows-thumbs-up-smiles-white-teeth-approve-agree-say-yes-recommend-clinic-company-satisfied-with-quality-service-white-background_176420-45534.jpg"},
|
||||
{
|
||||
id: "t2", name: "Bilal S", role: "User", testimonial: "Very convenient.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-woman-holding-smartphone-while-sitting-by-bags-outside-shopping-mall_662251-1498.jpg"},
|
||||
{
|
||||
id: "t3", name: "Sara H", role: "Fan", testimonial: "Loved the deals.", imageSrc: "http://img.b2bpic.net/free-photo/young-blond-girl-smiling-while-texting_1301-2891.jpg"},
|
||||
{
|
||||
id: "t4", name: "Ahmed Z", role: "User", testimonial: "Fastest links.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-smartphone_23-2149461681.jpg"},
|
||||
{
|
||||
id: "t5", name: "Maria M", role: "Fan", testimonial: "So helpful!", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-ordering-items-sale-using-tablet-credit-card_23-2148695603.jpg"},
|
||||
{ id: "t1", name: "Ayesha K.", role: "User", testimonial: "Best deals in Pakistan!", imageSrc: "" },
|
||||
{ id: "t2", name: "Bilal S.", role: "User", testimonial: "So convenient.", imageSrc: "" }
|
||||
]}
|
||||
title="Customer Reviews"
|
||||
description="Trusted by thousands of Pakistani online shoppers."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
text="Get daily deal alerts on WhatsApp!"
|
||||
buttons={[{ text: "Join Community", href: "#" }]}
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient"}}
|
||||
text="Join our WhatsApp community for daily alerts!"
|
||||
buttons={[
|
||||
{
|
||||
text: "Join WhatsApp Now", href: "https://wa.me/yournumber"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="TrendPK"
|
||||
copyrightText="© 2025 TrendPK - All Deals Verified."
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "#", ariaLabel: "Instagram"},
|
||||
{
|
||||
icon: Facebook,
|
||||
href: "#", ariaLabel: "Facebook"},
|
||||
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
|
||||
{ icon: Facebook, href: "#", ariaLabel: "Facebook" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #ffffff;
|
||||
--card: #fef7f7;
|
||||
--foreground: #1a0008;
|
||||
--primary-cta: #ff6a00;
|
||||
--background: #fbfbfb;
|
||||
--card: #ffffff;
|
||||
--foreground: #1a1a1a;
|
||||
--primary-cta: #15479c;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta: #efefef;
|
||||
--secondary-cta-text: #1a0008;
|
||||
--accent: #ffb6c1;
|
||||
--background-accent: #ffe0e6;
|
||||
--background-accent: #f3f3f3;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user