feat: Phase 5 - polish, validation, rate limiting, Dutch translations

This commit is contained in:
2026-04-03 22:13:59 +02:00
parent 83e2158383
commit 330950cc6e
18 changed files with 251 additions and 102 deletions

View File

@@ -13,6 +13,47 @@
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body class="font-sans antialiased bg-slate-100 text-slate-900" x-data="{ sidebarOpen: false }">
@php
$adminFlashSuccess = session('status');
$adminFlashError = session('error');
@endphp
@if ($adminFlashSuccess !== null || $adminFlashError !== null)
<div
class="pointer-events-none fixed bottom-4 right-4 z-[100] flex w-full max-w-sm flex-col gap-2 px-4 sm:px-0"
aria-live="polite"
>
@foreach (array_filter([
$adminFlashSuccess !== null ? ['type' => 'success', 'message' => $adminFlashSuccess] : null,
$adminFlashError !== null ? ['type' => 'error', 'message' => $adminFlashError] : null,
]) as $toast)
<div
x-data="{ visible: true }"
x-show="visible"
x-transition:enter="transition ease-out duration-200"
x-transition:enter-start="translate-y-2 opacity-0"
x-transition:enter-end="translate-y-0 opacity-100"
x-transition:leave="transition ease-in duration-150"
x-transition:leave-start="translate-y-0 opacity-100"
x-transition:leave-end="translate-y-2 opacity-0"
x-init="setTimeout(() => visible = false, 6500)"
class="pointer-events-auto flex items-start gap-3 rounded-lg border px-4 py-3 text-sm shadow-lg {{ $toast['type'] === 'success' ? 'border-emerald-200 bg-emerald-50 text-emerald-900' : 'border-red-200 bg-red-50 text-red-900' }}"
role="{{ $toast['type'] === 'success' ? 'status' : 'alert' }}"
>
<p class="min-w-0 flex-1 leading-snug">{{ $toast['message'] }}</p>
<button
type="button"
class="shrink-0 rounded p-0.5 opacity-70 hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-indigo-500"
@click="visible = false"
aria-label="{{ __('Dismiss notification') }}"
>
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
</svg>
</button>
</div>
@endforeach
</div>
@endif
{{-- Mobile overlay --}}
<div
x-show="sidebarOpen"
@@ -114,18 +155,6 @@
</header>
<main class="flex-1 p-4 sm:p-6 lg:p-8">
@if (session('status'))
<div class="mb-6 rounded-lg border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-800" role="status">
{{ session('status') }}
</div>
@endif
@if (session('error'))
<div class="mb-6 rounded-lg border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-800" role="alert">
{{ session('error') }}
</div>
@endif
@yield('content')
</main>
</div>