You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
4.3 KiB
79 lines
4.3 KiB
@extends('layouts.app') |
|
|
|
@section('title', 'Set New Password — ' . config('app.name')) |
|
|
|
@section('content') |
|
<div class="flex flex-col min-h-full"> |
|
<div class="flex justify-end px-4 pt-4 sm:px-6"> |
|
@include('partials.theme-toggle') |
|
</div> |
|
<div class="flex-1 flex items-center justify-center px-4 py-6"> |
|
<div class="w-full max-w-md space-y-4"> |
|
<div class="bg-slate-900 border border-slate-800 rounded-2xl p-6 sm:p-8 shadow-2xl"> |
|
<div class="mb-6"> |
|
<h1 class="text-2xl font-bold text-white">Set New Password</h1> |
|
<p class="text-slate-400 mt-2 text-sm">Account: <span class="text-cyan-400">{{ $username }}</span></p> |
|
</div> |
|
|
|
@if (session('error')) |
|
<div class="mb-4 rounded-lg bg-red-950/50 border border-red-800 text-red-200 px-4 py-3 text-sm"> |
|
{{ session('error') }} |
|
</div> |
|
@endif |
|
|
|
<form method="POST" action="{{ route('password.reset.update', $token) }}" class="space-y-5" |
|
onsubmit="return confirm('Set new password for [{{ $username }}]?');"> |
|
@csrf |
|
|
|
<div> |
|
<label for="password" class="block text-sm font-medium text-slate-300 mb-2">New Password</label> |
|
<input id="password" name="password" type="password" required minlength="8" maxlength="128" |
|
class="w-full rounded-lg bg-slate-800 border border-slate-700 px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500"> |
|
@error('password')<p class="text-red-400 text-xs mt-1">{{ $message }}</p>@enderror |
|
</div> |
|
|
|
<div> |
|
<label for="password_confirmation" class="block text-sm font-medium text-slate-300 mb-2">Confirm Password</label> |
|
<input id="password_confirmation" name="password_confirmation" type="password" required minlength="8" maxlength="128" |
|
class="w-full rounded-lg bg-slate-800 border border-slate-700 px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500"> |
|
</div> |
|
|
|
<div class="border border-amber-800/50 bg-amber-950/30 rounded-lg p-4 space-y-3"> |
|
<p class="text-amber-200 text-sm font-medium">Konfirmasi ganda</p> |
|
<label class="flex items-center gap-2 text-sm text-slate-300"> |
|
<input type="checkbox" name="confirm_action" value="1" required class="rounded"> |
|
Saya yakin ingin mengatur password baru |
|
</label> |
|
<div> |
|
<label for="confirm_username" class="block text-sm text-slate-300 mb-1"> |
|
Ketik username: <span class="text-cyan-400">{{ $username }}</span> |
|
</label> |
|
<input type="text" name="confirm_username" id="confirm_username" required autocomplete="off" |
|
class="w-full rounded-lg bg-slate-800 border border-slate-700 px-4 py-2 text-sm text-white"> |
|
</div> |
|
</div> |
|
|
|
<button type="submit" |
|
class="w-full rounded-lg bg-violet-700 hover:bg-violet-600 text-white font-semibold py-3 transition"> |
|
Set New Password |
|
</button> |
|
</form> |
|
</div> |
|
|
|
<aside class="bg-slate-900 border border-slate-800 rounded-2xl p-5 notes-panel"> |
|
<h2 class="text-sm font-semibold text-white mb-3">Catatan</h2> |
|
<dl class="space-y-2 text-xs text-slate-400"> |
|
<div> |
|
<dt class="font-medium text-amber-400 mb-0.5">Keamanan</dt> |
|
<dd>Password minimal 8 karakter. Konfirmasi ganda mencegah reset tidak sengaja.</dd> |
|
</div> |
|
<div> |
|
<dt class="font-medium text-emerald-400 mb-0.5">Setelah reset</dt> |
|
<dd>Login kembali dengan password baru. Notifikasi email dikirim jika fitur email aktif.</dd> |
|
</div> |
|
</dl> |
|
</aside> |
|
</div> |
|
</div> |
|
</div> |
|
@endsection
|
|
|