soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add marketing motion reveals to blog and occasions

Browse Source
This commit is contained in:
Codex Agent
2026-01-21 15:22:39 +01:00
parent 5eb0941512
commit a01a7ec399
16 changed files with 1869 additions and 781 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
resources/js/pages/marketing/Kontakt.tsx
View File

@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
import { useLocalizedRoutes } from '@/hooks/useLocalizedRoutes';
import MarketingLayout from '@/layouts/mainWebsite';
import { Loader2, CheckCircle2 } from 'lucide-react';
import { motion, useReducedMotion } from 'framer-motion';
const Kontakt: React.FC = () => {
const { data, setData, post, processing, errors, reset } = useForm({
@@ -16,6 +17,7 @@ const Kontakt: React.FC = () => {
const { flash } = usePage<{ flash?: { success?: string } }>().props;
const { t } = useTranslation('marketing');
const { localizedPath } = useLocalizedRoutes();
const shouldReduceMotion = useReducedMotion();
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
@@ -34,7 +36,12 @@ const Kontakt: React.FC = () => {
<MarketingLayout title={t('kontakt.title')}>
<Head title={t('kontakt.title')} />
<div className="min-h-screen bg-gray-50 dark:bg-gray-900 py-12 px-4 sm:px-6 lg:px-8">
<div className="max-w-2xl mx-auto">
<motion.div
className="max-w-2xl mx-auto"
initial={shouldReduceMotion ? false : { opacity: 0, y: 16 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5, ease: [0.22, 1, 0.36, 1] }}
>
<h1 className="text-3xl font-bold text-center mb-8 font-display text-gray-900 dark:text-gray-100">{t('kontakt.title')}</h1>
<p className="text-center text-gray-600 dark:text-gray-300 mb-8 font-sans-marketing">{t('kontakt.description')}</p>
{flash?.success && (
@@ -120,7 +127,7 @@ const Kontakt: React.FC = () => {
<div className="mt-8 text-center">
<Link href={localizedPath('/')} className="text-[#FFB6C1] hover:underline font-sans-marketing">{t('kontakt.back_home')}</Link>
</div>
</div>
</motion.div>
</div>
</MarketingLayout>
);