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

Fix auth form errors and redirects: Add React keys/useEffects for error rendering and scroll, Inertia::location in controllers for SPA navigation, extend RegistrationTest and add E2E. Update docs (changes/2025-10-02-registration-fixes.md, prp/13-backend-authentication.md). Add new UI components (accordion, carousel, progress, table, tabs), marketing/legal pages (Blog, Kontakt, Datenschutz, etc.), fonts, user migration (remove_name), views/css/package updates, seeders/factories.

Browse Source
This commit is contained in:
Codex Agent
2025-10-02 11:40:48 +02:00
parent 1945f664c6
commit 7475210893
101 changed files with 3406 additions and 376 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
resources/js/layouts/MarketingLayout.tsx Normal file
View File

@@ -0,0 +1,108 @@
import React from 'react';
import { Link } from '@inertiajs/react';
import { usePage } from '@inertiajs/react';
interface MarketingLayoutProps {
children: React.ReactNode;
title?: string;
}
const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) => {
const { props } = usePage();
const { auth } = props as any;
return (
<div className="min-h-screen flex flex-col bg-gray-50">
{/* Header */}
<header className="bg-white shadow-sm border-b border-gray-200">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex justify-between items-center py-4">
{/* Logo */}
<Link href="/marketing" className="text-2xl font-bold font-display text-pink-500">
FotoSpiel
</Link>
{/* Navigation */}
<nav className="hidden md:flex space-x-8">
<Link href="/marketing" className="text-gray-700 hover:text-pink-500 font-sans-marketing transition-colors">
Home
</Link>
<Link href="/marketing/packages" className="text-gray-700 hover:text-pink-500 font-sans-marketing transition-colors">
Pakete
</Link>
<Link href="/marketing/blog" className="text-gray-700 hover:text-pink-500 font-sans-marketing transition-colors">
Blog
</Link>
<Link href="/marketing/occasions" className="text-gray-700 hover:text-pink-500 font-sans-marketing transition-colors">
Anlässe
</Link>
{auth.user ? (
<Link href="/dashboard" className="text-gray-700 hover:text-pink-500 font-sans-marketing transition-colors">
Dashboard
</Link>
) : (
<Link href="/marketing/register" className="text-gray-700 hover:text-pink-500 font-sans-marketing transition-colors">
Registrieren
</Link>
)}
</nav>
{/* Mobile Menu Button – TODO: Implementiere Dropdown */}
<div className="md:hidden">
<button className="text-gray-700 hover:text-pink-500">☰</button>
</div>
</div>
</div>
</header>
{/* Main Content */}
<main className="flex-grow">
{title && (
<title>{title}</title>
)}
{children}
</main>
{/* Footer */}
<footer className="bg-white border-t border-gray-200 mt-auto">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div className="grid grid-cols-1 md:grid-cols-4 gap-8">
<div className="col-span-1 md:col-span-2">
<Link href="/marketing" className="text-2xl font-bold font-display text-pink-500">
FotoSpiel
</Link>
<p className="text-gray-600 font-sans-marketing mt-2">
Deine Plattform für Event-Fotos.
</p>
</div>
<div>
<h3 className="font-semibold font-display text-gray-900 mb-4">Rechtliches</h3>
<ul className="space-y-2 text-sm text-gray-600 font-sans-marketing">
<li><Link href="/legal/impressum" className="hover:text-pink-500">Impressum</Link></li>
<li><Link href="/legal/datenschutz" className="hover:text-pink-500">Datenschutz</Link></li>
<li><Link href="/legal/agb" className="hover:text-pink-500">AGB</Link></li>
<li><Link href="/legal/kontakt" className="hover:text-pink-500">Kontakt</Link></li>
</ul>
</div>
<div>
<h3 className="font-semibold font-display text-gray-900 mb-4">Social</h3>
<ul className="space-y-2 text-sm text-gray-600 font-sans-marketing">
<li><a href="#" className="hover:text-pink-500">Instagram</a></li>
<li><a href="#" className="hover:text-pink-500">Facebook</a></li>
<li><a href="#" className="hover:text-pink-500">YouTube</a></li>
</ul>
</div>
</div>
<div className="border-t border-gray-200 mt-8 pt-8 text-center text-sm text-gray-500 font-sans-marketing">
&copy; 2025 FotoSpiel. Alle Rechte vorbehalten.
</div>
</div>
</footer>
</div>
);
};
export default MarketingLayout;

45
resources/js/layouts/marketing/MarketingLayout.tsx Normal file
View File

@@ -0,0 +1,45 @@
import React, { ReactNode } from 'react';
import { Head } from '@inertiajs/react';
import MarketingHeader from '@/components/marketing/MarketingHeader';
import MarketingFooter from '@/components/marketing/MarketingFooter';
interface MarketingLayoutProps {
children: ReactNode;
title?: string;
description?: string;
}
const MarketingLayout: React.FC<MarketingLayoutProps> = ({
children,
title = 'Fotospiel - Event-Fotos einfach und sicher mit QR-Codes',
description = 'Sammle Gastfotos für Events mit QR-Codes und unserer PWA-Plattform. Für Hochzeiten, Firmenevents und mehr. Kostenloser Einstieg.'
}) => {
return (
<>
<Head>
<title>{title}</title>
<meta name="description" content={description} />
<style>{`
@keyframes aurora {
0%, 100% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
}
.bg-aurora {
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
background-size: 400% 400%;
animation: aurora 15s ease infinite;
}
`}</style>
</Head>
<div className="bg-gray-50 text-gray-900 min-h-screen flex flex-col font-sans antialiased">
<MarketingHeader />
<main className="flex-grow">
{children}
</main>
<MarketingFooter />
</div>
</>
);
};
export default MarketingLayout;