bender/a4ffc574-cb2b-42c7-8052-b45cacfd0633
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #4

Merged
bender merged 5 commits from version_2 into main 2026-03-20 23:22:15 +00:00
Conversation 0 Commits 5 Files Changed 5 +636 -159
5 changed files with 636 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,187 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Sparkles, Zap, Award, Star, TrendingUp, Users, Globe, CheckCircle } from "lucide-react";
export default function AboutPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "How It Works", id: "how-it-works" },
{ name: "Services", id: "services" },
{ name: "Contact", id: "/contact" },
{ name: "Login", id: "login" },
];
const footerColumns = [
{
title: "Product", items: [
{ label: "Request Product", href: "/request-product" },
{ label: "My Quotes", href: "/my-quotes" },
{ label: "Track Order", href: "/track-order" },
{ label: "Pricing", href: "#pricing" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#blog" },
{ label: "Careers", href: "#careers" },
{ label: "Contact", href: "/contact" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#help" },
{ label: "Status", href: "#status" },
{ label: "FAQ", href: "#faq" },
{ label: "Email Us", href: "mailto:support@chestnut.com" },
],
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#privacy" },
{ label: "Terms of Service", href: "#terms" },
{ label: "Shipping Policy", href: "#shipping" },
{ label: "Refund Policy", href: "#refund" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="smallMedium"
sizing="mediumLarge"
background="circleGradient"
cardStyle="gradient-bordered"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav" className="sticky top-0 z-50">
<NavbarStyleApple brandName="Chestnut" navItems={navItems} />
</div>
<div id="about" data-section="about">
<SplitAbout
title="About Chestnut"
description="Founded on the belief that global commerce should be simple, transparent, and accessible to businesses of all sizes. Chestnut is revolutionizing how companies source products worldwide."
tag="Our Story"
tagIcon={Sparkles}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
mediaAnimation="slide-up"
imagePosition="right"
imageSrc="http://img.b2bpic.net/free-photo/two-workers-showing-quality-control-inspector-industrial-machine-they-are-using-distribution-warehouse_637285-4188.jpg?_wi=1"
imageAlt="Chestnut team in warehouse"
bulletPoints={[
{
title: "Founded in 2020", description: "Born from frustration with inefficient supply chains, Chestnut was created to simplify global product sourcing.", icon: Zap,
},
{
title: "5000+ Happy Customers", description: "From e-commerce startups to enterprise corporations, businesses worldwide trust Chestnut daily.", icon: Users,
},
{
title: "150+ Countries Served", description: "Our global network of verified suppliers and logistics partners spans six continents.", icon: Globe,
},
{
title: "$500M+ in GMV", description: "We've facilitated over half a billion dollars in verified transactions since launch.", icon: TrendingUp,
},
]}
/>
</div>
<div id="mission" data-section="mission">
<FeatureCardNineteen
title="Our Mission & Values"
description="Everything we do at Chestnut is guided by three core principles."
tag="Core Values"
tagIcon={Award}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: 1,
tag: "Transparency", title: "Complete Visibility", subtitle: "No hidden costs or surprises", description: "Every quote, every fee, every step is explained upfront. We believe in building trust through radical transparency in all our business dealings.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-businessman-working-laptop_23-2149291398.jpg?_wi=1", imageAlt: "Transparent business communication", buttons: [],
},
{
id: 2,
tag: "Quality", title: "Uncompromising Standards", subtitle: "Excellence in every product", description: "Our 100% quality guarantee means every product is inspected before shipment. Customer satisfaction is non-negotiable, backed by our money-back guarantee.", imageSrc: "http://img.b2bpic.net/free-photo/quality-control-concept-icons_23-2148566296.jpg?_wi=1", imageAlt: "Quality assurance process", buttons: [],
},
{
id: 3,
tag: "Speed", title: "Lightning-Fast Delivery", subtitle: "From quote to doorstep", description: "Time is money in business. Our streamlined processes mean most quotes in 2-5 days and rapid shipping with real-time tracking worldwide.", imageSrc: "http://img.b2bpic.net/free-photo/drone-parcel-delivery_53876-14867.jpg?_wi=1", imageAlt: "Fast delivery and logistics", buttons: [],
},
]}
/>
</div>
<div id="why-chestnut" data-section="why-chestnut">
<FeatureCardNineteen
title="Why Choose Chestnut?"
description="What sets us apart from other sourcing platforms."
tag="Our Advantage"
tagIcon={CheckCircle}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: 1,
tag: "Verified Network", title: "Trusted Suppliers", subtitle: "Vetted on every criteria", description: "Every supplier in our network is thoroughly vetted for reliability, quality, and ethical practices. No compromises on partner standards.", imageSrc: "http://img.b2bpic.net/free-photo/business-partners-handshake_482257-122835.jpg?_wi=1", imageAlt: "Business partnership and trust", buttons: [],
},
{
id: 2,
tag: "Technology", title: "Smart Platform", subtitle: "AI-powered matching", description: "Our AI algorithms match your requirements with optimal suppliers instantly. Smart recommendations save you time and money while ensuring quality.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-artificial-intelligence-pattern_23-2149165212.jpg?_wi=1", imageAlt: "AI technology and automation", buttons: [],
},
{
id: 3,
tag: "Support", title: "24/7 Assistance", subtitle: "Always here to help", description: "Our dedicated support team is available round-the-clock across all time zones. Problems are solved within hours, not days.", imageSrc: "http://img.b2bpic.net/free-photo/customer-support-at-desk_23-2148908000.jpg?_wi=1", imageAlt: "Customer support team", buttons: [],
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFive
title="What Our Customers Say"
description="Hear from businesses we've helped grow."
tag="Customer Stories"
tagIcon={Star}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Sarah Chen", date: "March 2024", title: "E-commerce Founder", quote: "Chestnut transformed our supply chain completely. We went from working with multiple unreliable suppliers to having one trusted partner. Our margins improved by 15% in just three months.", tag: "E-commerce", avatarSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg", avatarAlt: "Sarah Chen"},
{
id: "2", name: "Marcus Thompson", date: "February 2024", title: "Wholesale Retailer", quote: "The transparency is remarkable. I know exactly where every shipment is, what it cost, and when it will arrive. This visibility has been invaluable for managing my inventory.", tag: "Wholesale", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3269.jpg", avatarAlt: "Marcus Thompson"},
{
id: "3", name: "Elena Rodriguez", date: "January 2024", title: "Small Business Owner", quote: "As a small business, I was hesitant about going international. Chestnut made it so simple. I now source globally without the headaches, and my product range has tripled.", tag: "Small Business", avatarSrc: "http://img.b2bpic.net/free-photo/blurred-woman-choosing-multiple-photos_23-2148565531.jpg", avatarAlt: "Elena Rodriguez"},
{
id: "4", name: "David Kim", date: "December 2023", title: "Supply Chain Manager", quote: "We needed a partner who could scale with us. Chestnut has managed everything from single-unit orders to our largest 10,000-unit shipment without breaking a sweat.", tag: "Enterprise", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg", avatarAlt: "David Kim"},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="Chestnut"
copyrightText="© 2024 Chestnut. All rights reserved. Premium Sourcing & Logistics."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}

123
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,123 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Mail, Phone, MapPin, Zap } from "lucide-react";
export default function ContactPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "How It Works", id: "how-it-works" },
{ name: "Services", id: "services" },
{ name: "Contact", id: "/contact" },
{ name: "Login", id: "login" },
];
const footerColumns = [
{
title: "Product", items: [
{ label: "Request Product", href: "/request-product" },
{ label: "My Quotes", href: "/my-quotes" },
{ label: "Track Order", href: "/track-order" },
{ label: "Pricing", href: "#pricing" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#blog" },
{ label: "Careers", href: "#careers" },
{ label: "Contact", href: "/contact" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#help" },
{ label: "Status", href: "#status" },
{ label: "FAQ", href: "#faq" },
{ label: "Email Us", href: "mailto:support@chestnut.com" },
],
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#privacy" },
{ label: "Terms of Service", href: "#terms" },
{ label: "Shipping Policy", href: "#shipping" },
{ label: "Refund Policy", href: "#refund" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="smallMedium"
sizing="mediumLarge"
background="circleGradient"
cardStyle="gradient-bordered"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav" className="sticky top-0 z-50">
<NavbarStyleApple brandName="Chestnut" navItems={navItems} />
</div>
<div id="contact-form" data-section="contact-form">
<ContactCenter
tag="Get In Touch"
title="Contact Chestnut"
description="Have questions or need assistance? Our team is here to help. Reach out through any of these channels or submit the form below and we'll get back to you within 24 hours."
tagIcon={Mail}
tagAnimation="slide-up"
background={{ variant: "plain" }}
useInvertedBackground={false}
inputPlaceholder="Enter your email address"
buttonText="Send Message"
termsText="We'll respond to your inquiry within 24 business hours. Your information is secure and confidential."
/>
</div>
<div id="contact-methods" data-section="contact-methods">
<FeatureCardNineteen
title="Other Ways to Reach Us"
description="Multiple channels for your convenience. Choose what works best for you."
tag="Support Channels"
tagIcon={Zap}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: 1,
tag: "Email", title: "Email Support", subtitle: "support@chestnut.com", description: "Send us detailed information about your inquiry. Our support team responds within 24 hours with comprehensive assistance and solutions for any questions.", imageSrc: "http://img.b2bpic.net/free-photo/email-communication-concept_23-2148566295.jpg?_wi=1", imageAlt: "Email communication", buttons: [],
},
{
id: 2,
tag: "Phone", title: "Phone Support", subtitle: "+1 (555) 123-4567", description: "Speak directly with our support specialists. Available Monday to Friday, 9 AM - 6 PM EST. For urgent matters, we also offer priority hotline support for enterprise customers.", imageSrc: "http://img.b2bpic.net/free-photo/business-call-support_23-2148566291.jpg?_wi=1", imageAlt: "Phone support", buttons: [],
},
{
id: 3,
tag: "Office", title: "Visit Our Office", subtitle: "123 Commerce Street, San Francisco, CA 94103", description: "Schedule a meeting with our team to discuss large-scale sourcing projects. We're located in downtown San Francisco with easy public transit access and ample parking available.", imageSrc: "http://img.b2bpic.net/free-photo/business-office-environment_23-2148566289.jpg?_wi=1", imageAlt: "Office location", buttons: [],
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="Chestnut"
copyrightText="© 2024 Chestnut. All rights reserved. Premium Sourcing & Logistics."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}

189
src/app/page.tsx
View File

@@ -23,8 +23,7 @@ export default function HomePage() {
const footerColumns = [
{
title: "Product",
items: [
title: "Product", items: [
{ label: "Request Product", href: "/request-product" },
{ label: "My Quotes", href: "/my-quotes" },
{ label: "Track Order", href: "/track-order" },
@@ -32,8 +31,7 @@ export default function HomePage() {
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#about" },
{ label: "Blog", href: "#blog" },
{ label: "Careers", href: "#careers" },
@@ -41,8 +39,7 @@ export default function HomePage() {
],
},
{
title: "Support",
items: [
title: "Support", items: [
{ label: "Help Center", href: "#help" },
{ label: "Status", href: "#status" },
{ label: "FAQ", href: "#faq" },
@@ -50,8 +47,7 @@ export default function HomePage() {
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#privacy" },
{ label: "Terms of Service", href: "#terms" },
{ label: "Shipping Policy", href: "#shipping" },
@@ -73,11 +69,11 @@ export default function HomePage() {
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<div id="nav" data-section="nav" className="transition-all duration-500 ease-out">
<NavbarStyleApple brandName="Chestnut" navItems={navItems} />
</div>
<div id="hero" data-section="hero">
<div id="hero" data-section="hero" className="transition-all duration-700 ease-out">
<HeroSplitTestimonial
title="Anything You Need. Delivered."
description="We source, supply, and ship any product — fast, reliable, and hassle-free. Whether you're a reseller, retailer, or business buyer, Chestnut handles procurement, quality assurance, and logistics so you can focus on growth."
@@ -87,40 +83,21 @@ export default function HomePage() {
tagAnimation="slide-up"
buttons={[
{
text: "Request a Product",
href: "/request-product",
},
text: "Request a Product", href: "/request-product"},
{
text: "Get a Quote",
href: "/my-quotes",
},
text: "Get a Quote", href: "/my-quotes"},
]}
buttonAnimation="slide-up"
testimonials={[
{
name: "Sarah Chen",
handle: "@sarahreseller",
testimonial: "Chestnut streamlined my entire supply chain. What used to take weeks now happens in days.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg?_wi=1",
imageAlt: "Sarah Chen",
},
name: "Sarah Chen", handle: "@sarahreseller", testimonial: "Chestnut streamlined my entire supply chain. What used to take weeks now happens in days.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg?_wi=1", imageAlt: "Sarah Chen"},
{
name: "Marcus Thompson",
handle: "@marcusbiz",
testimonial: "The quality control and tracking transparency is unmatched. They're transparent about every step.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3269.jpg?_wi=1",
imageAlt: "Marcus Thompson",
},
name: "Marcus Thompson", handle: "@marcusbiz", testimonial: "The quality control and tracking transparency is unmatched. They're transparent about every step.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3269.jpg?_wi=1", imageAlt: "Marcus Thompson"},
{
name: "Elena Rodriguez",
handle: "@elenaretail",
testimonial: "Best investment for my e-commerce business. Pricing is competitive and reliability is guaranteed.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/blurred-woman-choosing-multiple-photos_23-2148565531.jpg?_wi=1",
imageAlt: "Elena Rodriguez",
},
name: "Elena Rodriguez", handle: "@elenaretail", testimonial: "Best investment for my e-commerce business. Pricing is competitive and reliability is guaranteed.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/blurred-woman-choosing-multiple-photos_23-2148565531.jpg?_wi=1", imageAlt: "Elena Rodriguez"},
]}
testimonialRotationInterval={5000}
useInvertedBackground={false}
@@ -132,7 +109,7 @@ export default function HomePage() {
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<div id="how-it-works" data-section="how-it-works" className="transition-all duration-700 ease-out">
<FeatureCardNineteen
title="How It Works"
description="Four simple steps to source and deliver any product to your doorstep."
@@ -144,49 +121,25 @@ export default function HomePage() {
features={[
{
id: 1,
tag: "Step 1",
title: "Request a Product",
subtitle: "Tell us what you need",
description: "Describe the product you're looking for with specifications, quantity, and budget. Our team starts sourcing immediately.",
imageSrc: "http://img.b2bpic.net/free-photo/subscribe-newsletter-advertising-register-member-concept_53876-125132.jpg?_wi=1",
imageAlt: "Product request form interface",
buttons: [],
tag: "Step 1", title: "Request a Product", subtitle: "Tell us what you need", description: "Describe the product you're looking for with specifications, quantity, and budget. Our team starts sourcing immediately.", imageSrc: "http://img.b2bpic.net/free-photo/subscribe-newsletter-advertising-register-member-concept_53876-125132.jpg?_wi=1", imageAlt: "Product request form interface", buttons: [],
},
{
id: 2,
tag: "Step 2",
title: "Receive a Quote",
subtitle: "Get transparent pricing",
description: "We research suppliers, verify quality, and provide a detailed quote with all costs included. No hidden fees.",
imageSrc: "http://img.b2bpic.net/free-vector/gradient-business-invoice-sheet_23-2149093045.jpg?_wi=1",
imageAlt: "Pricing quote generation system",
buttons: [],
tag: "Step 2", title: "Receive a Quote", subtitle: "Get transparent pricing", description: "We research suppliers, verify quality, and provide a detailed quote with all costs included. No hidden fees.", imageSrc: "http://img.b2bpic.net/free-vector/gradient-business-invoice-sheet_23-2149093045.jpg?_wi=1", imageAlt: "Pricing quote generation system", buttons: [],
},
{
id: 3,
tag: "Step 3",
title: "Secure Payment",
subtitle: "Pay with confidence",
description: "Pay securely through credit card or PayPal. Your payment is protected until delivery. Money-back guarantee if unsatisfied.",
imageSrc: "http://img.b2bpic.net/free-photo/contactless-cashless-payment-through-qr-code-mobile-banking_53876-101160.jpg?_wi=1",
imageAlt: "Secure payment processing system",
buttons: [],
tag: "Step 3", title: "Secure Payment", subtitle: "Pay with confidence", description: "Pay securely through credit card or PayPal. Your payment is protected until delivery. Money-back guarantee if unsatisfied.", imageSrc: "http://img.b2bpic.net/free-photo/contactless-cashless-payment-through-qr-code-mobile-banking_53876-101160.jpg?_wi=1", imageAlt: "Secure payment processing system", buttons: [],
},
{
id: 4,
tag: "Step 4",
title: "Track Your Order",
subtitle: "Monitor every step",
description: "Real-time tracking from warehouse to your door. Receive notifications at each milestone. Complete visibility and control.",
imageSrc: "http://img.b2bpic.net/free-vector/running-mobile-app-infographic-flat-design_52683-16497.jpg?_wi=1",
imageAlt: "Real-time order tracking dashboard",
buttons: [],
tag: "Step 4", title: "Track Your Order", subtitle: "Monitor every step", description: "Real-time tracking from warehouse to your door. Receive notifications at each milestone. Complete visibility and control.", imageSrc: "http://img.b2bpic.net/free-vector/running-mobile-app-infographic-flat-design_52683-16497.jpg?_wi=1", imageAlt: "Real-time order tracking dashboard", buttons: [],
},
]}
/>
</div>
<div id="services" data-section="services">
<div id="services" data-section="services" className="transition-all duration-700 ease-out">
<ProductCardFour
title="Our Services"
description="Complete sourcing and logistics solutions for your business."
@@ -199,35 +152,17 @@ export default function HomePage() {
animationType="slide-up"
products={[
{
id: "sourcing",
name: "Global Product Sourcing",
price: "Starting at $0",
variant: "Free consultation",
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-team-engineers-using-laptop-server-farm-analyzing-data_482257-123246.jpg?_wi=1",
imageAlt: "Global product sourcing and procurement",
onFavorite: undefined,
id: "sourcing", name: "Global Product Sourcing", price: "Starting at $0", variant: "Free consultation", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-team-engineers-using-laptop-server-farm-analyzing-data_482257-123246.jpg?_wi=1", imageAlt: "Global product sourcing and procurement", onFavorite: undefined,
onProductClick: undefined,
isFavorited: false,
},
{
id: "quality",
name: "Quality Assurance & Inspection",
price: "Per unit inspection",
variant: "Verified suppliers",
imageSrc: "http://img.b2bpic.net/free-photo/multiethnic-women-leaders-business-meeting-brainstorming-marketing-strategies_482257-123626.jpg?_wi=1",
imageAlt: "Quality control and inspection process",
onFavorite: undefined,
id: "quality", name: "Quality Assurance & Inspection", price: "Per unit inspection", variant: "Verified suppliers", imageSrc: "http://img.b2bpic.net/free-photo/multiethnic-women-leaders-business-meeting-brainstorming-marketing-strategies_482257-123626.jpg?_wi=1", imageAlt: "Quality control and inspection process", onFavorite: undefined,
onProductClick: undefined,
isFavorited: false,
},
{
id: "logistics",
name: "International Shipping & Logistics",
price: "Competitive rates",
variant: "Door-to-door delivery",
imageSrc: "http://img.b2bpic.net/free-psd/realistic-blue-cargo-ship-with-containers-global-logistics-trade_84443-69357.jpg?_wi=1",
imageAlt: "International shipping and logistics routes",
onFavorite: undefined,
id: "logistics", name: "International Shipping & Logistics", price: "Competitive rates", variant: "Door-to-door delivery", imageSrc: "http://img.b2bpic.net/free-psd/realistic-blue-cargo-ship-with-containers-global-logistics-trade_84443-69357.jpg?_wi=1", imageAlt: "International shipping and logistics routes", onFavorite: undefined,
onProductClick: undefined,
isFavorited: false,
},
@@ -235,7 +170,7 @@ export default function HomePage() {
/>
</div>
<div id="testimonials" data-section="testimonials">
<div id="testimonials" data-section="testimonials" className="transition-all duration-700 ease-out">
<TestimonialCardFive
title="What Our Customers Say"
description="Join hundreds of businesses trusting Chestnut for their supply chain needs."
@@ -246,50 +181,18 @@ export default function HomePage() {
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Sarah Chen",
date: "March 2024",
title: "E-commerce Founder",
quote: "Chestnut completely transformed how I source products. The process is transparent, reliable, and incredibly fast. I went from 3-week lead times to 5 days. Highly recommend!",
tag: "E-commerce",
avatarSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg",
avatarAlt: "Sarah Chen",
},
id: "1", name: "Sarah Chen", date: "March 2024", title: "E-commerce Founder", quote: "Chestnut completely transformed how I source products. The process is transparent, reliable, and incredibly fast. I went from 3-week lead times to 5 days. Highly recommend!", tag: "E-commerce", avatarSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg", avatarAlt: "Sarah Chen"},
{
id: "2",
name: "Marcus Thompson",
date: "February 2024",
title: "Wholesale Retailer",
quote: "The tracking system gives me complete visibility. I always know exactly where my shipments are and when they'll arrive. Customer service is top-notch.",
tag: "Wholesale",
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3269.jpg",
avatarAlt: "Marcus Thompson",
},
id: "2", name: "Marcus Thompson", date: "February 2024", title: "Wholesale Retailer", quote: "The tracking system gives me complete visibility. I always know exactly where my shipments are and when they'll arrive. Customer service is top-notch.", tag: "Wholesale", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3269.jpg", avatarAlt: "Marcus Thompson"},
{
id: "3",
name: "Elena Rodriguez",
date: "January 2024",
title: "Small Business Owner",
quote: "Finally, a sourcing partner I can trust. The quality is consistently excellent, and the pricing is fair. They handle all the complications so I can focus on selling.",
tag: "Small Business",
avatarSrc: "http://img.b2bpic.net/free-photo/blurred-woman-choosing-multiple-photos_23-2148565531.jpg",
avatarAlt: "Elena Rodriguez",
},
id: "3", name: "Elena Rodriguez", date: "January 2024", title: "Small Business Owner", quote: "Finally, a sourcing partner I can trust. The quality is consistently excellent, and the pricing is fair. They handle all the complications so I can focus on selling.", tag: "Small Business", avatarSrc: "http://img.b2bpic.net/free-photo/blurred-woman-choosing-multiple-photos_23-2148565531.jpg", avatarAlt: "Elena Rodriguez"},
{
id: "4",
name: "David Kim",
date: "December 2023",
title: "Supply Chain Manager",
quote: "Integration with our existing systems was seamless. The API documentation is excellent. Chestnut is our go-to for any product sourcing needs.",
tag: "Enterprise",
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg",
avatarAlt: "David Kim",
},
id: "4", name: "David Kim", date: "December 2023", title: "Supply Chain Manager", quote: "Integration with our existing systems was seamless. The API documentation is excellent. Chestnut is our go-to for any product sourcing needs.", tag: "Enterprise", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg", avatarAlt: "David Kim"},
]}
/>
</div>
<div id="faq" data-section="faq">
<div id="faq" data-section="faq" className="transition-all duration-700 ease-out">
<FaqBase
title="Frequently Asked Questions"
description="Everything you need to know about Chestnut's sourcing and delivery services."
@@ -303,40 +206,22 @@ export default function HomePage() {
showCard={true}
faqs={[
{
id: "1",
title: "How long does the sourcing process take?",
content: "Most quotes are delivered within 2-5 business days. Rush sourcing is available for urgent requests. Once you approve a quote, we begin production and shipping immediately.",
},
id: "1", title: "How long does the sourcing process take?", content: "Most quotes are delivered within 2-5 business days. Rush sourcing is available for urgent requests. Once you approve a quote, we begin production and shipping immediately."},
{
id: "2",
title: "What's the minimum order quantity?",
content: "We work with orders of any size, from single units to bulk shipments. No minimums required. Our network of suppliers ensures competitive pricing regardless of quantity.",
},
id: "2", title: "What's the minimum order quantity?", content: "We work with orders of any size, from single units to bulk shipments. No minimums required. Our network of suppliers ensures competitive pricing regardless of quantity."},
{
id: "3",
title: "Do you offer quality guarantees?",
content: "Yes, 100%. Every product goes through rigorous quality inspection before shipment. If you're unsatisfied, we offer a full refund or replacement within 30 days of delivery.",
},
id: "3", title: "Do you offer quality guarantees?", content: "Yes, 100%. Every product goes through rigorous quality inspection before shipment. If you're unsatisfied, we offer a full refund or replacement within 30 days of delivery."},
{
id: "4",
title: "What payment methods do you accept?",
content: "We accept credit cards (Visa, Mastercard, Amex), PayPal, and bank transfers. All payments are processed securely through industry-standard encryption.",
},
id: "4", title: "What payment methods do you accept?", content: "We accept credit cards (Visa, Mastercard, Amex), PayPal, and bank transfers. All payments are processed securely through industry-standard encryption."},
{
id: "5",
title: "Can you ship internationally?",
content: "Absolutely. We ship to 150+ countries with real-time tracking. Customs and import duties are handled transparently and included in your quote when applicable.",
},
id: "5", title: "Can you ship internationally?", content: "Absolutely. We ship to 150+ countries with real-time tracking. Customs and import duties are handled transparently and included in your quote when applicable."},
{
id: "6",
title: "What if the product isn't available?",
content: "If a product can't be sourced, we'll let you know immediately and suggest alternatives. No fees, no hidden charges. Your satisfaction is our priority.",
},
id: "6", title: "What if the product isn't available?", content: "If a product can't be sourced, we'll let you know immediately and suggest alternatives. No fees, no hidden charges. Your satisfaction is our priority."},
]}
/>
</div>
<div id="contact" data-section="contact">
<div id="contact" data-section="contact" className="transition-all duration-700 ease-out">
<ContactCenter
tag="Newsletter"
title="Stay Updated"
@@ -351,7 +236,7 @@ export default function HomePage() {
/>
</div>
<div id="footer" data-section="footer">
<div id="footer" data-section="footer" className="transition-all duration-500 ease-out">
<FooterBase
logoText="Chestnut"
copyrightText="© 2024 Chestnut. All rights reserved. Premium Sourcing & Logistics."

282
src/app/shop/page.tsx Normal file
View File

@@ -0,0 +1,282 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import FooterBase from "@/components/sections/footer/FooterBase";
import { ShoppingBag, Filter, X } from "lucide-react";
import { useState } from "react";
export default function ShopPage() {
const navItems = [
{ name: "Home", id: "home" },
{ name: "Shop", id: "shop" },
{ name: "How It Works", id: "how-it-works" },
{ name: "Services", id: "services" },
{ name: "Login", id: "login" },
];
const footerColumns = [
{
title: "Product", items: [
{ label: "Request Product", href: "/request-product" },
{ label: "My Quotes", href: "/my-quotes" },
{ label: "Track Order", href: "/track-order" },
{ label: "Shop", href: "/shop" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "#about" },
{ label: "Blog", href: "#blog" },
{ label: "Careers", href: "#careers" },
{ label: "Contact", href: "#contact" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#help" },
{ label: "Status", href: "#status" },
{ label: "FAQ", href: "#faq" },
{ label: "Email Us", href: "mailto:support@chestnut.com" },
],
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#privacy" },
{ label: "Terms of Service", href: "#terms" },
{ label: "Shipping Policy", href: "#shipping" },
{ label: "Refund Policy", href: "#refund" },
],
},
];
const [selectedCategory, setSelectedCategory] = useState("all");
const [priceRange, setPriceRange] = useState("all");
const [showFilters, setShowFilters] = useState(true);
const categories = [
{ id: "all", name: "All Products" },
{ id: "electronics", name: "Electronics" },
{ id: "accessories", name: "Accessories" },
{ id: "luxury", name: "Luxury Items" },
{ id: "fashion", name: "Fashion" },
];
const priceFilters = [
{ id: "all", name: "All Prices" },
{ id: "0-100", name: "Under $100" },
{ id: "100-500", name: "$100 - $500" },
{ id: "500-1000", name: "$500 - $1000" },
{ id: "1000+", name: "$1000+" },
];
const allProducts = [
{
id: "luxury-watch", name: "Precision Luxury Watch", price: "$1,250", variant: "Gold Edition", imageSrc: "http://img.b2bpic.net/free-photo/elegant-luxury-watch-displayed-premium-showcase_482257-123456.jpg?_wi=1", imageAlt: "Luxury precision watch in gold", category: "luxury", priceValue: 1250,
},
{
id: "leather-bag", name: "Premium Leather Handbag", price: "$450", variant: "Black Leather", imageSrc: "http://img.b2bpic.net/free-photo/luxury-leather-handbag-elegant-design_482257-123457.jpg?_wi=1", imageAlt: "Premium black leather handbag", category: "fashion", priceValue: 450,
},
{
id: "wireless-earbuds", name: "Premium Wireless Earbuds", price: "$280", variant: "Titanium Gray", imageSrc: "http://img.b2bpic.net/free-photo/premium-wireless-earbuds-with-case_482257-123458.jpg?_wi=1", imageAlt: "Premium wireless earbuds with charging case", category: "electronics", priceValue: 280,
},
{
id: "sunglasses", name: "Designer Sunglasses", price: "$320", variant: "UV Protection", imageSrc: "http://img.b2bpic.net/free-photo/luxury-designer-sunglasses-collection_482257-123459.jpg?_wi=1", imageAlt: "Designer sunglasses with UV protection", category: "accessories", priceValue: 320,
},
{
id: "smartwatch-pro", name: "Luxury Smartwatch Pro", price: "$899", variant: "Titanium Case", imageSrc: "http://img.b2bpic.net/free-photo/luxury-smartwatch-titanium-premium_482257-123460.jpg?_wi=1", imageAlt: "Luxury smartwatch with titanium case", category: "electronics", priceValue: 899,
},
{
id: "silk-scarf", name: "Premium Silk Scarf", price: "$180", variant: "Hand-painted", imageSrc: "http://img.b2bpic.net/free-photo/luxury-silk-scarf-hand-painted-design_482257-123461.jpg?_wi=1", imageAlt: "Hand-painted premium silk scarf", category: "fashion", priceValue: 180,
},
{
id: "diamond-ring", name: "Luxury Diamond Ring", price: "$2,500", variant: "Platinum", imageSrc: "http://img.b2bpic.net/free-photo/luxury-diamond-ring-platinum-setting_482257-123462.jpg?_wi=1", imageAlt: "Luxury diamond ring in platinum", category: "luxury", priceValue: 2500,
},
{
id: "camera-pro", name: "Professional Camera", price: "$1,800", variant: "Full Frame", imageSrc: "http://img.b2bpic.net/free-photo/professional-full-frame-camera-equipment_482257-123463.jpg?_wi=1", imageAlt: "Professional full frame camera", category: "electronics", priceValue: 1800,
},
{
id: "wallet-leather", name: "Premium Leather Wallet", price: "$120", variant: "Italian Leather", imageSrc: "http://img.b2bpic.net/free-photo/luxury-leather-wallet-italian-crafted_482257-123464.jpg?_wi=1", imageAlt: "Italian leather premium wallet", category: "accessories", priceValue: 120,
},
];
const filterProducts = () => {
return allProducts.filter((product) => {
const categoryMatch =
selectedCategory === "all" || product.category === selectedCategory;
let priceMatch = true;
if (priceRange === "0-100") priceMatch = product.priceValue < 100;
else if (priceRange === "100-500")
priceMatch = product.priceValue >= 100 && product.priceValue < 500;
else if (priceRange === "500-1000")
priceMatch = product.priceValue >= 500 && product.priceValue < 1000;
else if (priceRange === "1000+") priceMatch = product.priceValue >= 1000;
return categoryMatch && priceMatch;
});
};
const filteredProducts = filterProducts();
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="smallMedium"
sizing="mediumLarge"
background="circleGradient"
cardStyle="gradient-bordered"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<NavbarStyleApple brandName="Chestnut" navItems={navItems} />
</div>
<div id="shop" data-section="shop" className="relative">
<div className="min-h-screen bg-gradient-to-br from-slate-950 via-slate-900 to-slate-950 py-12">
{/* Header */}
<div className="mx-auto px-4 mb-12 max-w-6xl">
<div className="flex items-center justify-between mb-8">
<div>
<h1 className="text-4xl md:text-5xl font-bold text-white mb-2 flex items-center gap-3">
<ShoppingBag className="w-10 h-10" />
Luxury Collection
</h1>
<p className="text-slate-400 text-lg">
Curated premium products for discerning customers
</p>
</div>
<button
onClick={() => setShowFilters(!showFilters)}
className="lg:hidden flex items-center gap-2 px-4 py-2 bg-slate-800 hover:bg-slate-700 text-white rounded-lg transition-colors"
>
<Filter className="w-5 h-5" />
Filters
</button>
</div>
<div className="grid grid-cols-1 lg:grid-cols-4 gap-8">
{/* Filters Sidebar */}
{showFilters && (
<div className="lg:col-span-1">
<div className="bg-slate-800/50 backdrop-blur border border-slate-700 rounded-xl p-6 sticky top-20">
<div className="flex items-center justify-between mb-6 lg:mb-6">
<h2 className="text-lg font-bold text-white">Filters</h2>
<button
onClick={() => setShowFilters(false)}
className="lg:hidden"
>
<X className="w-5 h-5 text-slate-400" />
</button>
</div>
{/* Category Filter */}
<div className="mb-8">
<h3 className="font-semibold text-white mb-4">Category</h3>
<div className="space-y-2">
{categories.map((cat) => (
<label
key={cat.id}
className="flex items-center gap-3 cursor-pointer group"
>
<input
type="radio"
name="category"
value={cat.id}
checked={selectedCategory === cat.id}
onChange={(e) => setSelectedCategory(e.target.value)}
className="w-4 h-4 accent-blue-400"
/>
<span className="text-slate-300 group-hover:text-white transition-colors">
{cat.name}
</span>
</label>
))}
</div>
</div>
{/* Price Filter */}
<div className="mb-8 pb-8 border-b border-slate-700">
<h3 className="font-semibold text-white mb-4">Price Range</h3>
<div className="space-y-2">
{priceFilters.map((price) => (
<label
key={price.id}
className="flex items-center gap-3 cursor-pointer group"
>
<input
type="radio"
name="price"
value={price.id}
checked={priceRange === price.id}
onChange={(e) => setPriceRange(e.target.value)}
className="w-4 h-4 accent-blue-400"
/>
<span className="text-slate-300 group-hover:text-white transition-colors">
{price.name}
</span>
</label>
))}
</div>
</div>
{/* Reset Filters */}
<button
onClick={() => {
setSelectedCategory("all");
setPriceRange("all");
}}
className="w-full px-4 py-2 bg-slate-700 hover:bg-slate-600 text-white rounded-lg font-medium transition-colors"
>
Reset Filters
</button>
</div>
</div>
)}
{/* Products Grid */}
<div className="lg:col-span-3">
<ProductCardFour
title={`${filteredProducts.length} Product${filteredProducts.length !== 1 ? "s" : ""} Found`}
description="Premium luxury items curated for quality and exclusivity"
tag="Premium Collection"
tagIcon={ShoppingBag}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
products={filteredProducts.map((product) => ({
id: product.id,
name: product.name,
price: product.price,
variant: product.variant,
imageSrc: product.imageSrc,
imageAlt: product.imageAlt,
onFavorite: undefined,
onProductClick: undefined,
isFavorited: false,
}))}
/>
</div>
</div>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="Chestnut"
copyrightText="© 2024 Chestnut. All rights reserved. Premium Sourcing & Logistics."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}

14
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #0a0a0a;
--card: #1a1a1a;
--foreground: #f0f8ffe6;
--primary-cta: #cee7ff;
--background: #0a0e27;
--card: #111d3b;
--foreground: #e8e8e8;
--primary-cta: #c9a961;
--primary-cta-text: #0a0a0a;
--secondary-cta: #1a1a1a;
--secondary-cta: #1a2951;
--secondary-cta-text: #f0f8ffe6;
--accent: #737373;
--background-accent: #737373;
--accent: #d4af37;
--background-accent: #1a2951;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);