edited settings page

main
danielq65 3 years ago committed by GitHub
parent 47b4ed5987
commit b9e45987e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -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> </div>
<div className="row mb-3"> <div className="row mb-3">
<label htmlFor="currentName" className="col-2 col-form-label">Current Name</label> <label htmlFor="currentName" className="col-2 col-form-label">Current Name</label>
<div className="col-4"> <div className="col-4">
<input type="text" readOnly className="form-control-plaintext" id="currentName" value="Daniel" /> <input type="text" readOnly className="form-control-plaintext" id="currentName" value="Daniel" />
</div> </div>
</div> </div>
<div className="row mb-3"> <div className="row mb-3">
<label htmlFor="newName" className="col-2 col-form-label">New Name</label> <label htmlFor="newName" className="col-2 col-form-label">New Name</label>
<div className="col-4"> <div className="col-4">
<input type="text" className="form-control" id="newName" required /> <input type="text" className="form-control" id="newName" required />
<div className="invalid-feedback"> <div className="invalid-feedback">
Please enter a new name Please enter a new name
</div>
</div>
</div> </div>
</div>
</div>
<div id="nameAlert"></div> <div id="nameAlert"></div>
<div> <div>
<button type="button" className="btn btn-primary mb-5" id="newNameButton" onClick={handleNameClick}>Change Name</button> <button type="button" className="btn btn-primary mb-5" id="newNameButton" onClick={handleNameClick}>Change Name</button>
</div> </div>
</form> </form>
<h5 className="mb-4">Password</h5> <h5 className="mb-4">Password</h5>
<form className="needs-validation" noValidate> <form className="needs-validation" noValidate>
<div className="row mb-3"> <div className="row mb-3">
<label htmlFor="currentPassword" className="col-2 col-form-label">Current Password</label> <label htmlFor="currentPassword" className="col-2 col-form-label">Current Password</label>
<div className="col-4"> <div className="col-4">
<input type="password" className="form-control" id="currentPassword" minLength="8" required /> <input type="password" className="form-control" id="currentPassword" minLength="8" required />
<div className="invalid-feedback"> <div className="invalid-feedback">
Please enter your current password 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>
</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>
<div id="passwordAlert"></div> <div id="passwordAlert"></div>
<div> <div>
<button type="button" className="btn btn-primary mb-5" id="newPasswordButton" onClick={handlePasswordClick}>Change Password</button> <button type="button" className="btn btn-primary mb-5" id="newPasswordButton" onClick={handlePasswordClick}>Change Password</button>
</div> </div>
</form> </form>
<h4 className="mb-4">Dark Mode</h4> <h4 className="mb-4">Dark Mode</h4>
<div className="form-check form-switch mb-5"> <div className="form-check form-switch mb-5">
<input className="form-check-input" type="checkbox" id="darkModeCheckbox" onClick={toggleDarkMode}/> <input className="form-check-input" type="checkbox" id="darkModeCheckbox" onClick={toggleDarkMode}/>
<label className="form-check-label" htmlFor="darkModeCheckbox">Enable Dark Mode</label> <label className="form-check-label" htmlFor="darkModeCheckbox">Enable Dark Mode</label>
</div> </div>
<h4 className="mb-4">Account Settings</h4> {/*<h4 className="mb-4">Account Settings</h4>
<div className="mb-4"> <div className="mb-4">
<button type="button" className="btn btn-danger">Delete Account</button> <button type="button" className="btn btn-danger">Delete Account</button>
<br /> <br />
<div className="mt-2"> <div className="mt-2">
CAUTION: This will delete your account. All account and profile data CAUTION: This will delete your account. All account and profile data
will be completely erased. will be completely erased.
</div> </div>
</div> </div>*/}
</div> </div>
</> </>
); );

Loading…
Cancel
Save