integration vom Blog-plugin, hübschere webseite,

This commit is contained in:
Codex Agent
2025-09-26 17:41:17 +02:00
parent 492b9b9fd1
commit 6fc36ebaf4
31 changed files with 22823 additions and 96 deletions

View File

@@ -0,0 +1,137 @@
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fotospiel - {{ ucfirst($type) }} Occasion</title>
<meta name="description" content="Fotospiel für {{ ucfirst($type) }}: Sammle Gastfotos mit QR-Codes.">
<link rel="icon" href="{{ asset('logo.svg') }}" type="image/svg+xml">
@vite(['resources/css/app.css'])
</head>
<body class="bg-gray-50 text-gray-900">
<!-- Shared Header (kopiert aus marketing, vereinfacht) -->
<header class="bg-white shadow-md sticky top-0 z-50">
<div class="container mx-auto px-4 py-4 flex items-center justify-between">
<div class="flex items-center space-x-2">
<a href="/marketing" class="text-2xl font-bold text-gray-900">Fotospiel</a>
<svg class="w-6 h-6 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z"></path><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 13a3 3 0 11-6 0 3 3 0 016 0z"></path></svg>
</div>
<nav class="hidden md:flex space-x-6">
<a href="/marketing#how-it-works" class="text-gray-600 hover:text-gray-900">How it works</a>
<a href="/marketing#features" class="text-gray-600 hover:text-gray-900">Features</a>
<div class="relative">
<button class="text-gray-600 hover:text-gray-900">Occasions</button>
<div class="absolute top-full left-0 mt-2 bg-white border rounded shadow-lg">
<a href="/occasions/weddings" class="block px-4 py-2 text-gray-600 hover:text-gray-900">Weddings</a>
<a href="/occasions/birthdays" class="block px-4 py-2 text-gray-600 hover:text-gray-900">Birthdays</a>
<a href="/occasions/corporate-events" class="block px-4 py-2 text-gray-600 hover:text-gray-900">Corporate Events</a>
<a href="/occasions/family-celebrations" class="block px-4 py-2 text-gray-600 hover:text-gray-900">Family Celebrations</a>
</div>
</div>
<a href="/blog" class="text-gray-600 hover:text-gray-900">Blog</a>
<a href="/marketing#pricing" class="text-gray-600 hover:text-gray-900">Pricing</a>
<a href="/marketing#contact" class="text-gray-600 hover:text-gray-900">Contact</a>
</nav>
<a href="/buy-credits/basic" class="bg-[#FFB6C1] text-white px-6 py-2 rounded-full font-semibold">Jetzt starten</a>
</div>
</header>
<!-- Hero for Occasion -->
<section class="bg-gradient-to-r from-[#FFB6C1] via-[#FFD700] to-[#87CEEB] text-white py-20 px-4">
<div class="container mx-auto text-center">
<h1 class="text-4xl md:text-6xl font-bold mb-4">Fotospiel für {{ ucfirst($type) }}</h1>
<p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">Sammle unvergessliche Fotos von deinen Gästen mit QR-Codes. Perfekt für {{ ucfirst($type) }} einfach, mobil und datenschutzkonform.</p>
<a href="/buy-credits/basic" class="bg-white text-[#FFB6C1] px-8 py-4 rounded-full font-semibold text-lg hover:bg-gray-100 transition">Event starten</a>
</div>
</section>
<!-- Occasion Specific Content -->
<section class="py-20 px-4 bg-white">
<div class="container mx-auto max-w-4xl">
@if($type === 'weddings')
<h2 class="text-3xl font-bold text-center mb-12">Hochzeiten mit Fotospiel</h2>
<p class="text-lg mb-8 text-center">Erfange romantische Momente: Gäste teilen Fotos via QR, wähle Emotions wie 'Romantisch' oder 'Fröhlich'. Besser als traditionelle Fotoboxen.</p>
<div class="grid md:grid-cols-2 gap-8">
<div>
<img src="https://images.unsplash.com/photo-1515934751635-c81c6bc9a2d8?w=600&h=400&fit=crop" alt="Hochzeitsfotos" class="rounded-lg shadow-lg">
</div>
<div class="space-y-4">
<h3 class="text-2xl font-semibold">Vorteile für Hochzeiten</h3>
<ul class="space-y-2">
<li> QR-Code für Gäste: Einfaches Teilen ohne App-Download.</li>
<li> Emotion-Filter: Kategorisiere Fotos (z.B. 'Tanz', 'Kuss').</li>
<li> Private Galerie: Nur freigegebene Fotos sichtbar.</li>
<li> Download: Hochauflösend für Album.</li>
</ul>
</div>
</div>
@elseif($type === 'birthdays')
<h2 class="text-3xl font-bold text-center mb-12">Geburtstage feiern</h2>
<p class="text-lg mb-8 text-center">Lass Freunde und Familie spontane Fotos teilen. QR auf der Torte Spaß garantiert!</p>
<div class="grid md:grid-cols-2 gap-8">
<div>
<img src="https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=600&h=400&fit=crop" alt="Geburtstagsfotos" class="rounded-lg shadow-lg">
</div>
<div class="space-y-4">
<h3 class="text-2xl font-semibold">Vorteile für Geburtstage</h3>
<ul class="space-y-2">
<li> Schnelle Uploads: Kamera oder Galerie.</li>
<li> Likes & Shares: Beliebte Momente hervorheben.</li>
<li> Offline-fähig: PWA funktioniert ohne Internet.</li>
<li> Anonym: Keine Registrierung nötig.</li>
</ul>
</div>
</div>
@elseif($type === 'corporate-events')
<h2 class="text-3xl font-bold text-center mb-12">Firmenevents professionell</h2>
<p class="text-lg mb-8 text-center">Netzwerken und Team-Building: Sammle Fotos zentral, teile Highlights intern.</p>
<div class="grid md:grid-cols-2 gap-8">
<div>
<img src="https://images.unsplash.com/photo-1521737604893-d14cc237f11d?w=600&h=400&fit=crop" alt="Firmenevent-Fotos" class="rounded-lg shadow-lg">
</div>
<div class="space-y-4">
<h3 class="text-2xl font-semibold">Vorteile für Firmenevents</h3>
<ul class="space-y-2">
<li> QR an Ständen: Gäste fotografieren sich selbst.</li>
<li> Kategorien: 'Team', 'Netzwerk', 'Präsentation'.</li>
<li> Export: Für Social Media oder Intranet.</li>
<li> GDPR-sicher: Keine PII gespeichert.</li>
</ul>
</div>
</div>
@elseif($type === 'family-celebrations')
<h2 class="text-3xl font-bold text-center mb-12">Familienfeiern</h2>
<p class="text-lg mb-8 text-center">Von Taufen bis Jubiläen: Sammle Erinnerungen von allen Verwandten.</p>
<div class="grid md:grid-cols-2 gap-8">
<div>
<img src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=600&h=400&fit=crop" alt="Familienfotos" class="rounded-lg shadow-lg">
</div>
<div class="space-y-4">
<h3 class="text-2xl font-semibold">Vorteile für Familienfeiern</h3>
<ul class="space-y-2">
<li> Einfach für alle Altersgruppen: Große Buchstaben, Touch-freundlich.</li>
<li> Emotionen: 'Familie', 'Glück', 'Zusammenhalt'.</li>
<li> Teilen: Per Link oder QR für Nachfeier.</li>
<li> Unbegrenzt: Im Premium-Tarif.</li>
</ul>
</div>
</div>
@else
<p class="text-center">Occasion nicht gefunden. <a href="/marketing">Zurück zur Startseite</a>.</p>
@endif
</div>
</section>
<!-- Footer (kopiert aus marketing) -->
<footer class="bg-gray-800 text-white py-8 px-4 mt-20">
<div class="container mx-auto text-center">
<p>&copy; 2025 Fotospiel GmbH. Alle Rechte vorbehalten.</p>
<div class="mt-4 space-x-4">
<a href="/impressum" class="hover:text-[#FFB6C1]">Impressum</a>
<a href="/datenschutz" class="hover:text-[#FFB6C1]">Datenschutz</a>
<a href="/marketing#contact" class="hover:text-[#FFB6C1]">Kontakt</a>
</div>
</div>
</footer>
</body>
</html>