78 lines
3.0 KiB
Plaintext
78 lines
3.0 KiB
Plaintext
@layouts.main({ title: 'Sign In — Imago Vault' })
|
|
@slot('main')
|
|
<div class="min-h-screen flex items-center justify-center px-4">
|
|
<div class="w-full max-w-md">
|
|
|
|
{{-- Logo / heading --}}
|
|
<div class="text-center mb-8">
|
|
<div class="inline-flex items-center justify-center w-16 h-16 bg-indigo-600 rounded-2xl mb-4 shadow-lg">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
|
|
</svg>
|
|
</div>
|
|
<h1 class="text-2xl font-bold text-white">Imago Vault</h1>
|
|
<p class="text-gray-400 text-sm mt-1">Sign in to manage your media files</p>
|
|
</div>
|
|
|
|
{{-- Credential error message --}}
|
|
@if(flashMessages.has('errors'))
|
|
<div class="bg-red-900/40 border border-red-700 text-red-300 px-4 py-3 rounded-lg mb-6 text-sm">
|
|
{{ flashMessages.get('errors').form ?? 'An error occurred.' }}
|
|
</div>
|
|
@end
|
|
|
|
{{-- Login form --}}
|
|
<form method="POST" action="/login"
|
|
class="bg-gray-900 rounded-2xl p-8 shadow-2xl border border-gray-800">
|
|
{{ csrfField() }}
|
|
|
|
<div class="mb-5">
|
|
<label for="username" class="block text-sm font-medium text-gray-300 mb-2">
|
|
Username
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="username"
|
|
name="username"
|
|
value="{{ flashMessages.get('username') ?? '' }}"
|
|
required
|
|
autocomplete="username"
|
|
class="w-full px-4 py-3 bg-gray-800 border border-gray-700 rounded-lg text-white
|
|
placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500
|
|
focus:border-transparent transition"
|
|
placeholder="admin"
|
|
/>
|
|
</div>
|
|
|
|
<div class="mb-6">
|
|
<label for="password" class="block text-sm font-medium text-gray-300 mb-2">
|
|
Password
|
|
</label>
|
|
<input
|
|
type="password"
|
|
id="password"
|
|
name="password"
|
|
required
|
|
autocomplete="current-password"
|
|
class="w-full px-4 py-3 bg-gray-800 border border-gray-700 rounded-lg text-white
|
|
placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500
|
|
focus:border-transparent transition"
|
|
placeholder="••••••••"
|
|
/>
|
|
</div>
|
|
|
|
<button
|
|
type="submit"
|
|
class="w-full py-3 px-6 bg-indigo-600 hover:bg-indigo-500 text-white font-semibold
|
|
rounded-lg transition duration-200 focus:outline-none focus:ring-2 focus:ring-indigo-400"
|
|
>
|
|
Sign in
|
|
</button>
|
|
</form>
|
|
|
|
</div>
|
|
</div>
|
|
@endslot
|
|
@end
|