jens/TimeTrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update Profile page.

Browse Source
This commit is contained in:
Jens Luedicke
2025-06-29 15:47:07 +02:00
parent 0964a2177a
commit 68db551041
1 changed files with 107 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

133
templates/profile.html
View File

@@ -25,33 +25,53 @@
</p> </p>
</div> </div>
<h2>Update Profile</h2> <h2>Profile Settings</h2>
<form method="POST" action="{{ url_for('profile') }}" class="profile-form">
<div class="form-group"> <div class="profile-card">
<label for="email">Email</label> <h3>Basic Information</h3>
<input type="email" id="email" name="email" class="form-control" value="{{ user.email }}" required> <form method="POST" action="{{ url_for('profile') }}" class="profile-form">
</div> <div class="form-group">
<label for="email">Email Address</label>
<input type="email" id="email" name="email" class="form-control" value="{{ user.email }}" required>
<small>This email address is used for account verification and notifications.</small>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Update Email</button>
</div>
</form>
</div>
<div class="profile-card">
<h3>Change Password</h3> <h3>Change Password</h3>
<div class="form-group"> <p>Update your account password to keep your account secure.</p>
<label for="current_password">Current Password</label> <form method="POST" action="{{ url_for('profile') }}" class="password-form">
<input type="password" id="current_password" name="current_password" class="form-control"> <!-- Hidden email field to maintain current email -->
</div> <input type="hidden" name="email" value="{{ user.email }}">
<div class="form-group"> <div class="form-group">
<label for="new_password">New Password</label> <label for="current_password">Current Password</label>
<input type="password" id="new_password" name="new_password" class="form-control"> <input type="password" id="current_password" name="current_password" class="form-control" required>
</div> <small>Enter your current password to verify your identity.</small>
</div>
<div class="form-group">
<label for="confirm_password">Confirm New Password</label> <div class="form-group">
<input type="password" id="confirm_password" name="confirm_password" class="form-control"> <label for="new_password">New Password</label>
</div> <input type="password" id="new_password" name="new_password" class="form-control" required>
<small>Choose a strong password with at least 8 characters.</small>
<div class="form-group"> </div>
<button type="submit" class="btn btn-primary">Update Profile</button>
</div> <div class="form-group">
</form> <label for="confirm_password">Confirm New Password</label>
<input type="password" id="confirm_password" name="confirm_password" class="form-control" required>
<small>Re-enter your new password to confirm.</small>
</div>
<div class="form-group">
<button type="submit" class="btn btn-warning">Change Password</button>
</div>
</form>
</div>
<div class="security-section"> <div class="security-section">
<h2>Security Settings</h2> <h2>Security Settings</h2>
@@ -89,6 +109,24 @@
font-weight: bold; font-weight: bold;
} }
.profile-card {
background: #f8f9fa;
border: 1px solid #dee2e6;
border-radius: 0.5rem;
padding: 1.5rem;
margin: 1.5rem 0;
}
.profile-card h3 {
color: #007bff;
margin-bottom: 1rem;
}
.profile-card p {
color: #6c757d;
margin-bottom: 1.5rem;
}
.security-section { .security-section {
margin-top: 2rem; margin-top: 2rem;
padding-top: 2rem; padding-top: 2rem;
@@ -154,5 +192,48 @@
.btn-primary:hover { .btn-primary:hover {
background: #0056b3; background: #0056b3;
} }
.btn-warning {
background: #ffc107;
color: #212529;
}
.btn-warning:hover {
background: #e0a800;
}
.form-group {
margin-bottom: 1.5rem;
}
.form-group label {
display: block;
margin-bottom: 0.5rem;
font-weight: 500;
color: #333;
}
.form-control {
width: 100%;
padding: 0.75rem;
border: 1px solid #ced4da;
border-radius: 0.25rem;
font-size: 1rem;
line-height: 1.5;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-control:focus {
outline: none;
border-color: #007bff;
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.form-group small {
display: block;
margin-top: 0.25rem;
color: #6c757d;
font-size: 0.875rem;
}
</style> </style>
{% endblock %} {% endblock %}