Remove legacy registration page assets
This commit is contained in:
@@ -1 +1 @@
|
|||||||
fotospiel-app-cbnv
|
fotospiel-app-5aa
|
||||||
|
|||||||
@@ -1,373 +0,0 @@
|
|||||||
import React, { useEffect, useState } from 'react';
|
|
||||||
import { useForm } from '@inertiajs/react';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
|
||||||
import { LoaderCircle, User, Mail, Phone, Lock, MapPin } from 'lucide-react';
|
|
||||||
import { Dialog, DialogContent, DialogTitle, DialogDescription } from '@/components/ui/dialog';
|
|
||||||
|
|
||||||
interface RegisterProps {
|
|
||||||
package?: {
|
|
||||||
id: number;
|
|
||||||
name: string;
|
|
||||||
description: string;
|
|
||||||
price: number;
|
|
||||||
} | null;
|
|
||||||
privacyHtml?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
import MarketingLayout from '@/layouts/mainWebsite';
|
|
||||||
|
|
||||||
export default function Register({ package: initialPackage, privacyHtml }: RegisterProps) {
|
|
||||||
const [privacyOpen, setPrivacyOpen] = useState(false);
|
|
||||||
const [hasTriedSubmit, setHasTriedSubmit] = useState(false);
|
|
||||||
const { t } = useTranslation(['auth', 'common']);
|
|
||||||
|
|
||||||
const { data, setData, post, processing, errors, clearErrors } = useForm({
|
|
||||||
username: '',
|
|
||||||
email: '',
|
|
||||||
password: '',
|
|
||||||
password_confirmation: '',
|
|
||||||
first_name: '',
|
|
||||||
last_name: '',
|
|
||||||
address: '',
|
|
||||||
phone: '',
|
|
||||||
privacy_consent: false,
|
|
||||||
package_id: initialPackage?.id || null,
|
|
||||||
});
|
|
||||||
|
|
||||||
const submit = (e: React.FormEvent) => {
|
|
||||||
e.preventDefault();
|
|
||||||
setHasTriedSubmit(true);
|
|
||||||
post('/register', {
|
|
||||||
preserveScroll: true,
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (!hasTriedSubmit) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const errorKeys = Object.keys(errors);
|
|
||||||
if (errorKeys.length === 0) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const firstError = errorKeys[0];
|
|
||||||
const field = document.querySelector<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>(`[name="${firstError}"]`);
|
|
||||||
|
|
||||||
if (field) {
|
|
||||||
field.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
|
||||||
field.focus();
|
|
||||||
}
|
|
||||||
}, [errors, hasTriedSubmit]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<MarketingLayout title={t('register.title')}>
|
|
||||||
<div className="min-h-screen flex items-center justify-center bg-gray-50 py-12 px-4 sm:px-6 lg:px-8">
|
|
||||||
<div className="max-w-4xl w-full space-y-8">
|
|
||||||
<div className="bg-white rounded-lg shadow-md p-8">
|
|
||||||
<div>
|
|
||||||
<h2 className="mt-6 text-center text-3xl font-bold text-gray-900 font-display">
|
|
||||||
{t('register.welcome')}
|
|
||||||
</h2>
|
|
||||||
<p className="mt-4 text-center text-gray-600 font-sans-marketing">
|
|
||||||
{t('register.description')}
|
|
||||||
</p>
|
|
||||||
{initialPackage && (
|
|
||||||
<div className="mt-4 p-4 bg-blue-50 border border-blue-200 rounded-md">
|
|
||||||
<h3 className="text-lg font-semibold text-blue-900 mb-2">{initialPackage.name}</h3>
|
|
||||||
<p className="text-blue-800 mb-2">{initialPackage.description}</p>
|
|
||||||
<p className="text-sm text-blue-700">
|
|
||||||
{initialPackage.price === 0 ? t('register.package_price_free') : t('register.package_price', { price: initialPackage.price })}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<form onSubmit={submit} className="mt-8 space-y-6">
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
||||||
<div className="md:col-span-1">
|
|
||||||
<label htmlFor="first_name" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.first_name')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<User className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="first_name"
|
|
||||||
name="first_name"
|
|
||||||
type="text"
|
|
||||||
required
|
|
||||||
value={data.first_name}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('first_name', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.first_name) {
|
|
||||||
clearErrors('first_name');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.first_name ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.first_name_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.first_name && <p key={`error-first_name`} className="text-sm text-red-600 mt-1">{errors.first_name}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-1">
|
|
||||||
<label htmlFor="last_name" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.last_name')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<User className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="last_name"
|
|
||||||
name="last_name"
|
|
||||||
type="text"
|
|
||||||
required
|
|
||||||
value={data.last_name}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('last_name', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.last_name) {
|
|
||||||
clearErrors('last_name');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.last_name ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.last_name_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.last_name && <p key={`error-last_name`} className="text-sm text-red-600 mt-1">{errors.last_name}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-2">
|
|
||||||
<label htmlFor="email" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.email')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<Mail className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="email"
|
|
||||||
name="email"
|
|
||||||
type="email"
|
|
||||||
required
|
|
||||||
value={data.email}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('email', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.email) {
|
|
||||||
clearErrors('email');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.email ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.email_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.email && <p key={`error-email`} className="text-sm text-red-600 mt-1">{errors.email}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-2">
|
|
||||||
<label htmlFor="address" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.address')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<MapPin className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="address"
|
|
||||||
name="address"
|
|
||||||
type="text"
|
|
||||||
required
|
|
||||||
value={data.address}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('address', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.address) {
|
|
||||||
clearErrors('address');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.address ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.address_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.address && <p key={`error-address`} className="text-sm text-red-600 mt-1">{errors.address}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-1">
|
|
||||||
<label htmlFor="phone" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.phone')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<Phone className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="phone"
|
|
||||||
name="phone"
|
|
||||||
type="tel"
|
|
||||||
required
|
|
||||||
value={data.phone}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('phone', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.phone) {
|
|
||||||
clearErrors('phone');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.phone ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.phone_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.phone && <p key={`error-phone`} className="text-sm text-red-600 mt-1">{errors.phone}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-1">
|
|
||||||
<label htmlFor="username" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.username')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<User className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="username"
|
|
||||||
name="username"
|
|
||||||
type="text"
|
|
||||||
required
|
|
||||||
value={data.username}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('username', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.username) {
|
|
||||||
clearErrors('username');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.username ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.username_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.username && <p key={`error-username`} className="text-sm text-red-600 mt-1">{errors.username}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-1">
|
|
||||||
<label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.password')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<Lock className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="password"
|
|
||||||
name="password"
|
|
||||||
type="password"
|
|
||||||
required
|
|
||||||
value={data.password}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('password', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.password) {
|
|
||||||
clearErrors('password');
|
|
||||||
}
|
|
||||||
if (data.password_confirmation && e.target.value === data.password_confirmation) {
|
|
||||||
clearErrors('password_confirmation');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.password ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.password_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.password && <p key={`error-password`} className="text-sm text-red-600 mt-1">{errors.password}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-1">
|
|
||||||
<label htmlFor="password_confirmation" className="block text-sm font-medium text-gray-700 mb-1">
|
|
||||||
{t('register.password_confirmation')} {t('common:required')}
|
|
||||||
</label>
|
|
||||||
<div className="relative">
|
|
||||||
<Lock className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
|
|
||||||
<input
|
|
||||||
id="password_confirmation"
|
|
||||||
name="password_confirmation"
|
|
||||||
type="password"
|
|
||||||
required
|
|
||||||
value={data.password_confirmation}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('password_confirmation', e.target.value);
|
|
||||||
if (e.target.value.trim() && errors.password_confirmation) {
|
|
||||||
clearErrors('password_confirmation');
|
|
||||||
}
|
|
||||||
if (data.password && e.target.value === data.password) {
|
|
||||||
clearErrors('password_confirmation');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.password_confirmation ? 'border-red-500' : 'border-gray-300'}`}
|
|
||||||
placeholder={t('register.password_confirmation_placeholder')}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{errors.password_confirmation && <p key={`error-password_confirmation`} className="text-sm text-red-600 mt-1">{errors.password_confirmation}</p>}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="md:col-span-2 flex items-start">
|
|
||||||
<input
|
|
||||||
id="privacy_consent"
|
|
||||||
name="privacy_consent"
|
|
||||||
type="checkbox"
|
|
||||||
required
|
|
||||||
checked={data.privacy_consent}
|
|
||||||
onChange={(e) => {
|
|
||||||
setData('privacy_consent', e.target.checked);
|
|
||||||
if (e.target.checked && errors.privacy_consent) {
|
|
||||||
clearErrors('privacy_consent');
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className="h-4 w-4 text-[#FFB6C1] focus:ring-[#FFB6C1] border-gray-300 rounded"
|
|
||||||
/>
|
|
||||||
<label htmlFor="privacy_consent" className="ml-2 block text-sm text-gray-900">
|
|
||||||
{t('register.privacy_consent')}{' '}
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={() => setPrivacyOpen(true)}
|
|
||||||
className="text-[#FFB6C1] hover:underline inline bg-transparent border-none cursor-pointer p-0 font-medium"
|
|
||||||
>
|
|
||||||
{t('register.privacy_policy_link')}
|
|
||||||
</button>.
|
|
||||||
</label>
|
|
||||||
{errors.privacy_consent && <p className="mt-2 text-sm text-red-600">{errors.privacy_consent}</p>}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{Object.keys(errors).length > 0 && (
|
|
||||||
<div key={`general-errors-${Object.keys(errors).join('-')}`} className="p-4 bg-red-50 border border-red-200 rounded-md mb-6">
|
|
||||||
<h4 className="text-sm font-medium text-red-800 mb-2">{t('register.errors_title')}</h4>
|
|
||||||
<ul className="text-sm text-red-800 space-y-1">
|
|
||||||
{Object.entries(errors).map(([key, value]) => (
|
|
||||||
<li key={key} className="flex items-start">
|
|
||||||
<span className="font-medium">{t(`register.errors.${key}`)}:</span> {value}
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<button
|
|
||||||
type="submit"
|
|
||||||
disabled={processing}
|
|
||||||
className="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-[#FFB6C1] hover:bg-[#FF69B4] focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[#FFB6C1] transition duration-300 disabled:opacity-50"
|
|
||||||
>
|
|
||||||
{processing && <LoaderCircle className="h-4 w-4 animate-spin mr-2" />}
|
|
||||||
{t('register.submit')}
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<div className="text-center">
|
|
||||||
<p className="text-sm text-gray-600">
|
|
||||||
{t('register.has_account')}{' '}
|
|
||||||
<a href="/login" className="font-medium text-[#FFB6C1] hover:text-[#FF69B4]">
|
|
||||||
{t('register.login')}
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<Dialog open={privacyOpen} onOpenChange={setPrivacyOpen}>
|
|
||||||
<DialogContent className="max-w-4xl max-h-[80vh] overflow-y-auto p-0">
|
|
||||||
<DialogTitle className="sr-only">Datenschutzerklärung</DialogTitle>
|
|
||||||
<DialogDescription className="sr-only">Lesen Sie unsere Datenschutzerklärung.</DialogDescription>
|
|
||||||
<div className="p-6">
|
|
||||||
{privacyHtml ? (
|
|
||||||
<div dangerouslySetInnerHTML={{ __html: privacyHtml }} />
|
|
||||||
) : (
|
|
||||||
<p>Datenschutzerklärung wird geladen...</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
</div>
|
|
||||||
</MarketingLayout>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,168 +0,0 @@
|
|||||||
@extends('layouts.marketing')
|
|
||||||
|
|
||||||
@section('title', __('auth.register'))
|
|
||||||
|
|
||||||
@section('content')
|
|
||||||
<div class="min-h-screen flex items-center justify-center bg-gray-50 py-12 px-4 sm:px-6 lg:px-8">
|
|
||||||
<div class="max-w-md w-full space-y-8">
|
|
||||||
<div>
|
|
||||||
<h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
|
|
||||||
{{ __('auth.register') }}
|
|
||||||
</h2>
|
|
||||||
@if($package ?? false)
|
|
||||||
<div class="mt-4 p-4 bg-blue-50 border border-blue-200 rounded-md">
|
|
||||||
<h3 class="text-lg font-semibold text-blue-900 mb-2">{{ $package->name }}</h3>
|
|
||||||
<p class="text-blue-800 mb-2">{{ $package->description }}</p>
|
|
||||||
<p class="text-sm text-blue-700">
|
|
||||||
{{ $package->price == 0 ? __('marketing.register.free') : $package->price . ' ' . __('currency.euro') }}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
@endif
|
|
||||||
</div>
|
|
||||||
<form class="mt-8 space-y-6" action="{{ route('register.store') }}" method="POST">
|
|
||||||
@csrf
|
|
||||||
@if($package ?? false)
|
|
||||||
<input type="hidden" name="package_id" value="{{ $package->id }}">
|
|
||||||
@endif
|
|
||||||
|
|
||||||
<!-- Username Field -->
|
|
||||||
<div>
|
|
||||||
<label for="username" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('auth.username') }}
|
|
||||||
</label>
|
|
||||||
<input id="username" name="username" type="text" required
|
|
||||||
value="{{ old('username') }}"
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('username') border-red-500 @enderror"
|
|
||||||
placeholder="{{ __('auth.username_placeholder') }}">
|
|
||||||
@error('username')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Email Field -->
|
|
||||||
<div>
|
|
||||||
<label for="email" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('auth.email') }}
|
|
||||||
</label>
|
|
||||||
<input id="email" name="email" type="email" required
|
|
||||||
value="{{ old('email') }}"
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('email') border-red-500 @enderror"
|
|
||||||
placeholder="{{ __('auth.email_placeholder') }}">
|
|
||||||
@error('email')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Password Field -->
|
|
||||||
<div>
|
|
||||||
<label for="password" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('auth.password') }}
|
|
||||||
</label>
|
|
||||||
<input id="password" name="password" type="password" required
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('password') border-red-500 @enderror"
|
|
||||||
placeholder="{{ __('auth.password_placeholder') }}">
|
|
||||||
@error('password')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Confirm Password Field -->
|
|
||||||
<div>
|
|
||||||
<label for="password_confirmation" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('auth.confirm_password') }}
|
|
||||||
</label>
|
|
||||||
<input id="password_confirmation" name="password_confirmation" type="password" required
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
|
|
||||||
placeholder="{{ __('auth.confirm_password_placeholder') }}">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- First Name Field -->
|
|
||||||
<div>
|
|
||||||
<label for="first_name" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('profile.first_name') }}
|
|
||||||
</label>
|
|
||||||
<input id="first_name" name="first_name" type="text" required
|
|
||||||
value="{{ old('first_name') }}"
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('first_name') border-red-500 @enderror"
|
|
||||||
placeholder="{{ __('profile.first_name_placeholder') }}">
|
|
||||||
@error('first_name')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Last Name Field -->
|
|
||||||
<div>
|
|
||||||
<label for="last_name" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('profile.last_name') }}
|
|
||||||
</label>
|
|
||||||
<input id="last_name" name="last_name" type="text" required
|
|
||||||
value="{{ old('last_name') }}"
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('last_name') border-red-500 @enderror"
|
|
||||||
placeholder="{{ __('profile.last_name_placeholder') }}">
|
|
||||||
@error('last_name')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Address Field -->
|
|
||||||
<div>
|
|
||||||
<label for="address" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('profile.address') }}
|
|
||||||
</label>
|
|
||||||
<textarea id="address" name="address" required rows="3"
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('address') border-red-500 @enderror">{{ old('address') }}</textarea>
|
|
||||||
@error('address')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Phone Field -->
|
|
||||||
<div>
|
|
||||||
<label for="phone" class="block text-sm font-medium text-gray-700">
|
|
||||||
{{ __('profile.phone') }}
|
|
||||||
</label>
|
|
||||||
<input id="phone" name="phone" type="tel" required
|
|
||||||
value="{{ old('phone') }}"
|
|
||||||
class="appearance-none rounded-none relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm @error('phone') border-red-500 @enderror"
|
|
||||||
placeholder="{{ __('profile.phone_placeholder') }}">
|
|
||||||
@error('phone')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Privacy Consent -->
|
|
||||||
<div class="flex items-start">
|
|
||||||
<div class="flex items-center h-5">
|
|
||||||
<input id="privacy_consent" name="privacy_consent" type="checkbox" required
|
|
||||||
class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded @error('privacy_consent') border-red-500 @enderror">
|
|
||||||
</div>
|
|
||||||
<div class="ml-3 text-sm">
|
|
||||||
<label for="privacy_consent" class="font-medium text-gray-700">
|
|
||||||
{{ __('auth.privacy_consent') }}
|
|
||||||
<a href="{{ route('datenschutz') }}" class="text-blue-600 hover:text-blue-500">{{ __('auth.privacy_policy') }}</a>.
|
|
||||||
</label>
|
|
||||||
@error('privacy_consent')
|
|
||||||
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
|
|
||||||
@enderror
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<button type="submit"
|
|
||||||
class="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition duration-300">
|
|
||||||
{{ __('auth.register') }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="text-center">
|
|
||||||
<p class="text-sm text-gray-600">
|
|
||||||
{{ __('auth.have_account') }}
|
|
||||||
<a href="{{ route('login') }}" class="font-medium text-blue-600 hover:text-blue-500">
|
|
||||||
{{ __('auth.login') }}
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@endsection
|
|
||||||
Reference in New Issue
Block a user