8b5f55db6f
Use fix routes for user profile edit handles to make it easier when user decides to change his username
54 lines
2.3 KiB
HTML
54 lines
2.3 KiB
HTML
<div class="bg-white rounded-lg shadow-md border border-gray-200 p-8">
|
|
<h2 class="text-xl font-semibold text-gray-900 mb-6">Profile Information</h2>
|
|
|
|
<form hx-put="/users/edit"
|
|
hx-target="#edit-messages"
|
|
hx-swap="innerHTML"
|
|
class="space-y-6">
|
|
<input type="hidden" name="user_id" value="{{ user.user_id }}" />
|
|
|
|
<div>
|
|
<label for="username" class="block text-sm font-medium text-gray-700 mb-1">
|
|
Username
|
|
</label>
|
|
<input type="text"
|
|
name="username"
|
|
id="username"
|
|
value="{{ user.username }}"
|
|
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="full_name" class="block text-sm font-medium text-gray-700 mb-1">
|
|
Full Name
|
|
</label>
|
|
<input type="text"
|
|
id="full_name"
|
|
name="full_name"
|
|
value="{{ user.full_name.as_deref().unwrap_or("") }}"
|
|
placeholder="John Doe"
|
|
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
|
|
<p class="mt-1 text-xs text-gray-500">Your real name (optional)</p>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="bio" class="block text-sm font-medium text-gray-700 mb-1">
|
|
Bio
|
|
</label>
|
|
<textarea id="bio"
|
|
name="bio"
|
|
rows="4"
|
|
maxlength="500"
|
|
placeholder="Tell us about yourself..."
|
|
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">{{ user.bio.as_deref().unwrap_or("") }}</textarea>
|
|
<p class="mt-1 text-xs text-gray-500">Maximum 500 characters</p>
|
|
</div>
|
|
|
|
<button type="submit"
|
|
class="w-full bg-blue-600 text-white hover:bg-blue-700 font-medium py-2 px-4 rounded-md transition-colors">
|
|
Save changes
|
|
</button>
|
|
|
|
<div id="edit-messages"></div>
|
|
</form>
|
|
</div> |