Merge version_1 into main #5
@@ -11,8 +11,8 @@ import { Playfair_Display, Inter } from "next/font/google";
|
||||
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'Daria - Apprends le Darija avec une IA marocaine',
|
||||
description: 'Apprends le Darija marocain facilement grâce à Daria, ton amie virtuelle IA qui t\'apprend par la voix.',
|
||||
title: 'Workflow Revolution',
|
||||
description: 'Streamline your team\'s workflow with our AI-powered productivity platform.',
|
||||
openGraph: {
|
||||
"title": "Daria - Apprends le Darija",
|
||||
"description": "Ton amie virtuelle marocaine.",
|
||||
|
||||
264
src/app/page.tsx
264
src/app/page.tsx
@@ -1,193 +1,105 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
|
||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||||
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
|
||||
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
||||
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
|
||||
import FeatureCardTwentyNine from "@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine";
|
||||
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
|
||||
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
|
||||
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
|
||||
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
||||
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
|
||||
|
||||
export default function LandingPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" }
|
||||
];
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="large"
|
||||
background="noise"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Fonctionnalités", id: "features" },
|
||||
{ name: "Comment ça marche", id: "how-it-works" },
|
||||
{ name: "Tarifs", id: "pricing" },
|
||||
{ name: "Témoignages", id: "testimonials" },
|
||||
]}
|
||||
brandName="Daria"
|
||||
button={{ text: "Essayer gratuitement", href: "#pricing" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Parle Darija comme un vrai Marocain 🇲🇦"
|
||||
description="Daria est ton amie virtuelle marocaine — elle t'apprend le Darija par la voix, à ton rythme, en français."
|
||||
testimonials={[
|
||||
{ name: "Marie", handle: "Utilisatrice", testimonial: "Daria rend l'apprentissage tellement naturel et ludique.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-with-long-brown-hair_1308-179038.jpg" },
|
||||
{ name: "Thomas", handle: "Apprenant", testimonial: "La meilleure façon d'apprendre le Darija sans stress.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151134160.jpg" },
|
||||
{ name: "Sophie", handle: "Passionnée", testimonial: "J'adore les échanges culturels, c'est super enrichissant.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-cartoon-woman-portrait_23-2151839613.jpg" },
|
||||
{ name: "Lucas", handle: "Expert", testimonial: "Une interface fluide et une IA vraiment intelligente.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151133862.jpg" },
|
||||
{ name: "Julie", handle: "Voyageuse", testimonial: "Je me sens enfin prête à converser avec ma famille au Maroc.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-collective-portrait-people_23-2150964658.jpg" }
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Commencer gratuitement", href: "#pricing" },
|
||||
{ text: "Voir la démo", href: "#demo" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/digital-connection-technology-social-media_53876-124327.jpg"
|
||||
<ThemeProvider>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline navItems={navItems} />
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
title="Revolutionize Your Workflow"
|
||||
description="Seamlessly manage your tasks with our intelligent, AI-powered platform designed for modern teams."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
testimonials={[]}
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautiful-cartoon-woman-portrait_23-2151839669.jpg", alt: "Apprenante 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151133899.jpg", alt: "Apprenant 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/androgynous-avatar-non-binary-queer-person_23-2151100242.jpg", alt: "Apprenant 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautiful-cartoon-woman-portrait_23-2151839664.jpg", alt: "Apprenante 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-man-digital-art_23-2151197860.jpg", alt: "Apprenant 3" }
|
||||
]}
|
||||
avatarText="+ 3 000 apprenants satisfaits"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
/>
|
||||
</div>
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
names={["Acme", "Globex", "Soylent Corp", "Initech"]}
|
||||
title="Trusted by Industry Leaders"
|
||||
description="Join the ranks of thousands of teams that rely on our platform daily."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={["Plus de 3 000 apprenants", "Utilisé à Paris", "Approuvé par des experts", "Recommandé à Lyon", "Populaire à Bordeaux", "Communauté active", "Résultats rapides"]}
|
||||
title="Rejoins + 3 000 apprenants français"
|
||||
description="Une communauté grandissante de passionnés par le Maroc."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="how-it-works" data-section="how-it-works">
|
||||
<MetricCardSeven
|
||||
/>
|
||||
</div>
|
||||
<div id="how-it-works" data-section="how-it-works">
|
||||
<MetricCardSeven
|
||||
metrics={[]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "1", value: "01", title: "Choisis un thème", items: ["Salutations", "Au marché", "Au café"] },
|
||||
{ id: "2", value: "02", title: "Parle avec Daria", items: ["Conversation orale", "Voice chat IA", "Immersion réelle"] },
|
||||
{ id: "3", value: "03", title: "Suis tes progrès", items: ["Prononciation", "Vocabulaire", "Fluidité"] }
|
||||
]}
|
||||
title="Comment ça marche"
|
||||
description="Apprendre le Darija en 3 étapes simples et naturelles."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyNine
|
||||
title="Efficient Processes"
|
||||
description="Achieve more in less time with our streamlined metrics dashboard."
|
||||
textboxLayout="default"
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Professeure vocale IA", description: "Une amie virtuelle disponible 24/7.", imageSrc: "http://img.b2bpic.net/free-vector/isometric-online-education-flowchart_1284-32913.jpg", titleImageSrc: "http://img.b2bpic.net/free-vector/avatars-flat-set_1284-13674.jpg", buttonText: "En savoir plus" },
|
||||
{ title: "Scénarios réels", description: "Café, marché, famille, le quotidien.", imageSrc: "http://img.b2bpic.net/free-vector/cafe-table-chairs_23-2147502979.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/shopping-bag-graph-bar-with-arrow-ecommerce-concept-blue-background-3d-illustration_56104-1794.jpg", buttonText: "En savoir plus" },
|
||||
{ title: "Correction de prononciation", description: "Améliore ton accent marocain.", imageSrc: "http://img.b2bpic.net/free-photo/white-page-vinyl-record-red-headphone-white-background_23-2147926820.jpg", titleImageSrc: "http://img.b2bpic.net/free-vector/equalizer-logo-collection-with-flat-design_23-2147831587.jpg", buttonText: "En savoir plus" },
|
||||
{ title: "Tips culturels", description: "Découvre les traditions marocaines.", imageSrc: "http://img.b2bpic.net/free-vector/travel-icons-flat_98292-1255.jpg", titleImageSrc: "http://img.b2bpic.net/free-vector/flat-design-elements-collection-reyes-magos_23-2151025814.jpg", buttonText: "En savoir plus" },
|
||||
{ title: "Suivi de progression", description: "Visualise ton évolution clairement.", imageSrc: "http://img.b2bpic.net/free-vector/statistic-icons-collection_1284-871.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/chart-statistics-front-side-with-white-background_187299-39798.jpg", buttonText: "En savoir plus" },
|
||||
{ title: "Répétition espacée", description: "Apprends efficacement et durablement.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-concentric-arrows_23-2148490593.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/flat-lay-black-arrows-notebook-mock-up-blue-background_23-2148459910.jpg", buttonText: "En savoir plus" }
|
||||
]}
|
||||
title="Tout ce dont tu as besoin pour maîtriser le Darija"
|
||||
description="Des outils conçus pour t'aider à progresser chaque jour."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyNine
|
||||
features={[]}
|
||||
gridVariant="bento-grid"
|
||||
animationType="slide-up"
|
||||
title="Powerful Features"
|
||||
description="Everything you need to scale your operations effortlessly."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Marie", handle: "Paris", testimonial: "Daria est géniale, c'est comme avoir une amie marocaine à la maison.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-with-long-brown-hair_1308-179038.jpg" },
|
||||
{ id: "2", name: "Thomas", handle: "Lyon", testimonial: "Ma prononciation a énormément progressé grâce aux corrections.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151134160.jpg" },
|
||||
{ id: "3", name: "Sophie", handle: "Bordeaux", testimonial: "J'adore les thèmes culturels, c'est super enrichissant.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-cartoon-woman-portrait_23-2151839613.jpg" },
|
||||
{ id: "4", name: "Lucas", handle: "Paris", testimonial: "Enfin une méthode fun et efficace pour parler Darija.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-cartoon-style_23-2151133862.jpg" },
|
||||
{ id: "5", name: "Julie", handle: "Lyon", testimonial: "Je recommande Daria à tous mes amis qui aiment le Maroc.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-collective-portrait-people_23-2150964658.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
testimonials={[]}
|
||||
showRating={true}
|
||||
title="Ce que disent nos apprenants"
|
||||
description="Ils ont adopté Daria pour apprendre le Darija."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardTwo
|
||||
animationType="slide-up"
|
||||
title="What Our Users Say"
|
||||
description="Discover how our platform changed the way people work."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "gratuit", badge: "Gratuit", price: "0€", subtitle: "Pour débuter", features: ["5 leçons/jour", "Thèmes de base", "Progression limitée"], buttons: [{ text: "Commencer", href: "#" }] },
|
||||
{ id: "pro", badge: "Populaire", price: "9,99€/mois", subtitle: "Le plus populaire", features: ["Leçons illimitées", "Tous les thèmes", "Correction avancée", "Conversation libre"], buttons: [{ text: "Passer au Pro", href: "#" }] }
|
||||
]}
|
||||
title="Simple et transparent"
|
||||
description="Choisis l'offre qui correspond à tes objectifs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "1", title: "Est-ce que Daria parle vraiment en Darija ?", content: "Oui, Daria est conçue pour converser naturellement en Darija." },
|
||||
{ id: "2", title: "Je dois connaître l'arabe pour utiliser Daria ?", content: "Pas du tout, Daria t'accompagne en français." },
|
||||
{ id: "3", title: "Est-ce que l'app fonctionne sur mobile ?", content: "Oui, elle est parfaitement adaptée aux smartphones." },
|
||||
{ id: "4", title: "Comment fonctionne la correction de prononciation ?", content: "Notre IA analyse ton audio et te donne des feedbacks précis." },
|
||||
{ id: "5", title: "Puis-je annuler mon abonnement ?", content: "Tu peux annuler à tout moment dans tes paramètres." }
|
||||
]}
|
||||
title="Des questions ?"
|
||||
description="Nous avons les réponses pour toi."
|
||||
faqsAnimation="blur-reveal"
|
||||
imageSrc="http://img.b2bpic.net/free-vector/virtual-education-composition_1284-15818.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="final-cta" data-section="final-cta">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Prêt pour l'aventure ?"
|
||||
title="Prête à parler Darija ? Daria t'attend."
|
||||
description="Sans carte bancaire. Sans engagement."
|
||||
buttonText="Commencer gratuitement"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Daria"
|
||||
columns={[
|
||||
{ title: "Daria", items: [{ label: "Blog", href: "#" }, { label: "Contact", href: "#" }] },
|
||||
{ title: "Légal", items: [{ label: "Confidentialité", href: "#" }, { label: "CGU", href: "#" }] }
|
||||
]}
|
||||
copyrightText="Fait avec ❤️ pour les amoureux du Maroc"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardTwo
|
||||
plans={[]}
|
||||
animationType="slide-up"
|
||||
title="Transparent Pricing"
|
||||
description="Choose the plan that best fits your growing needs."
|
||||
textboxLayout="default"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
faqs={[]}
|
||||
faqsAnimation="slide-up"
|
||||
title="Frequently Asked Questions"
|
||||
description="Find answers to common questions about our platform."
|
||||
textboxLayout="default"
|
||||
/>
|
||||
</div>
|
||||
<div id="final-cta" data-section="final-cta">
|
||||
<ContactCenter
|
||||
tag="Get Started"
|
||||
title="Ready to boost your productivity?"
|
||||
description="Join us today and start your journey towards efficient workflows."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Webild"
|
||||
columns={[]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user