client/views/admin/new-staff.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Banka | Admin</title>
<link rel="icon" type="image/x-icon" href="../../assets/img/logo.png">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="../../assets/css/main.css">
<link rel="stylesheet" type="text/css" href="../../assets/css/responsive.css">
</head>
<body>
<div class="ad-modal">
<button onclick="modalOpen(false)" class="modal-close">×</button>
<div class="modal-content center"></div>
</div>
<nav id="ad-nav">
<div id="logo">
<a href="../../../index.html">
<img src="../../assets/img/logo.png" alt="logo">
</a>
</div>
<div class="ad-nav-right">
<img id="avatar"
onclick="openDropDown(true)"
class="dropbtn"
src="../../assets/img/avatar.png"
/>
<!-- Dropdown content -->
<div class="dropdown-content" id="dropdown">
<a href="#" onclick="event.preventDefault();return logout();">
<i class="fas fa-info-circle"></i>
Logout
</a>
</div>
<!-- Hamburger links -->
<a href="#" onclick="event.preventDefault();openSlideMenu(this)">
<span class="open-slide">
<i class="fas fa-align-right fa-2x"></i>
</span>
</a>
<!-- Toast -->
<div class="toast success">
<img src="../../assets/img/check-mark.gif" alt="check-mark">
</div>
<div class="toast error">
<img src="../../assets/img/cross-mark.jpg" alt="cross-mark">
</div>
<!-- Side nav -->
<div id="side-menu" class="side-nav">
<li><a href="home.html">Dashboard</a></li>
<li><a href="accounts.html">All accounts</a></li>
<li><a href="new-staff.html">Add new staff</a></li>
<li onclick="event.preventDefault();return logout();"><a href="#">Logout</a></li>
</div>
</div>
</nav>
<div class="ad-main">
<section>
<aside>
<ul>
<a href="home.html">
<li>
<i class="fas fa-chart-line"></i>
Dashboard
</li>
</a>
<a href="users.html">
<li>
<i class="fas fa-users"></i>
Users
</li>
</a>
<a href="accounts.html">
<li>
<i class="fas fa-folder"></i>
Accounts
</li>
</a>
<a href="new-staff.html">
<li style="background: #076969">
<i class="fas fa-plus"></i>
Add new staff
</li>
</a>
<a href="#">
<li onclick="event.preventDefault();return logout();">
<i class="fas fa-info-circle"></i>
Logout
</li>
</a>
</ul>
</aside>
</section>
<section class="ad-main-showcase">
<div class="toast">
<img src="../../assets/img/check-mark.gif" alt="check-mark">
<figcaption>Account created successfully!</figcaption>
</div>
<header><h3>New user</h3></header>
<div class="ad-main-content">
<div class="new-user-form">
<form onsubmit="event.preventDefault(); return showToast()">
<div class="form-row">
<div class="form-input">
<input type="text" name="firstname" placeholder="First name" required>
</div>
</div>
<div class="form-row">
<div class="form-input">
<input type="text" name="lastname" placeholder="Last name" required>
</div>
</div>
<br/>
<div class="form-row">
<div class="form-input">
<input type="text" name="email" placeholder="Email" required>
</div>
</div>
<div class="form-row">
<div class="form-input">
<input type="password" name="password" placeholder="Password" required>
</div>
</div>
<br>
<div class="form-row">
<div class="form-input">
<label for="type">Select type</label>
<select name="type" id="type" required>
<option value="1">Admin</option>
<option value="2">Staff</option>
</select>
</div>
</div>
<br/>
<div class="form-row">
<div class="form-input">
<input class="button button-green" style="padding: 0.3em 1em; font-size: 18px" type="submit" value="Create account">
</div>
</div>
</div>
</form>
</div>
</div>
</section>
</div>
<script src="../../assets/js/middleware.js"></script>
<script>
document.readyState = withAuth();
</script>
<script src="../../assets/js/utils.js"></script>
<script src="../../assets/js/main.js"></script>
<script src="../../assets/js/dashboard.js"></script>
<script defer src="https://use.fontawesome.com/releases/v5.8.1/js/all.js" integrity="sha384-g5uSoOSBd7KkhAMlnQILrecXvzst9TdC09/VM+pjDTCM+1il8RHz5fKANTFFb+gQ" crossorigin="anonymous"></script>
</body>
</html>