nimuli/resources/views/livewire/pages/profile/security.blade.php

53 lines
3.0 KiB
PHP

<div class="max-w-2xl">
<div class="mb-6">
<h1 class="text-2xl font-semibold text-t1">Profile</h1>
<nav class="flex gap-1 mt-4">
<a href="{{ route('profile.personal') }}" wire:navigate class="px-3 py-1.5 text-sm rounded-lg text-t2 hover:text-t1 hover:bg-s2">Personal Info</a>
<a href="{{ route('profile.preferences') }}" wire:navigate class="px-3 py-1.5 text-sm rounded-lg text-t2 hover:text-t1 hover:bg-s2">Preferences</a>
<a href="{{ route('profile.security') }}" wire:navigate class="px-3 py-1.5 text-sm rounded-lg bg-blue/10 text-blue font-medium">Security</a>
</nav>
</div>
@if(session('status'))
<div class="mb-4 p-3 rounded-lg bg-green/10 border border-green/20 text-sm text-green">{{ session('status') }}</div>
@endif
<div class="bg-s1 border border-white/[.06] rounded-xl p-6 mb-6">
<h3 class="text-sm font-medium text-t1 mb-5">Change Password</h3>
<div class="space-y-4 max-w-sm">
<div>
<label class="block text-xs font-medium text-t2 mb-1.5">Current Password</label>
<input wire:model="currentPassword" type="password"
class="block w-full px-3 py-2.5 bg-s2 border border-white/[.06] rounded-lg text-sm text-t1 focus:outline-none focus:ring-1 focus:ring-blue/50">
@error('currentPassword') <p class="mt-1 text-xs text-red">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-xs font-medium text-t2 mb-1.5">New Password</label>
<input wire:model="newPassword" type="password"
class="block w-full px-3 py-2.5 bg-s2 border border-white/[.06] rounded-lg text-sm text-t1 focus:outline-none focus:ring-1 focus:ring-blue/50">
@error('newPassword') <p class="mt-1 text-xs text-red">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-xs font-medium text-t2 mb-1.5">Confirm New Password</label>
<input wire:model="newPasswordConfirmation" type="password"
class="block w-full px-3 py-2.5 bg-s2 border border-white/[.06] rounded-lg text-sm text-t1 focus:outline-none focus:ring-1 focus:ring-blue/50">
</div>
<button wire:click="changePassword"
class="px-4 py-2.5 bg-accent-gradient text-white text-sm font-medium rounded-lg hover:opacity-90">
Change Password
</button>
</div>
</div>
<!-- Danger Zone -->
<div class="bg-s1 border border-red/20 rounded-xl p-6">
<h3 class="text-sm font-medium text-red mb-2">Danger Zone</h3>
<p class="text-sm text-t2 mb-4">Permanently delete your account and all associated data. This cannot be undone.</p>
<button
@click="$dispatch('openModal', {component: 'modals.delete-account'})"
class="px-4 py-2.5 bg-red text-white text-sm font-medium rounded-lg hover:opacity-90 transition-opacity">
Delete Account
</button>
</div>
</div>