gabehf/BudgetBuddy
1
0
Fork 0
mirror of https://github.com/gabehf/BudgetBuddy.git synced 2026-03-16 02:36:01 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

edited settings page

Browse source
This commit is contained in:
danielq65 2023-04-17 14:28:55 -04:00 • committed by GitHub
parent 47b4ed5987
commit b9e45987e4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 72 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

144
src/pages/Settings.jsx
View file

@ -41,84 +41,84 @@ export default function Settings() {
return ( return (
<> <>
<div className="container overflow-auto"> <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> <h5 className="mb-4">Email and Name</h5>
<form className="needs-validation" noValidate> <form className="needs-validation" noValidate>
<div className="row mb-3"> <div className="row mb-3">
<label htmlFor="staticEmail" className="col-2 col-form-label">Email</label> <label htmlFor="staticEmail" className="col-2 col-form-label">Email</label>
<div className="col-4"> <div className="col-4">
<input type="text" readOnly className="form-control-plaintext" id="staticEmail" value="daniel_quinonezrosario@student.uml.edu" /> <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
</div> </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 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>
<div className="row mb-3"> {/*<h4 className="mb-4">Account Settings</h4>
<label htmlFor="newPassword" className="col-2 col-form-label">New Password</label>
<div className="col-4"> <div className="mb-4">
<input type="password" className="form-control" id="newPassword" minLength="8" required /> <button type="button" className="btn btn-danger">Delete Account</button>
<div className="invalid-feedback">
Please enter a new password
<br /> <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>*/}
</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>
</> </>
); );