Files
b950fc3a-ca80-4e50-b631-e92…/src/app/page.tsx
2026-03-07 14:33:51 +00:00

398 lines
20 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import MetricCardTen from '@/components/sections/metrics/MetricCardTen';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Sparkles, Star, ShoppingBag, Flower2, Droplet, Gift, HeartHandshake, Zap, CheckCircle, Heart, Award, Shield, Phone, MessageCircle, Mail, CircleDollarSign, ArrowLeftRight, Send, House, MessageSquareText, Settings } from 'lucide-react';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="small"
sizing="mediumLargeSizeLargeTitles"
background="circleGradient"
cardStyle="soft-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="light"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Best Sellers", id: "bestsellers" },
{ name: "Categories", id: "categories" },
{ name: "Gift Sets", id: "gifts" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Call Now", href: "tel:+919316934345" }}
brandName="ROYAL INE"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardDashboard
title="Luxury Attars & Perfumes at Affordable Prices"
description="Discover long-lasting fragrances crafted with premium oils for men and women. Experience the essence of luxury with ROYAL INE."
tag="Premium Fragrances"
tagIcon={Sparkles}
buttons={[
{ text: "Shop Best Sellers", href: "#bestsellers" },
{ text: "Call Now", href: "tel:+919316934345" }
]}
background={{ variant: "radial-gradient" }}
dashboard={{
title: "Why Choose ROYAL INE", logoIcon: Flower2,
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-essential-oil-bottle_23-2148241812.jpg", imageAlt: "luxury perfume bottle elegant display", sidebarItems: [
{ icon: Shield, active: true },
{ icon: Heart },
{ icon: Award }
],
buttons: [
{ text: "WhatsApp", href: "https://wa.me/919316934345" },
{ text: "Directions", href: "https://maps.google.com/?q=Plot+No.+1,2,+Shree+Hari+Industrial+Estate,+Prakash+Cinema+Gali,+Pipodara,+Surat" }
],
stats: [
{ title: "Quality Promise", values: [100, 100, 100], valuePrefix: "", valueSuffix: "%", description: "Authentic products" },
{ title: "Customer Love", values: [5, 5, 5], valuePrefix: "", valueSuffix: "★", description: "Average rating" },
{ title: "Fast Service", values: [24, 24, 24], valuePrefix: "", valueSuffix: "h", description: "Response time" }
],
chartTitle: "Customer Satisfaction", chartData: [
{ value: 95 },
{ value: 98 },
{ value: 92 },
{ value: 97 },
{ value: 94 }
],
listTitle: "How to Order", listItems: [
{ icon: Phone, title: "Call +91 9316934345", status: "Quick" },
{ icon: MessageCircle, title: "WhatsApp Us", status: "Fast" },
{ icon: Mail, title: "Fill Order Form", status: "Detailed" }
],
searchPlaceholder: "Search fragrances..."
}}
/>
</div>
<div id="bestsellers" data-section="bestsellers">
<ProductCardThree
title="Best Selling Perfumes & Attars"
description="Discover our most loved fragrances loved by thousands of customers across India"
tag="Top Picks"
tagIcon={Star}
products={[
{
id: "1", name: "CEO Man Perfume 100ml", price: "₹699", imageSrc: "http://img.b2bpic.net/free-photo/top-view-blue-ribbon-man-perfume-gift-box-engagement-band-right-side-dark-table_140725-141972.jpg", imageAlt: "CEO Man Perfume 100ml", isFavorited: false,
initialQuantity: 1
},
{
id: "2", name: "White Oud Unisex Perfume 100ml", price: "₹799", imageSrc: "http://img.b2bpic.net/free-photo/elegant-vegan-alcohol-arrangement_23-2149337702.jpg", imageAlt: "White Oud Unisex Perfume", isFavorited: false,
initialQuantity: 1
},
{
id: "3", name: "OUD Gold Unisex Perfume 100ml", price: "₹849", imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-product-container-with-art-nouveau-inspired-sun-relief-background_23-2151420651.jpg", imageAlt: "OUD Gold Unisex Perfume", isFavorited: false,
initialQuantity: 1
},
{
id: "4", name: "Luxury Perfume Gift Set for Men", price: "₹1,499", imageSrc: "http://img.b2bpic.net/free-photo/fathers-day-composition-with-present-boxes_23-2147806757.jpg", imageAlt: "Luxury Gift Set for Men", isFavorited: false,
initialQuantity: 1
},
{
id: "5", name: "Luxury Perfume Gift Set for Women", price: "₹1,499", imageSrc: "http://img.b2bpic.net/free-vector/flowers-brochures-template_23-2147510133.jpg", imageAlt: "Luxury Gift Set for Women", isFavorited: false,
initialQuantity: 1
}
]}
gridVariant="asymmetric-60-wide-40-narrow"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{ text: "View All Products", href: "#contact" }
]}
/>
</div>
<div id="categories" data-section="categories">
<FeatureCardTwentyFive
title="Product Categories"
description="Explore our complete range of premium fragrances and personal care products"
tag="Shop"
tagIcon={ShoppingBag}
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Perfumes", description: "Long-lasting fragrances for every occasion and personality", icon: Flower2,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/elegant-vegan-alcohol-arrangement_23-2149337695.jpg?_wi=1", imageAlt: "Premium Perfume Collection"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/liquid-ornate-bottles_140725-1903.jpg?_wi=1", imageAlt: "Attar Collection"
}
]
},
{
title: "Attars", description: "Traditional oil-based fragrances with authentic oriental essence", icon: Droplet,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/liquid-ornate-bottles_140725-1903.jpg?_wi=2", imageAlt: "Premium Attar Collection"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/elegant-vegan-alcohol-arrangement_23-2149337695.jpg?_wi=2", imageAlt: "Fragrance Selection"
}
]
},
{
title: "Gift Sets", description: "Perfectly curated gift boxes for every celebration and season", icon: Gift,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/top-view-christmas-gifts-marble-background_23-2148343296.jpg", imageAlt: "Luxury Gift Sets"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-gift-boxes-with-design-paper-scissor-paper-bag_23-2148102854.jpg", imageAlt: "Premium Gift Packaging"
}
]
},
{
title: "Beauty & Care", description: "Cosmetics and skincare products for complete personal care", icon: Sparkles,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/make-up-concept-with-lipsticks-arrangement_23-2149030343.jpg", imageAlt: "Beauty Cosmetics Collection"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/flay-lay-assortment-with-spa-products_23-2148268502.jpg?_wi=1", imageAlt: "Premium Skincare Products"
}
]
},
{
title: "Bath & Body", description: "Luxurious body care products for a complete pampering experience", icon: Zap,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/handmade-soap-almond-marble-background_1150-45187.jpg", imageAlt: "Bath and Body Products"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/flay-lay-assortment-with-spa-products_23-2148268502.jpg?_wi=2", imageAlt: "Body Care Collection"
}
]
},
{
title: "Fragrance Notes", description: "Choose by scent profile: Rose, Citrus, Floral, Aquatic, Musk & more", icon: HeartHandshake,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/elegant-vegan-alcohol-arrangement_23-2149337695.jpg?_wi=3", imageAlt: "Fragrance Notes Selection"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/liquid-ornate-bottles_140725-1903.jpg?_wi=3", imageAlt: "Scent Profile Options"
}
]
}
]}
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "Why Choose" },
{ type: "text", content: "ROYAL INE" }
]}
useInvertedBackground={false}
buttons={[
{ text: "Request Bulk Order", href: "#contact" },
{ text: "Contact Us", href: "tel:+919316934345" }
]}
/>
</div>
<div id="benefits" data-section="benefits">
<MetricCardTen
title="Our Commitment"
description="What sets ROYAL INE apart in the fragrance industry"
tag="Premium Quality"
tagIcon={CheckCircle}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "1", title: "Cruelty-Free Products", subtitle: "Ethical and sustainable fragrance sourcing", category: "Ethical", value: "100%", buttons: [
{ text: "Learn More", href: "#contact" }
]
},
{
id: "2", title: "Imported Fragrance Oils", subtitle: "Premium ingredients from trusted suppliers worldwide", category: "Premium", value: "Best", buttons: [
{ text: "Details", href: "#contact" }
]
},
{
id: "3", title: "Affordable Luxury", subtitle: "Premium quality at competitive prices for everyone", category: "Value", value: "₹699+", buttons: [
{ text: "Shop Now", href: "#bestsellers" }
]
},
{
id: "4", title: "Unisex Collection", subtitle: "Fragrances for all, breaking traditional boundaries", category: "Inclusive", value: "For All", buttons: [
{ text: "Explore", href: "#categories" }
]
},
{
id: "5", title: "Long-Lasting Formula", subtitle: "Enjoy fragrance that lasts throughout the day", category: "Performance", value: "12-24h", buttons: [
{ text: "View Reviews", href: "#testimonials" }
]
},
{
id: "6", title: "Fast Delivery", subtitle: "Quick shipping across India with reliable service", category: "Service", value: "24-48h", buttons: [
{ text: "Order Now", href: "tel:+919316934345" }
]
}
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
title="What Our Customers Say"
description="Real reviews from satisfied customers across India who love ROYAL INE fragrances"
tag="Reviews"
tagIcon={Star}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Priya Sharma", role: "Homemaker", company: "Mumbai, Maharashtra", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-i-letter_1149-1837.jpg", imageAlt: "happy customer woman smiling portrait"
},
{
id: "2", name: "Rajesh Kumar", role: "Professional", company: "Bangalore, Karnataka", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pleased-satisfied-excited-funny-european-male-with-bristle-glasses-green-casual-t-shirt-showing-thumbs-up-smiling-joyfully-approving-good-idea_176420-23406.jpg", imageAlt: "happy customer man smiling portrait"
},
{
id: "3", name: "Anjali Desai", role: "Business Owner", company: "Pune, Maharashtra", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-joyful-girl-having-fun-living-room_1262-18501.jpg", imageAlt: "customer woman happy professional portrait"
},
{
id: "4", name: "Vikram Singh", role: "Software Engineer", company: "Delhi, NCR", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-mature-businessman-showing-thumb-up_1262-3024.jpg", imageAlt: "customer man happy professional portrait"
}
]}
kpiItems={[
{ value: "500+", label: "Happy Customers" },
{ value: "4.9★", label: "Average Rating" },
{ value: "100%", label: "Authentic Products" }
]}
/>
</div>
<div id="gifts" data-section="gifts">
<PricingCardThree
title="Gift Sets & Bulk Orders"
description="Perfect for weddings, corporate gifting, and special occasions"
tag="Special Offers"
tagIcon={Gift}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "1", price: "₹1,499", name: "Individual Gift Set", badge: "Perfect for Personal", badgeIcon: Heart,
buttons: [
{ text: "Order Now", href: "tel:+919316934345" },
{ text: "WhatsApp", href: "https://wa.me/919316934345" }
],
features: [
"2-3 Premium Perfumes", "Luxury Packaging", "Greeting Card Included", "Express Delivery Available"
]
},
{
id: "2", price: "Custom Pricing", name: "Wedding Gift Package", badge: "Most Popular", badgeIcon: Sparkles,
buttons: [
{ text: "Request Quote", href: "#contact" },
{ text: "Chat Sales", href: "https://wa.me/919316934345" }
],
features: [
"Bulk Order Discount", "Customizable Packaging", "Branded Boxes", "Dedicated Support", "Wholesale Pricing"
]
},
{
id: "3", price: "Wholesale Rate", name: "Corporate Bulk Orders", badge: "Best for Business", badgeIcon: Award,
buttons: [
{ text: "Contact Sales", href: "tel:+919316934345" },
{ text: "Fill Form", href: "#contact" }
],
features: [
"Volume Discounts", "Custom Branding", "Flexible Quantities", "Business Account", "Priority Shipping"
]
}
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to experience luxury fragrances? Connect with ROYAL INE today for exclusive offers, bulk orders, and personalized fragrance consultations."
animationType="entrance-slide"
buttons={[
{ text: "Call +91 9316934345", href: "tel:+919316934345" },
{ text: "WhatsApp Us", href: "https://wa.me/919316934345" }
]}
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Shop", items: [
{ label: "Best Sellers", href: "#bestsellers" },
{ label: "Perfumes", href: "#categories" },
{ label: "Attars", href: "#categories" },
{ label: "Gift Sets", href: "#gifts" }
]
},
{
title: "Company", items: [
{ label: "About ROYAL INE", href: "#about" },
{ label: "Why Us", href: "#benefits" },
{ label: "Bulk Orders", href: "#gifts" },
{ label: "Testimonials", href: "#testimonials" }
]
},
{
title: "Contact", items: [
{ label: "Call: +91 9316934345", href: "tel:+919316934345" },
{ label: "WhatsApp", href: "https://wa.me/919316934345" },
{ label: "Location: Surat, Gujarat", href: "https://maps.google.com/?q=Plot+No.+1,2,+Shree+Hari+Industrial+Estate,+Prakash+Cinema+Gali,+Pipodara,+Surat" },
{ label: "Hours: 10 AM - 7 PM", href: "#" }
]
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms & Conditions", href: "#" },
{ label: "Return Policy", href: "#" },
{ label: "Shipping Policy", href: "#" }
]
}
]}
bottomLeftText="© 2025 ROYAL INE Perfumes & Attars. All rights reserved."
bottomRightText="Luxury Fragrances from Surat, India"
/>
</div>
</ThemeProvider>
);
}