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,37 @@
+'use client'
+import React from 'react'
+import { motion } from 'framer-motion'
+import Link from 'next/link'
+import type { Page } from '../../payload-types'
+
+type Props = Extract<NonNullable<Page['layout']>[0], { blockType: 'affiliation' }>
+
+export const AffiliationBlock: React.FC<Props> = ({ title, description, logo, linkText }) => {
+  return (
+    <section className="py-24 bg-slate-50 border-t border-slate-200">
+      <div className="container mx-auto px-4 max-w-4xl">
+        <motion.div 
+          initial={{ opacity: 0, y: 20 }}
+          whileInView={{ opacity: 1, y: 0 }}
+          viewport={{ once: true }}
+          className="bg-white p-8 md:p-12 rounded-2xl shadow-sm border border-slate-100 flex flex-col md:flex-row items-center gap-10"
+        >
+          <div className="flex-1 text-center md:text-left">
+            <h2 className="text-2xl md:text-3xl font-bold text-slate-900 mb-4">{title}</h2>
+            <p className="text-slate-600 mb-6 leading-relaxed text-sm md:text-base">{description}</p>
+            {linkText && (
+              <Link href="/stowarzyszenie" className="text-blue-600 font-semibold hover:text-blue-700 underline underline-offset-4">
+                {linkText}
+              </Link>
+            )}
+          </div>
+          {logo && typeof logo === 'object' && logo.url && (
+            <div className="w-48 shrink-0 flex items-center justify-center">
+              <img src={logo.url} alt={logo.alt || "Logo stowarzyszenia"} className="max-w-full h-auto grayscale hover:grayscale-0 transition-all duration-300" />
+            </div>
+          )}
+        </motion.div>
+      </div>
+    </section>
+  )
+}