Add src/app/pricing/page.tsx

2026-03-07 15:59:15 +00:00
parent 0db01d35df
commit 0fa55e3f2a
1 changed files with 112 additions and 0 deletions
--- a/src/app/pricing/page.tsx
+++ b/src/app/pricing/page.tsx
@@ -0,0 +1,112 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
+import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FooterCard from '@/components/sections/footer/FooterCard';
+
+export default function PricingPage() {
+  const navItems = [
+    { name: "Services", id: "services" },
+    { name: "Processus", id: "how-it-works" },
+    { name: "Avantages", id: "why-us" },
+    { name: "Portfolio", id: "portfolio" },
+    { name: "Tarifs", id: "/pricing" },
+    { name: "À propos", id: "/about" },
+    { name: "Contact", id: "contact" }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="expand-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="small"
+      sizing="largeSmall"
+      background="none"
+      cardStyle="layered-gradient"
+      primaryButtonStyle="shadow"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          brandName="AR Agency"
+          navItems={navItems}
+        />
+      </div>
+
+      <div id="hero" data-section="hero">
+        <HeroLogoBillboard
+          logoText="Nos Tarifs"
+          description="Des solutions de pricing flexible adaptées à votre budget. Pas de frais cachés, transparence totale. Choisissez le plan qui correspond à vos besoins."
+          buttons={[
+            { text: "Obtenir une démo gratuite", href: "#contact" },
+            { text: "Retour à l'accueil", href: "/" }
+          ]}
+          buttonAnimation="slide-up"
+          background={{ variant: "sparkles-gradient" }}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AciGvoDigUmzMgk3PnylSVK1dY/a-modern-professional-ai-dashboard-inter-1772898422231-4613cf05.png?_wi=1"
+          imageAlt="Plans tarifaires AR Agency"
+          mediaAnimation="blur-reveal"
+          frameStyle="card"
+        />
+      </div>
+
+      <div id="pricing" data-section="pricing">
+        <PricingCardNine
+          title="Plans d'Automatisation AI"
+          description="Choisissez le plan parfait pour votre business. Tous les plans incluent support technique et formation."
+          tag="Tarification"
+          plans={[
+            {
+              id: "starter",              title: "Starter",              price: "500",              period: "DT/mois",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AciGvoDigUmzMgk3PnylSVK1dY/a-sleek-professional-website-mockup-show-1772898422074-d206bf8e.jpg?_wi=1",              imageAlt: "Plan Starter",              button: { text: "Commencer", href: "#contact" },
+              features: [
+                "Site web professionnel basique",                "1 intégration AI simple",                "Support email",                "Démo et formation incluses"
+              ]
+            },
+            {
+              id: "growth",              title: "Growth",              price: "1 200",              period: "DT/mois",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AciGvoDigUmzMgk3PnylSVK1dY/a-smartphone-screen-showing-a-whatsapp-c-1772898421717-be971071.png",              imageAlt: "Plan Growth",              button: { text: "Choisir Growth", href: "#contact" },
+              features: [
+                "Site web professionnel avancé",                "Agent WhatsApp IA",                "Système de réservation automatisé",                "Support prioritaire",                "Rapport mensuel"
+              ]
+            },
+            {
+              id: "enterprise",              title: "Enterprise",              price: "2 500",              period: "DT/mois",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AciGvoDigUmzMgk3PnylSVK1dY/a-modern-booking-system-interface-showin-1772898421350-3afff789.png",              imageAlt: "Plan Enterprise",              button: { text: "Solutions Personnalisées", href: "#contact" },
+              features: [
+                "Suite complète d'automatisation",                "Multiples agents AI",                "Intégrations illimitées",                "Support 24/7 dédié",                "Optimisation continue",                "Rapports analytiques avancés"
+              ]
+            }
+          ]}
+          animationType="slide-up"
+          title="Plans d'Automatisation AI"
+          description="Choisissez le plan parfait pour votre business"
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactCenter
+          tag="Prêt à démarrer?"
+          title="Prêt à automatiser votre business?"
+          description="Parlez à un expert AR Agency dès aujourd'hui. Une démo personnalisée vous attend, sans engagement, 100% gratuite."
+          background={{ variant: "downward-rays-animated" }}
+          useInvertedBackground={true}
+          inputPlaceholder="votre@email.com"
+          buttonText="Parler à un expert"
+          termsText="En cliquant, vous acceptez que nous vous contactions par email ou WhatsApp pour discuter de vos besoins. Aucun spam, juste une vraie conversation."
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="AR Agency"
+          copyrightText="© 2025 AR Agency | Automatisation AI pour PME Tunisiennes"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}