mirror of
https://github.com/gabehf/BudgetBuddy.git
synced 2026-03-07 21:48:14 -08:00
edited settings page
This commit is contained in:
parent
47b4ed5987
commit
b9e45987e4
1 changed files with 72 additions and 72 deletions
|
|
@ -41,84 +41,84 @@ export default function Settings() {
|
|||
return (
|
||||
<>
|
||||
<div className="container overflow-auto">
|
||||
<h4 className="mt-4 mb-4">Profile Settings</h4>
|
||||
<h4 className="mt-4 mb-4">Profile Settings</h4>
|
||||
|
||||
<h5 className="mb-4">Email and Name</h5>
|
||||
<form className="needs-validation" noValidate>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="staticEmail" className="col-2 col-form-label">Email</label>
|
||||
<div className="col-4">
|
||||
<input type="text" readOnly className="form-control-plaintext" id="staticEmail" value="daniel_quinonezrosario@student.uml.edu" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="currentName" className="col-2 col-form-label">Current Name</label>
|
||||
<div className="col-4">
|
||||
<input type="text" readOnly className="form-control-plaintext" id="currentName" value="Daniel" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="newName" className="col-2 col-form-label">New Name</label>
|
||||
<div className="col-4">
|
||||
<input type="text" className="form-control" id="newName" required />
|
||||
<div className="invalid-feedback">
|
||||
Please enter a new name
|
||||
<h5 className="mb-4">Email and Name</h5>
|
||||
<form className="needs-validation" noValidate>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="staticEmail" className="col-2 col-form-label">Email</label>
|
||||
<div className="col-4">
|
||||
<input type="text" readOnly className="form-control-plaintext" id="staticEmail" value="daniel_quinonezrosario@student.uml.edu" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="nameAlert"></div>
|
||||
<div>
|
||||
<button type="button" className="btn btn-primary mb-5" id="newNameButton" onClick={handleNameClick}>Change Name</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<h5 className="mb-4">Password</h5>
|
||||
<form className="needs-validation" noValidate>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="currentPassword" className="col-2 col-form-label">Current Password</label>
|
||||
<div className="col-4">
|
||||
<input type="password" className="form-control" id="currentPassword" minLength="8" required />
|
||||
<div className="invalid-feedback">
|
||||
Please enter your current password
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="currentName" className="col-2 col-form-label">Current Name</label>
|
||||
<div className="col-4">
|
||||
<input type="text" readOnly className="form-control-plaintext" id="currentName" value="Daniel" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="newName" className="col-2 col-form-label">New Name</label>
|
||||
<div className="col-4">
|
||||
<input type="text" className="form-control" id="newName" required />
|
||||
<div className="invalid-feedback">
|
||||
Please enter a new name
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="nameAlert"></div>
|
||||
<div>
|
||||
<button type="button" className="btn btn-primary mb-5" id="newNameButton" onClick={handleNameClick}>Change Name</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<h5 className="mb-4">Password</h5>
|
||||
<form className="needs-validation" noValidate>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="currentPassword" className="col-2 col-form-label">Current Password</label>
|
||||
<div className="col-4">
|
||||
<input type="password" className="form-control" id="currentPassword" minLength="8" required />
|
||||
<div className="invalid-feedback">
|
||||
Please enter your current password
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="newPassword" className="col-2 col-form-label">New Password</label>
|
||||
<div className="col-4">
|
||||
<input type="password" className="form-control" id="newPassword" minLength="8" required />
|
||||
<div className="invalid-feedback">
|
||||
Please enter a new password
|
||||
<br />
|
||||
Your new password must be at least 8 characters long
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="passwordAlert"></div>
|
||||
<div>
|
||||
<button type="button" className="btn btn-primary mb-5" id="newPasswordButton" onClick={handlePasswordClick}>Change Password</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<h4 className="mb-4">Dark Mode</h4>
|
||||
|
||||
<div className="form-check form-switch mb-5">
|
||||
<input className="form-check-input" type="checkbox" id="darkModeCheckbox" onClick={toggleDarkMode}/>
|
||||
<label className="form-check-label" htmlFor="darkModeCheckbox">Enable Dark Mode</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<label htmlFor="newPassword" className="col-2 col-form-label">New Password</label>
|
||||
<div className="col-4">
|
||||
<input type="password" className="form-control" id="newPassword" minLength="8" required />
|
||||
<div className="invalid-feedback">
|
||||
Please enter a new password
|
||||
|
||||
{/*<h4 className="mb-4">Account Settings</h4>
|
||||
|
||||
<div className="mb-4">
|
||||
<button type="button" className="btn btn-danger">Delete Account</button>
|
||||
<br />
|
||||
Your new password must be at least 8 characters long
|
||||
<div className="mt-2">
|
||||
CAUTION: This will delete your account. All account and profile data
|
||||
will be completely erased.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="passwordAlert"></div>
|
||||
<div>
|
||||
<button type="button" className="btn btn-primary mb-5" id="newPasswordButton" onClick={handlePasswordClick}>Change Password</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<h4 className="mb-4">Dark Mode</h4>
|
||||
|
||||
<div className="form-check form-switch mb-5">
|
||||
<input className="form-check-input" type="checkbox" id="darkModeCheckbox" onClick={toggleDarkMode}/>
|
||||
<label className="form-check-label" htmlFor="darkModeCheckbox">Enable Dark Mode</label>
|
||||
</div>
|
||||
|
||||
<h4 className="mb-4">Account Settings</h4>
|
||||
|
||||
<div className="mb-4">
|
||||
<button type="button" className="btn btn-danger">Delete Account</button>
|
||||
<br />
|
||||
<div className="mt-2">
|
||||
CAUTION: This will delete your account. All account and profile data
|
||||
will be completely erased.
|
||||
</div>
|
||||
</div>
|
||||
</div>*/}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue