FiFreshChecker/resources/views/profile/partials/update-profile-information-...

57 lines
2.8 KiB
PHP

<section class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
<div class="bg-slate-50 border-b border-gray-100 px-6 py-8 flex flex-col items-center text-center">
<div class="h-20 w-20 rounded-full bg-blue-600 flex items-center justify-center text-white text-3xl font-bold shadow-sm">
{{ strtoupper(substr($user->name, 0, 1)) }}
</div>
<h2 class="mt-4 text-xl font-bold text-gray-900">
Informasi Profil
</h2>
<p class="mt-1 text-sm text-gray-500">
Kelola informasi data diri Anda. Pastikan nama lengkap sesuai.
</p>
</div>
<div class="p-6 md:p-8">
<form method="post" action="{{ route('profile.update') }}" class="space-y-6">
@csrf
@method('patch')
<div>
<label for="name" class="block text-sm font-semibold text-gray-700 mb-2">Nama Lengkap</label>
<input id="name" name="name" type="text"
class="block w-full border-gray-300 rounded-none shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200 transition"
value="{{ old('name', $user->name) }}" required autofocus autocomplete="name">
<x-input-error class="mt-2 text-sm text-red-600" :messages="$errors->get('name')" />
</div>
<div>
<label for="email" class="block text-sm font-semibold text-gray-700 mb-2">Alamat Email</label>
<div class="relative">
<input id="email" name="email" type="email"
class="block w-full border-gray-200 bg-gray-50 rounded-md text-gray-500 shadow-sm cursor-not-allowed focus:ring-0"
value="{{ old('email', $user->email) }}" readonly>
<div class="absolute inset-y-0 right-0 flex items-center pr-4">
<i class="bi bi-lock-fill text-gray-400"></i>
</div>
</div>
</div>
<div class="flex items-center justify-between pt-6 mt-8 border-t border-gray-100">
<div>
@if (session('status') === 'profile-updated')
<p x-data="{ show: true }" x-show="show" x-transition x-init="setTimeout(() => show = false, 3000)" class="text-sm text-green-600 font-semibold flex items-center">
Berhasil disimpan!
</p>
@endif
</div>
<button type="submit" class="bg-blue-600 hover:bg-blue-700 text-white font-semibold py-2 px-6 rounded-md transition shadow-sm">
Simpan Perubahan
</button>
</div>
</form>
</div>
</section>