Merge version_2 into main #4
338
src/app/page.tsx
338
src/app/page.tsx
@@ -8,7 +8,7 @@ import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
|
||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
||||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
|
||||
@@ -20,250 +20,124 @@ export default function LandingPage() {
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="mediumLarge"
|
||||
background="blurBottom"
|
||||
background="noise"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Accueil", id: "hero"},
|
||||
{
|
||||
name: "Processus", id: "process"},
|
||||
{
|
||||
name: "Résultats", id: "results"},
|
||||
{
|
||||
name: "Tarifs", id: "pricing"},
|
||||
]}
|
||||
brandName="Helvetisell"
|
||||
button={{
|
||||
text: "Estimation gratuite", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Accueil", id: "hero" },
|
||||
{ name: "Processus", id: "process" },
|
||||
{ name: "Résultats", id: "results" },
|
||||
{ name: "Tarifs", id: "pricing" },
|
||||
]}
|
||||
brandName="Helvetisell"
|
||||
button={{ text: "Estimation gratuite", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
title="On vend vos objets à votre place."
|
||||
description="Simple, rapide, sans effort. Vous gardez l’essentiel pendant que nous maximisons la valeur de ce dont vous ne vous servez plus."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sophie M.", handle: "@sophie_deco", testimonial: "Une expérience incroyablement fluide. Mes objets ont été vendus plus cher que ce que j'espérais.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blonde-woman-model-studio_1303-14017.jpg"},
|
||||
{
|
||||
name: "Marc L.", handle: "@marc_collection", testimonial: "Le service clé en main idéal. Je n'ai eu à m'occuper de rien, c'est très professionnel.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-woman-with-crossed-arms-smiling_23-2148095677.jpg"},
|
||||
{
|
||||
name: "Julie B.", handle: "@julie_b", testimonial: "Vraiment efficace, j'ai récupéré une belle somme pour des objets qui prenaient la poussière.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-with-short-hair-bright-lips-glasses-smiling-outside-trendy-lady-black-clothes-posing-stairs_197531-19325.jpg"},
|
||||
{
|
||||
name: "Thomas G.", handle: "@thomas_g", testimonial: "Un professionnalisme rare. Une prise en charge totale, je recommande.", rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/caucasian-businesswoman-with-elegance-confidence-standing-generative-ai_188544-7684.jpg"},
|
||||
{
|
||||
name: "Claire L.", handle: "@claire_l", testimonial: "La vente a été rapide et les conseils d'estimation étaient très justes.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Obtenir une estimation gratuite", href: "#contact"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cashier-working-computer-counter_482257-85807.jpg?_wi=1"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cashier-working-computer-counter_482257-85807.jpg", alt: "Sophie M."},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ft4yf0", alt: "Marc L."},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-vector/business-designs-collection_1209-24.jpg", alt: "Julie B."},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/money-bag-clay-icon-cute-diy-finance-creative-craft-graphic_53876-126144.jpg", alt: "Thomas G."},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/small-purse-studio-still-life_23-2151046501.jpg", alt: "Claire L."},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "Expertise"},
|
||||
{
|
||||
type: "text", text: "Rapidité"},
|
||||
{
|
||||
type: "text", text: "Sérénité"},
|
||||
{
|
||||
type: "text", text: "Professionnalisme"},
|
||||
{
|
||||
type: "text", text: "Valeur"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
title="On vend vos objets à votre place."
|
||||
description="La référence de la consignation haut de gamme. Nous transformons vos objets de valeur en capital, en toute élégance et transparence."
|
||||
buttons={[{ text: "Démarrer mon estimation", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/cashier-working-computer-counter_482257-85807.jpg?_wi=1"
|
||||
mediaAnimation="blur-reveal"
|
||||
titleClassName="text-gold-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="process" data-section="process">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Expertise & Estimation", description: "Nous évaluons vos biens avec précision pour déterminer leur valeur optimale sur le marché.", phoneOne: {
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ft4yf0&_wi=1"},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/shopping-cart-with-gifts-arrangement-white-glitter_23-2148667028.jpg"},
|
||||
},
|
||||
{
|
||||
title: "Gestion & Vente", description: "Nos experts créent des annonces premium, négocient pour vous et gèrent les acheteurs.", phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/business-designs-collection_1209-24.jpg?_wi=1"},
|
||||
phoneTwo: {
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=87skpl"},
|
||||
},
|
||||
{
|
||||
title: "Encaissement", description: "Une fois l'objet remis, nous vous reversons les fonds directement par virement bancaire.", phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/small-purse-studio-still-life_23-2151046501.jpg?_wi=1"},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/piggy-savings-concept-pink-background-3d-rendering_56104-1443.jpg"},
|
||||
},
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Comment ça marche"
|
||||
description="Trois étapes simples pour transformer vos objets en capital."
|
||||
/>
|
||||
</div>
|
||||
<div id="process" data-section="process">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "1. Expertise", description: "Nos experts évaluent vos objets de luxe pour en maximiser la valeur de revente.", phoneOne: { imageSrc: "" }, phoneTwo: { imageSrc: "" } },
|
||||
{ title: "2. Vente Premium", description: "Nous prenons en charge la mise en vente sur les meilleurs réseaux avec une mise en valeur exclusive.", phoneOne: { imageSrc: "" }, phoneTwo: { imageSrc: "" } },
|
||||
{ title: "3. Virement", description: "Recevez vos gains rapidement une fois la vente finalisée par nos soins.", phoneOne: { imageSrc: "" }, phoneTwo: { imageSrc: "" } },
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Comment ça marche"
|
||||
description="Un processus simplifié pour les objets exceptionnels."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="results" data-section="results">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "s1", name: "Sac de marque", price: "Gains client: 850€", variant: "Vendu en 48h", imageSrc: "http://img.b2bpic.net/free-photo/small-purse-studio-still-life_23-2151046501.jpg?_wi=2"},
|
||||
{
|
||||
id: "s2", name: "Mobilier design", price: "Gains client: 1200€", variant: "Vendu en 5 jours", imageSrc: "http://img.b2bpic.net/free-photo/pillow-sofa_74190-2069.jpg"},
|
||||
{
|
||||
id: "s3", name: "Montre vintage", price: "Gains client: 2100€", variant: "Vendu en 3 jours", imageSrc: "http://img.b2bpic.net/free-photo/sexy-elegant-woman-natural-beauty-fashion-style-clothes-casual-formal-suit-white-cotton-blouse-silk-pants-romantic-date-blouse-pants-party-style-glamour-model-trend-accessory-bag-dark-hair-makeup_132075-12101.jpg"},
|
||||
{
|
||||
id: "s4", name: "Table en marbre", price: "Gains client: 600€", variant: "Vendu en 1 semaine", imageSrc: "http://img.b2bpic.net/free-photo/vintage-vhs-packaging-arrangement_23-2149854272.jpg"},
|
||||
{
|
||||
id: "s5", name: "Instrument rare", price: "Gains client: 1500€", variant: "Vendu en 10 jours", imageSrc: "http://img.b2bpic.net/free-photo/flowers-vase-still-like-baroque-style_23-2149659333.jpg"},
|
||||
{
|
||||
id: "s6", name: "Lampe design", price: "Gains client: 450€", variant: "Vendu en 2 jours", imageSrc: "http://img.b2bpic.net/free-photo/colorful-liquid-marble-background-abstract-flowing-texture-experimental-art_53876-104557.jpg"},
|
||||
]}
|
||||
title="Exemples de réussites"
|
||||
description="Quelques objets vendus récemment par nos experts."
|
||||
/>
|
||||
</div>
|
||||
<div id="results" data-section="results">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[]}
|
||||
title="Nos récentes consignations"
|
||||
description="Découvrez une sélection d'objets vendus par Helvetisell."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "basic", badge: "Standard", price: "25%", subtitle: "Pour une vente unique", features: [
|
||||
"Estimation offerte", "Gestion de l'annonce", "Paiement sécurisé"],
|
||||
},
|
||||
{
|
||||
id: "pro", badge: "Premium", price: "18%", subtitle: "Dès 3 objets confiés", features: [
|
||||
"Priority Listing", "Photos professionnelles", "Assistance dédiée"],
|
||||
},
|
||||
{
|
||||
id: "vip", badge: "VIP", price: "12%", subtitle: "Volume & Collections", features: [
|
||||
"Expertise complète", "Mise en avant", "Rapports hebdomadaires"],
|
||||
},
|
||||
]}
|
||||
title="Une commission dégressive"
|
||||
description="Plus vous nous confiez d'objets, plus votre commission diminue."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{ id: "standard", badge: "Standard", price: "25%", subtitle: "Vente unique", buttons: [{ text: "Choisir", href: "#contact" }], features: ["Expertise offerte", "Vente sécurisée", "Suivi client"] },
|
||||
{ id: "premium", badge: "Premium", price: "18%", subtitle: "À partir de 3 objets", buttons: [{ text: "Choisir", href: "#contact" }], features: ["Mise en avant", "Shooting photo", "Virement rapide"] },
|
||||
{ id: "vip", badge: "VIP", price: "12%", subtitle: "Collections complètes", buttons: [{ text: "Choisir", href: "#contact" }], features: ["Account Manager dédié", "Expertise certifiée", "Rapports mensuels"] },
|
||||
]}
|
||||
title="Commission transparente"
|
||||
description="Une tarification dégressive selon le volume de vos objets."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Claire P.", date: "12 Oct", title: "Service irréprochable", quote: "Helvetisell m'a permis de libérer de l'espace tout en récupérant une belle somme.", tag: "Vente de mobilier", avatarSrc: "http://img.b2bpic.net/free-photo/young-gorgeous-stylish-businesswoman-with-coffee-go-dreamily-looking-camera-outdoor_574295-4076.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cashier-working-computer-counter_482257-85807.jpg?_wi=2", imageAlt: "professional woman portrait elegant"},
|
||||
{
|
||||
id: "t2", name: "Julien D.", date: "05 Nov", title: "Expertise unique", quote: "Je ne savais pas que ma montre valait ce prix. Merci à l'équipe !", tag: "Vente de luxe", avatarSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ft4yf0&_wi=2", imageAlt: "professional woman portrait elegant"},
|
||||
{
|
||||
id: "t3", name: "Hélène R.", date: "20 Nov", title: "Rapide et efficace", quote: "Une communication au top tout au long du processus de vente.", tag: "Vente divers", avatarSrc: "http://img.b2bpic.net/free-photo/young-business-woman-standing-by-window-office_1303-20346.jpg", imageSrc: "http://img.b2bpic.net/free-vector/business-designs-collection_1209-24.jpg?_wi=2", imageAlt: "professional woman portrait elegant"},
|
||||
{
|
||||
id: "t4", name: "Thomas B.", date: "02 Déc", title: "Très satisfait", quote: "Confiance totale. Je recommande sans hésiter pour les objets de valeur.", tag: "Vente de collection", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-female-staff-airport-terminal_107420-85049.jpg", imageSrc: "http://img.b2bpic.net/free-photo/money-bag-clay-icon-cute-diy-finance-creative-craft-graphic_53876-126144.jpg", imageAlt: "professional woman portrait elegant"},
|
||||
{
|
||||
id: "t5", name: "Marie-Ange L.", date: "10 Déc", title: "Excellent résultat", quote: "Le meilleur service de consignation à Genève.", tag: "Vente design", avatarSrc: "http://img.b2bpic.net/free-photo/young-beautiful-business-woman-gray-background_1303-23146.jpg", imageSrc: "http://img.b2bpic.net/free-photo/small-purse-studio-still-life_23-2151046501.jpg?_wi=3", imageAlt: "professional woman portrait elegant"},
|
||||
]}
|
||||
title="La confiance avant tout"
|
||||
description="Nos clients témoignent de leur sérénité lors de la vente."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[]}
|
||||
title="Ils nous font confiance"
|
||||
description="L'excellence au service de vos objets."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1", title: "Quels types d'objets acceptez-vous ?", content: "Nous acceptons les objets de valeur, le mobilier design, l'art, les accessoires de luxe, et les objets de collection."},
|
||||
{
|
||||
id: "q2", title: "Comment est fixé le prix ?", content: "Nous réalisons une estimation basée sur les cours du marché, l'état de l'objet et notre expertise."},
|
||||
{
|
||||
id: "q3", title: "Combien de temps dure une vente ?", content: "En général, une vente réussie prend entre 3 et 15 jours selon la demande sur l'objet."},
|
||||
{
|
||||
id: "q4", title: "Quelle est votre commission ?", content: "Elle varie selon le volume (de 25% à 12%) et la valeur globale des objets confiés."},
|
||||
]}
|
||||
title="Questions fréquentes"
|
||||
description="Tout ce que vous devez savoir sur notre service."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Quels types d'objets sont acceptés ?", content: "Nous consignons uniquement des objets de haute qualité, de marque ou de collection." },
|
||||
{ id: "q2", title: "Comment garantir la sécurité ?", content: "Tous vos biens sont assurés durant toute la durée de la consignation chez Helvetisell." },
|
||||
]}
|
||||
title="Questions fréquentes"
|
||||
description="En savoir plus sur notre expertise."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
text="Prêt à transformer vos objets en capital ? Obtenez votre estimation gratuite et sans engagement dès aujourd'hui."
|
||||
buttons={[
|
||||
{
|
||||
text: "Démarrer mon estimation", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Prêt à vendre vos objets avec Helvetisell ? Contactez notre équipe pour une évaluation personnalisée."
|
||||
buttons={[{ text: "Démarrer mon estimation", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chic-mid-century-modern-luxury-aesthetics-living-room-with-gray-velvet-couch-golden-lamp_53876-139781.jpg"
|
||||
logoText="Helvetisell"
|
||||
columns={[
|
||||
{
|
||||
title: "Helvetisell", items: [
|
||||
{
|
||||
label: "À propos", href: "#"},
|
||||
{
|
||||
label: "Services", href: "#"},
|
||||
{
|
||||
label: "Contact", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Légal", items: [
|
||||
{
|
||||
label: "CGV", href: "#"},
|
||||
{
|
||||
label: "Confidentialité", href: "#"},
|
||||
{
|
||||
label: "Mentions légales", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
logoText="Helvetisell"
|
||||
columns={[
|
||||
{ title: "Helvetisell", items: [{ label: "À propos", href: "#" }, { label: "Contact", href: "#" }] },
|
||||
{ title: "Légal", items: [{ label: "CGV", href: "#" }, { label: "Confidentialité", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user