b2in/resources/views/livewire/reg/thank-you.blade.php
2026-01-23 17:33:10 +01:00

129 lines
6.5 KiB
PHP

<?php
use Livewire\Attributes\Layout;
use Livewire\Attributes\Title;
use Livewire\Volt\Component;
new #[Layout('web.layouts.web-master-slot'), Title('Registrierung erfolgreich')] class extends Component {
public ?string $email = null;
public function mount(): void
{
$this->email = request()->query('email');
}
}; ?>
<div class="bg-background">
<livewire:web.components.ui.header />
<main class="variante-glass-flow">
<div class="max-w-3xl mx-auto px-6 space-y-8 pt-20 pb-40">
{{-- Header --}}
<div class="text-center space-y-4">
<div class="mx-auto w-20 h-20 rounded-full bg-green-100 flex items-center justify-center mb-6">
@svg('heroicon-o-check-circle', 'h-12 w-12 text-green-600')
</div>
<p class="text-xs uppercase tracking-[0.2em] text-accent-500">{{ __('registration.thank_you.subtitle') }}</p>
<h1 class="text-3xl md:text-4xl font-bold text-foreground">
{{ __('registration.thank_you.title') }}
</h1>
<p class="text-lg text-muted-foreground">
{{ __('registration.thank_you.description') }}
</p>
</div>
{{-- Info Card --}}
<div class="bg-card/80 backdrop-blur shadow-2xl border border-border rounded-3xl p-6 md:p-8 space-y-6">
{{-- Email Verification Info --}}
<div class="flex flex-col gap-3 p-4 rounded-2xl bg-lime-100 border border-lime-200 ">
<div class="flex items-start gap-3">
<div class="h-10 w-10 rounded-xl bg-lime-200 flex items-center justify-center flex-shrink-0">
@svg('heroicon-o-envelope', 'h-5 w-5 text-lime-600')
</div>
<div>
<div class="font-medium text-foreground">{{ __('registration.thank_you.email_sent_title') }}</div>
<div class="text-sm text-muted-foreground">
{{ __('registration.thank_you.email_sent_description', ['email' => $email]) }}
</div>
</div>
</div>
</div>
{{-- Next Steps --}}
<div class="space-y-4">
<h2 class="text-xl font-semibold text-foreground">{{ __('registration.thank_you.next_steps_title') }}</h2>
<div class="space-y-3">
{{-- Step 1 --}}
<div class="flex gap-4 p-4 rounded-xl bg-accent-50 border border-accent-100">
<div class="flex-shrink-0 w-8 h-8 rounded-lg bg-secondary text-secondary-foreground flex items-center justify-center font-bold text-sm">
1
</div>
<div>
<div class="font-medium text-foreground">{{ __('registration.thank_you.step1_title') }}</div>
<div class="text-sm text-muted-foreground">{{ __('registration.thank_you.step1_description') }}</div>
</div>
</div>
{{-- Step 2 --}}
<div class="flex gap-4 p-4 rounded-xl bg-accent-50 border border-accent-100">
<div class="flex-shrink-0 w-8 h-8 rounded-lg bg-secondary text-secondary-foreground flex items-center justify-center font-bold text-sm">
2
</div>
<div>
<div class="font-medium text-foreground">{{ __('registration.thank_you.step2_title') }}</div>
<div class="text-sm text-muted-foreground">{{ __('registration.thank_you.step2_description') }}</div>
</div>
</div>
{{-- Step 3 --}}
<div class="flex gap-4 p-4 rounded-xl bg-accent-50 border border-accent-100">
<div class="flex-shrink-0 w-8 h-8 rounded-lg bg-secondary text-secondary-foreground flex items-center justify-center font-bold text-sm">
3
</div>
<div>
<div class="font-medium text-foreground">{{ __('registration.thank_you.step3_title') }}</div>
<div class="text-sm text-muted-foreground">{{ __('registration.thank_you.step3_description') }}</div>
</div>
</div>
</div>
</div>
{{-- Important Note --}}
<div class="flex flex-col gap-3 p-4 rounded-2xl bg-amber-50 border border-amber-100">
<div class="flex items-start gap-3">
<div class="h-10 w-10 rounded-xl bg-amber-100 flex items-center justify-center flex-shrink-0">
@svg('heroicon-o-exclamation-triangle', 'h-5 w-5 text-amber-600')
</div>
<div>
<div class="font-medium text-foreground">{{ __('registration.thank_you.spam_check_title') }}</div>
<div class="text-sm text-muted-foreground">{{ __('registration.thank_you.spam_check_description') }}</div>
</div>
</div>
</div>
{{-- Login Link --}}
<div class="text-center pt-6">
<p class="text-sm text-muted-foreground mb-4">
{{ __('registration.thank_you.already_verified') }}
</p>
<a href="{{ route('login') }}" class="btn-secondary-accent small cursor-pointer inline-flex items-center gap-2">
<div class="flex flex-row items-center gap-2">
@svg('heroicon-o-arrow-right', 'h-5 w-5')
{{ __('registration.thank_you.login_button') }}
</div>
</a>
</div>
</div>
{{-- Support Contact --}}
<div class="text-center text-sm text-muted-foreground">
{{ __('registration.messages.code_problems') }}
</div>
</div>
</main>
<livewire:web.components.ui.footer />
</div>