Kevin Adametz
9875e7b6e1
Ersetzt den TODO-Platzhalter: Name/E-Mail/Nachricht, Honeypots, Erfolgs-Flash statt Formular nach Versand, Datenschutz-Hinweis. Styling analog legal-request. Telefon/Adresse sind weiterhin Platzhalterdaten (R3.2, [EXTERN]). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
145 lines
8.3 KiB
PHP
145 lines
8.3 KiB
PHP
@extends('web.layouts.web-master')
|
||
|
||
@section('title', 'Kontakt')
|
||
@section('meta_description', 'Kontaktieren Sie uns per E-Mail, Telefon oder vor Ort – wir helfen Ihnen gerne weiter.')
|
||
|
||
@php
|
||
$brand = config('domains.domains.'.config('app.theme').'.brand', []);
|
||
$brandLabel = ($brand['name'] ?? 'businessportal').($brand['accent'] ?? '');
|
||
$contactEmail = $brand['contact_email'] ?? 'info@businessportal.de';
|
||
|
||
$contactMethods = [
|
||
['label' => 'E-Mail', 'value' => $contactEmail, 'href' => 'mailto:'.$contactEmail, 'note' => 'Antwort i. d. R. innerhalb von 24 Stunden'],
|
||
['label' => 'Telefon', 'value' => '+49 89 1234 5678', 'href' => 'tel:+498912345678', 'note' => 'Mo–Fr 9:00–18:00 Uhr'],
|
||
['label' => 'Adresse', 'value' => 'Maximilianstraße 35', 'href' => null, 'note' => '80539 München, Deutschland'],
|
||
['label' => 'Geschäftszeiten', 'value' => 'Mo–Fr 9:00–18:00', 'href' => null, 'note' => 'Sa–So geschlossen'],
|
||
];
|
||
@endphp
|
||
|
||
@section('content')
|
||
<x-web.static-page
|
||
eyebrow="Kontakt"
|
||
title="Kontakt"
|
||
lead="Wir sind für Sie da – per E-Mail, Telefon oder vor Ort in München. Wählen Sie den Weg, der Ihnen am besten passt."
|
||
breadcrumb="Kontakt"
|
||
>
|
||
{{-- Kontaktwege --}}
|
||
<div class="grid gap-px bg-bg-rule border border-bg-rule grid-cols-1 sm:grid-cols-2 lg:grid-cols-4">
|
||
@foreach ($contactMethods as $method)
|
||
<div class="bg-bg p-6">
|
||
<div class="eyebrow muted mb-2">{{ $method['label'] }}</div>
|
||
@if ($method['href'])
|
||
<a href="{{ $method['href'] }}" class="text-[15px] font-semibold text-ink hover:text-brand transition-colors break-words">{{ $method['value'] }}</a>
|
||
@else
|
||
<div class="text-[15px] font-semibold text-ink break-words">{{ $method['value'] }}</div>
|
||
@endif
|
||
<p class="text-[12px] text-ink-3 mt-1 mb-0">{{ $method['note'] }}</p>
|
||
</div>
|
||
@endforeach
|
||
</div>
|
||
|
||
{{-- Besuch / Anfahrt --}}
|
||
<div class="grid gap-8 lg:grid-cols-[1.2fr_1fr] mt-12">
|
||
<div class="pm-body">
|
||
<h2>Schreiben Sie uns</h2>
|
||
<p>
|
||
Haben Sie Fragen oder benötigen Sie Unterstützung? Schreiben Sie uns direkt an
|
||
<a href="mailto:{{ $contactEmail }}">{{ $contactEmail }}</a> – unser Team meldet sich
|
||
schnellstmöglich bei Ihnen zurück. Für häufige Fragen lohnt sich vorab ein Blick in unsere
|
||
<a href="{{ route('faq') }}">FAQ</a> oder das <a href="{{ route('hilfe') }}">Hilfe-Center</a>.
|
||
</p>
|
||
|
||
@if (session('contact-status'))
|
||
<div class="px-4 py-3 border border-bg-rule bg-bg-elev text-[13px] text-ink leading-relaxed mb-6" role="status">
|
||
{{ session('contact-status') }}
|
||
</div>
|
||
@else
|
||
<form method="POST" action="{{ route('kontakt.store') }}" class="space-y-5 mb-8" novalidate>
|
||
@csrf
|
||
|
||
<div class="grid gap-5 sm:grid-cols-2">
|
||
<div>
|
||
<label for="contact-name" class="block text-[12px] font-semibold text-ink mb-1.5">Ihr Name</label>
|
||
<input id="contact-name" type="text" name="name" value="{{ old('name') }}" required
|
||
autocomplete="name"
|
||
class="w-full border border-bg-rule px-3 py-2.5 text-[13px] bg-white text-ink focus:outline-none focus:border-brand" />
|
||
@error('name')
|
||
<p class="mt-1 text-[12px] text-red-600">{{ $message }}</p>
|
||
@enderror
|
||
</div>
|
||
|
||
<div>
|
||
<label for="contact-email" class="block text-[12px] font-semibold text-ink mb-1.5">E-Mail-Adresse</label>
|
||
<input id="contact-email" type="email" name="email" value="{{ old('email') }}" required
|
||
autocomplete="email"
|
||
class="w-full border border-bg-rule px-3 py-2.5 text-[13px] bg-white text-ink focus:outline-none focus:border-brand" />
|
||
@error('email')
|
||
<p class="mt-1 text-[12px] text-red-600">{{ $message }}</p>
|
||
@enderror
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<label for="contact-message" class="block text-[12px] font-semibold text-ink mb-1.5">Ihre Nachricht</label>
|
||
<textarea id="contact-message" name="message" rows="6" required
|
||
class="w-full border border-bg-rule px-3 py-2.5 text-[13px] bg-white text-ink focus:outline-none focus:border-brand"
|
||
placeholder="Wie können wir Ihnen helfen?">{{ old('message') }}</textarea>
|
||
@error('message')
|
||
<p class="mt-1 text-[12px] text-red-600">{{ $message }}</p>
|
||
@enderror
|
||
</div>
|
||
|
||
{{-- Bot-Schutz: versteckte Honeypot-Felder (siehe legal-request). --}}
|
||
<div class="hidden" aria-hidden="true">
|
||
<label for="contact-website">Website</label>
|
||
<input id="contact-website" type="text" name="website" tabindex="-1" autocomplete="off" value="{{ old('website') }}" />
|
||
<label for="contact-homepage">Homepage</label>
|
||
<input id="contact-homepage" type="text" name="homepage" tabindex="-1" autocomplete="off" value="{{ old('homepage') }}" />
|
||
</div>
|
||
|
||
<button type="submit"
|
||
class="bg-brand hover:bg-brand-deep text-white px-5 py-2.5 text-[13px] font-semibold transition-colors">
|
||
Nachricht senden
|
||
</button>
|
||
|
||
<p class="text-[11.5px] text-ink-3 leading-relaxed">
|
||
Ihre Angaben werden ausschließlich zur Bearbeitung Ihrer Anfrage verarbeitet.
|
||
Weitere Informationen in der
|
||
<a href="{{ route('datenschutz') }}" class="underline hover:text-ink">Datenschutzerklärung</a>.
|
||
</p>
|
||
</form>
|
||
@endif
|
||
|
||
<h3>Anfahrt</h3>
|
||
<p>
|
||
<strong>Öffentliche Verkehrsmittel:</strong> U-Bahn U4/U5 – Haltestelle Lehel; Tram 19 –
|
||
Haltestelle Maxmonument.<br>
|
||
<strong>Parken:</strong> Parkhaus Maximilianstraße (5 Min. Fußweg).
|
||
</p>
|
||
</div>
|
||
|
||
<aside class="border border-bg-rule bg-bg-elev p-6 h-max">
|
||
<div class="eyebrow muted mb-3">Hauptsitz</div>
|
||
<p class="text-[13.5px] leading-[1.6] text-ink-2 m-0">
|
||
{{ $brandLabel }}<br>
|
||
Maximilianstraße 35<br>
|
||
80539 München<br>
|
||
Deutschland
|
||
</p>
|
||
<div class="mt-5 pt-5 border-t border-bg-rule">
|
||
<div class="eyebrow muted mb-2">Schnelle Hilfe</div>
|
||
<p class="text-[12.5px] text-ink-3 m-0 mb-3">
|
||
Antworten auf die häufigsten Fragen finden Sie sofort online.
|
||
</p>
|
||
<a href="{{ route('faq') }}"
|
||
class="inline-flex items-center gap-1.5 px-4 py-2 text-[12.5px] font-semibold text-ink border border-bg-rule-strong hover:bg-bg transition-colors rounded-[2px]">
|
||
Zur FAQ
|
||
<svg width="11" height="11" viewBox="0 0 12 12" fill="none" aria-hidden="true">
|
||
<path d="M2 6h8M6 2l4 4-4 4" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" />
|
||
</svg>
|
||
</a>
|
||
</div>
|
||
</aside>
|
||
</div>
|
||
</x-web.static-page>
|
||
@endsection
|