feat: implement homepage blocks, animations and sticky whatsapp CTA

2026-08-31 23:04:48 +02:00
parent d728108b3e
commit 0a1e74dbe4
26 changed files with 1056 additions and 43 deletions
@@ -0,0 +1,50 @@
+'use client'
+import React from 'react'
+import { motion } from 'framer-motion'
+import type { Page } from '../../payload-types'
+
+type Props = Extract<NonNullable<Page['layout']>[0], { blockType: 'finalCta' }>
+
+export const FinalCTABlock: React.FC<Props> = ({ title, subtitle, buttonText }) => {
+  return (
+    <section className="py-32 bg-blue-600 text-white text-center">
+      <div className="container mx-auto px-4 max-w-3xl">
+        <motion.h2 
+          initial={{ opacity: 0, scale: 0.95 }}
+          whileInView={{ opacity: 1, scale: 1 }}
+          viewport={{ once: true }}
+          transition={{ duration: 0.5 }}
+          className="text-4xl md:text-5xl font-bold mb-6"
+        >
+          {title}
+        </motion.h2>
+        {subtitle && (
+          <motion.p 
+            initial={{ opacity: 0, y: 10 }}
+            whileInView={{ opacity: 1, y: 0 }}
+            viewport={{ once: true }}
+            transition={{ duration: 0.5, delay: 0.1 }}
+            className="text-xl md:text-2xl text-blue-100 mb-12"
+          >
+            {subtitle}
+          </motion.p>
+        )}
+        <motion.div
+          initial={{ opacity: 0, y: 10 }}
+          whileInView={{ opacity: 1, y: 0 }}
+          viewport={{ once: true }}
+          transition={{ duration: 0.5, delay: 0.2 }}
+        >
+          <a 
+            href={process.env.NEXT_PUBLIC_WHATSAPP_LINK || '#'}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="inline-block px-10 py-5 bg-green-500 hover:bg-green-400 text-white text-lg font-bold rounded-xl transition-transform hover:scale-105 shadow-lg shadow-green-500/30"
+          >
+            {buttonText}
+          </a>
+        </motion.div>
+      </div>
+    </section>
+  )
+}