12-05-2026 Frontend dev

This commit is contained in:
Kevin Adametz 2026-05-12 18:32:33 +02:00
parent 405df0a122
commit 313270b55f
777 changed files with 67136 additions and 6241 deletions

View file

@ -0,0 +1,76 @@
@props([
'topics' => null,
'subscribers' => 84000,
])
@php
$themeKey = config('app.theme');
$topics ??= config('domains.domains.'.$themeKey.'.brand.newsletter_topics', [
['name' => 'Tageszusammenfassung', 'meta' => 'Mo–Fr · 07:00 Uhr', 'active' => true],
['name' => 'Wochenrückblick', 'meta' => 'Sonntags · 18:00 Uhr', 'active' => false],
['name' => 'Energie & Klima', 'meta' => 'ab Content-Score 80 · max. 2× pro Woche', 'active' => true],
['name' => 'IPO & M&A', 'meta' => 'ausgewählt von der Redaktion · ca. 3–5 Mails/Monat', 'active' => false],
]);
@endphp
<section id="newsletter" class="max-w-layout mx-auto px-8 mt-16">
<div class="relative overflow-hidden bg-topbar-grad text-ink-on-dark p-12 px-14">
<svg width="280" height="280" viewBox="0 0 280 280" class="absolute -right-10 -top-10 opacity-[0.06]" aria-hidden="true">
<circle cx="140" cy="140" r="120" stroke="white" stroke-width="1" fill="none" />
<circle cx="140" cy="140" r="80" stroke="white" stroke-width="1" fill="none" />
<circle cx="140" cy="140" r="40" stroke="white" stroke-width="1" fill="none" />
</svg>
<div class="relative grid gap-12 grid-cols-1 lg:grid-cols-[1.1fr_1fr]">
<div>
<div class="eyebrow on-dark mb-3">Bleiben Sie informiert</div>
<h2 class="font-serif text-[30px] font-semibold m-0 leading-[1.18] tracking-[-0.4px] mb-3.5 max-w-[460px] text-white">
Pressemeldungen, kuratiert in Ihren Posteingang
</h2>
<p class="text-[14px] leading-[1.55] text-white/70 max-w-[440px] m-0 mb-6">
Die wichtigsten Meldungen aus DACH — täglich, wöchentlich oder branchenspezifisch. Keine Werbung, jederzeit kündbar.
</p>
<form action="#newsletter-subscribe" method="post" class="flex mb-3.5 max-w-[460px]">
@csrf
<label class="sr-only" for="newsletter-email">E-Mail-Adresse</label>
<input id="newsletter-email" type="email" name="email" required
placeholder="Ihre E-Mail-Adresse"
class="flex-1 px-4 py-3.5 text-[14px] bg-white/[0.08] border border-white/[0.18] text-white outline-none rounded-none placeholder-white/40 focus:border-brand focus:ring-0">
<button type="submit"
class="px-[22px] py-3.5 text-[13px] font-semibold bg-brand text-white whitespace-nowrap rounded-none cursor-pointer hover:bg-brand-deep transition-colors">
Kostenlos abonnieren →
</button>
</form>
<div class="text-[11px] text-white/50">
Über {{ number_format($subscribers, 0, ',', '.') }} Abonnenten · Datenschutz nach DSGVO
</div>
</div>
<div class="flex flex-col gap-2.5 self-stretch">
@foreach ($topics as $topic)
<label class="flex items-start gap-3.5 px-4 py-3.5 cursor-pointer transition-colors
{{ ($topic['active'] ?? false) ? 'bg-white/[0.06] border border-brand/40 hover:bg-white/[0.1]' : 'border border-white/10 hover:border-white/30 hover:bg-white/[0.04]' }}">
@if ($topic['active'] ?? false)
<span class="w-[18px] h-[18px] flex-shrink-0 mt-0.5 bg-brand border border-brand flex items-center justify-center">
<svg width="10" height="10" viewBox="0 0 12 12" fill="none" aria-hidden="true">
<path d="M2 6l3 3 5-6" stroke="white" stroke-width="2" />
</svg>
</span>
@else
<span class="w-[18px] h-[18px] flex-shrink-0 mt-0.5 border border-white/30"></span>
@endif
<div class="flex-1">
<div class="text-[13.5px] font-semibold text-white">{{ $topic['name'] }}</div>
<div class="text-[11.5px] text-white/55 mt-0.5">{{ $topic['meta'] }}</div>
</div>
<input type="checkbox" name="topics[]" value="{{ \Illuminate\Support\Str::slug($topic['name']) }}"
{{ ($topic['active'] ?? false) ? 'checked' : '' }} class="sr-only">
</label>
@endforeach
</div>
</div>
</div>
</section>