127 lines
4.5 KiB
HTML
127 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<link rel="stylesheet" href="/assets/css/defaults.css" />
|
|
<link rel="stylesheet" href="/assets/css/user.css" />
|
|
<title>Task Manager | User Page</title>
|
|
</head>
|
|
<body>
|
|
<section class="nav-section">
|
|
<nav class="nav">
|
|
<a class="nav-home" href="/">Task</a>
|
|
<button id="nav-logout" class="nav-logout">Logout</a>
|
|
</nav>
|
|
</section>
|
|
|
|
<section class="main-section">
|
|
<div class="main-grid">
|
|
<div class="left-grid">
|
|
<h2>User Management</h2>
|
|
<h4>Change Email?</h4>
|
|
<button id="change-email-btn">Click here</button>
|
|
<h4>Change Password?</h4>
|
|
<button id="change-password-btn">Click here</button>
|
|
<h4>Change Username?</h4>
|
|
<button id="change-username-btn">Click here</button>
|
|
|
|
</div>
|
|
<div class="right-grid">
|
|
<h2>User Tasks</h2>
|
|
<div id='tooltip' class="tooltip" style="display: none;"></div>
|
|
<div class="user-tasks">
|
|
</div>
|
|
<button id="add-task-button" class="add-task-button">Add a task</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="email-modal">
|
|
<div class="main-modal">
|
|
<div class="close-email-modal"><i class="fa-solid fa-x"></i></div>
|
|
<div class="modal-header">
|
|
<h2>Change email?</h2>
|
|
<p>Enter a new email below</p>
|
|
</div>
|
|
<div class="modal-content">
|
|
<label for="modal-email-input">Email</label>
|
|
<input id="modal-email-input" class="modal-email-input" placeholder="johndoe234@gmail.com" />
|
|
</div>
|
|
|
|
<button class="submit-email-btn">Save Changes</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="password-modal">
|
|
<div class="main-modal">
|
|
<div class="close-password-modal"><i class="fa-solid fa-x"></i></div>
|
|
<div class="modal-header">
|
|
<h2>Change password?</h2>
|
|
<p>Enter a new password below</p>
|
|
</div>
|
|
<div class="modal-content">
|
|
<label for="modal-password-input">Password</label>
|
|
<input id="modal-password-input" class="modal-password-input" />
|
|
<label for="modal-verify-password-input">Verify Password</label>
|
|
<input id="modal-verify-password-input" class="modal-verify-password-input" />
|
|
</div>
|
|
|
|
<button class="submit-password-btn">Save Changes</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="username-modal">
|
|
<div class="main-modal">
|
|
<div class="close-username-modal"><i class="fa-solid fa-x"></i></div>
|
|
<div class="modal-header">
|
|
<h2>Change username?</h2>
|
|
<p>Enter a new username below</p>
|
|
</div>
|
|
<div class="modal-content">
|
|
<label for="modal-username-input">Username</label>
|
|
<input id="modal-username-input" class="modal-username-input" placeholder="johndoe234" />
|
|
</div>
|
|
|
|
<button class="submit-username-btn">Save Changes</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="add-task-modal">
|
|
<div class="main-modal">
|
|
<div class="close-task-modal"><i class="fa-solid fa-x"></i></div>
|
|
<div class="modal-header">
|
|
<h2>Add a task</h2>
|
|
<p>Enter a new task below</p>
|
|
</div>
|
|
<div class="modal-content">
|
|
<label for="modal-name-input">Name</label>
|
|
<input id="modal-name-input" class="modal-name-input" />
|
|
<label for="modal-description-input">Description</label>
|
|
<input id="modal-description-input" class="modal-description-input" />
|
|
</div>
|
|
|
|
<button class="submit-task-btn">Save Changes</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="task-modal">
|
|
<div class="main-modal">
|
|
<div class="close-edit-task-modal"><i class="fa-solid fa-x"></i></div>
|
|
<div class="modal-header">
|
|
<h2>Finish API</h2>
|
|
<p>View task details</p>
|
|
</div>
|
|
<div class="modal-content">
|
|
<label for="modal-description-input">Description</label>
|
|
<input id="modal-description-input" class="modal-description-input" placeholder="Finish the task API" />
|
|
<label for="modal-completed-status">Is it completed?</label>
|
|
<p id="modal-completed-status" class="modal-completed-status"></p>
|
|
</div>
|
|
|
|
<button class="submit-task-btn">Save Changes</button>
|
|
</div>
|
|
</section>
|
|
|
|
<script src="/assets/js/user.js"></script>
|
|
<script src="https://kit.fontawesome.com/a478227047.js" crossorigin="anonymous"></script>
|
|
</body>
|
|
</html> |