336 lines
14 KiB
TypeScript
336 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { CheckCircle, Shield, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="medium"
|
|
sizing="largeSizeMediumTitles"
|
|
background="floatingGradient"
|
|
cardStyle="gradient-mesh"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "Results", id: "results"},
|
|
{
|
|
name: "Training", id: "training"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="ChinaLearn"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroCarouselLogo
|
|
logoText="Master the Chinese Marketplaces"
|
|
description="Learn to source, buy, and import goods from Taobao, 1688, Pinduoduo, and Poison with our expert-led, 4-day intensive training program."
|
|
buttons={[
|
|
{
|
|
text: "Start Learning", href: "#training"},
|
|
]}
|
|
slides={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/military-base-operations-chinese-government-spread-misinformation_482257-124904.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/server-room-arrays-processing-neural-network-datasets_482257-124389.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/shopper-using-online-store-mobile-app-phone-examining-modern-fashion-items-collection-buying-merchandise-boutique-client-looking-clothing-line-retail-shop-website_482257-67405.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-dark-earth-space_23-2151051392.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-taking-notes_23-2148888827.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-using-tablet-test-solar-panel-designs_482257-119461.jpg"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="results" data-section="results">
|
|
<ProductCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1", name: "Smart Home Hubs", price: "High Margin", imageSrc: "http://img.b2bpic.net/free-photo/military-base-operations-chinese-government-spread-misinformation_482257-124904.jpg"},
|
|
{
|
|
id: "p2", name: "Custom Electronics", price: "High Demand", imageSrc: "http://img.b2bpic.net/free-photo/server-room-arrays-processing-neural-network-datasets_482257-124389.jpg"},
|
|
{
|
|
id: "p3", name: "Unique Fashion Accessories", price: "Trend Focused", imageSrc: "http://img.b2bpic.net/free-photo/shopper-using-online-store-mobile-app-phone-examining-modern-fashion-items-collection-buying-merchandise-boutique-client-looking-clothing-line-retail-shop-website_482257-67405.jpg"},
|
|
{
|
|
id: "p4", name: "Portable Tech Gadgets", price: "Best Seller", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-dark-earth-space_23-2151051392.jpg"},
|
|
{
|
|
id: "p5", name: "Home Decor Aesthetics", price: "High Appeal", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-taking-notes_23-2148888827.jpg"},
|
|
{
|
|
id: "p6", name: "Kitchen Automation Tools", price: "Essential Tech", imageSrc: "http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-using-tablet-test-solar-panel-designs_482257-119461.jpg"},
|
|
]}
|
|
title="Success Stories: Products Sourced by Students"
|
|
description="Discover what our students are bringing in from China and the profit benefits."
|
|
/>
|
|
</div>
|
|
|
|
<div id="training" data-section="training">
|
|
<PricingCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
plans={[
|
|
{
|
|
id: "training-plan", name: "Marketplace Mastery", price: "0 Rubles", features: [
|
|
"Daily live support during training", "Access to verified supplier databases", "Complete shipping optimization guide", "Payment gateway setup mastery", "4 days of intensive guidance"],
|
|
buttons: [
|
|
{
|
|
text: "Enroll Now"},
|
|
],
|
|
},
|
|
]}
|
|
title="Intensive Training Conditions"
|
|
description="Join our 4-day expert-led intensive course to master Chinese marketplaces."
|
|
/>
|
|
</div>
|
|
|
|
<div id="advantages" data-section="advantages">
|
|
<FeatureCardTen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Expert Knowledge", description: "Learn from professionals with years of direct China-market experience.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/military-base-operations-chinese-government-spread-misinformation_482257-124904.jpg"},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Practical experience"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Proven sourcing strategies"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Avoiding common scams"},
|
|
],
|
|
reverse: false,
|
|
},
|
|
{
|
|
title: "Hands-On Support", description: "We don't just teach theory; we guide your first orders through the platforms.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/server-room-arrays-processing-neural-network-datasets_482257-124389.jpg"},
|
|
items: [
|
|
{
|
|
icon: Zap,
|
|
text: "Live order assistance"},
|
|
{
|
|
icon: Zap,
|
|
text: "Translation help provided"},
|
|
{
|
|
icon: Zap,
|
|
text: "Custom logistics plans"},
|
|
],
|
|
reverse: true,
|
|
},
|
|
{
|
|
title: "Platform Diversity", description: "Master multiple marketplaces simultaneously.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/shopper-using-online-store-mobile-app-phone-examining-modern-fashion-items-collection-buying-merchandise-boutique-client-looking-clothing-line-retail-shop-website_482257-67405.jpg"},
|
|
items: [
|
|
{
|
|
icon: Shield,
|
|
text: "Taobao & 1688 mastery"},
|
|
{
|
|
icon: Shield,
|
|
text: "Pinduoduo sourcing"},
|
|
{
|
|
icon: Shield,
|
|
text: "Poison verification tips"},
|
|
],
|
|
reverse: false,
|
|
},
|
|
]}
|
|
title="Three Advantages of Our Training"
|
|
description="Why choose our structured learning approach for your sourcing needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="passport" data-section="passport">
|
|
<TextAbout
|
|
useInvertedBackground={true}
|
|
title="Requirement: International Passport"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Alex P.", role: "Entrepreneur", company: "GrowthCo", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-african-beautiful-woman-student-smiling-holding-books-university-education-concept_176420-12453.jpg"},
|
|
{
|
|
id: "2", name: "Masha V.", role: "Start-up Founder", company: "MarketLab", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-drag-queen-indoors_23-2149556820.jpg"},
|
|
{
|
|
id: "3", name: "Dmitry R.", role: "E-commerce Owner", company: "TechTrade", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-business-woman-secretary-holding-laptop-modern-office_1258-104572.jpg"},
|
|
{
|
|
id: "4", name: "Elena S.", role: "Buyer", company: "FashionPro", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg"},
|
|
{
|
|
id: "5", name: "Ivan K.", role: "Logistics Expert", company: "GlobalFlow", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-successful-middle-aged-business-leader_1262-5690.jpg"},
|
|
]}
|
|
title="Hear From Our Successful Students"
|
|
description="Read success stories from students currently running profitable businesses."
|
|
/>
|
|
</div>
|
|
|
|
<div id="steps" data-section="steps">
|
|
<FeatureCardTen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
title: "1. Foundation Setup", description: "Account creation and identity verification on all marketplaces.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-dark-earth-space_23-2151051392.jpg"},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Platform registration"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Passport prep"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Security protocols"},
|
|
],
|
|
reverse: false,
|
|
},
|
|
{
|
|
title: "2. Supplier Mastery", description: "Learning to distinguish reliable suppliers from generic ones.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-taking-notes_23-2148888827.jpg"},
|
|
items: [
|
|
{
|
|
icon: Zap,
|
|
text: "Ranking analysis"},
|
|
{
|
|
icon: Zap,
|
|
text: "Direct communication"},
|
|
{
|
|
icon: Zap,
|
|
text: "Quality validation"},
|
|
],
|
|
reverse: true,
|
|
},
|
|
{
|
|
title: "3. Shipping & Logistics", description: "Managing your goods from China to your doorstep safely.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-using-tablet-test-solar-panel-designs_482257-119461.jpg"},
|
|
items: [
|
|
{
|
|
icon: Shield,
|
|
text: "Consolidation guide"},
|
|
{
|
|
icon: Shield,
|
|
text: "Tax management"},
|
|
{
|
|
icon: Shield,
|
|
text: "Tracking mastery"},
|
|
],
|
|
reverse: false,
|
|
},
|
|
]}
|
|
title="Three Training Steps"
|
|
description="Our proven 3-step learning approach."
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-buy" data-section="why-buy">
|
|
<MetricCardFourteen
|
|
useInvertedBackground={false}
|
|
title="Why Buying from China is Beneficial"
|
|
tag="Market Opportunities"
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "70%", description: "Average cost savings"},
|
|
{
|
|
id: "m2", value: "1000s", description: "New products weekly"},
|
|
{
|
|
id: "m3", value: "Global", description: "Worldwide reach potential"},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="access" data-section="access">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "a1", title: "Direct Supplier Database", content: "Instant access to vetted manufacturer lists."},
|
|
{
|
|
id: "a2", title: "Logistic Forwarder List", content: "Our recommended partners for shipping."},
|
|
{
|
|
id: "a3", title: "Platform Plugins", content: "Tools to automate browsing."},
|
|
{
|
|
id: "a4", title: "Troubleshooting Support", content: "Direct chat access to trainers."},
|
|
{
|
|
id: "a5", title: "Tax Compliance Guide", content: "How to handle import documents."},
|
|
{
|
|
id: "a6", title: "Scaling Strategy", content: "How to turn sourcing into a business."},
|
|
]}
|
|
title="Access After Training"
|
|
description="What you get once the 4 days conclude."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "canvas-reveal"}}
|
|
tag="Get Started"
|
|
title="Join Our Next Training Cohort"
|
|
description="Ready to start your sourcing journey? Fill in the form below and we'll reach out."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="ChinaLearn"
|
|
copyrightText="© 2025 ChinaLearn. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|