auth_service_c/web/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/css/loginform.css">
    <link rel="stylesheet" href="/css/message.css">
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <title>admin</title>
</head>
<body>
<div class="navbar navbar-expand-lg bg-body-tertiary gap-3 p-2">
    <button class="btn btn-danger" id="exitbutton">Exit</button>
    <button class="btn btn-warning" id="adduserbutton">Adduser</button>
    <h1 class="usernameheader"></h1>
    <div class="form-check">
        <input type="checkbox" id="themecheckbox" class="form-check-input">
        <label for="themecheckbox" class="form-check-label">Dark theme</label>
    </div>
</div>

<div class="form loginform" id="loginform">
    <form class="formbody loginformbody" id="loginformbody">
        <h1 class="loginformheader">Login</h1>
        <div class="form-floating mb-3">
            <input type="text" required id="loginforminputusername" class="form-control" placeholder="John">
            <label for="loginforminputusername">Username</label>
        </div>
        <div class="form-floating mb-3">
            <input type="password" required id="loginforminputpassword" class="form-control" placeholder="***">
            <label for="loginforminputpassword">Password</label>
        </div>
        <div class="d-grid gap-2">
            <button class="btn btn-primary">login</button>
        </div>
    </form>
</div>

<div class="form adduserform">
    <form class="formbody adduserformbody">
        <h1 class="loginformheader">Add User</h1>
        <div class="form-floating mb-3">
            <input type="text" required id="adduserformusername" class="form-control">
            <label for="adduserformusername">Username</label>
        </div>
        <div class="form-floating mb-3">
            <input type="text" required id="adduserformemail" class="form-control">
            <label for="adduserformemail">Email</label>
        </div>
        <div class="form-floating mb-3">
            <input type="password" required id="adduserformpassword" class="form-control">
            <label for="adduserformpassword">Password</label>
        </div>
        <div class="form-floating mb-3">
            <input type="text" required id="adduserformgroup" class="form-control">
            <label for="adduserformgroup">Group</label>
        </div>
        <div class="form-check">
            <input type="checkbox" id="adduserformissuperuser" class="form-check-input">
            <label for="adduserformissuperuser" class="form-check-label">Is Superuser</label>
        </div>
        <div class="d-grid gap-2">
            <button class="btn btn-primary">Add</button>
            <button id="canceladduser" class="btn btn-primary">Cancel</button>
        </div>
    </form>
</div>

<div class="form changeuserform">
    <form class="formbody changeuserformbody">
        <h1 class="loginformheader">Change User Data</h1>
        <div class="form-floating mb-3">
            <input type="text" required id="changeuserformusername" class="form-control" placeholder="Username">
            <label for="changeuserformusername">Username</label>
        </div>
        <div class="form-floating mb-3">
            <input type="text" id="changeuserformemail" class="form-control" placeholder="***">
            <label for="changeuserformemail">email</label>
        </div>
        <div class="form-floating mb-3">
            <input type="text" required id="changeuserformgroup" class="form-control">
            <label for="changeuserformgroup">Group</label>
        </div>
        <div class="form-check">
            <input type="checkbox" id="changeuserformissuperuser" class="form-check-input">
            <label for="changeuserformissuperuser" class="form-check-label">Is Superuser</label>
        </div>
        <div class="d-grid gap-2">
            <button class="btn btn-primary">Change</button>
            <button id="cancelchangeuser" class="btn btn-primary">Cancel</button>
        </div>
    </form>
</div>

<div class="form confirmform">
    <div class="formbody confirmformbody">
        <h1>Are you sure?</h1>
        <div class="d-grid gap-2">
            <button id="yes" class="btn btn-primary">Confirm</button>
            <button id="no" class="btn btn-primary">Cancel</button>
        </div>
    </div>
</div>

<div class="form changepasswordform">
    <form class="formbody changepasswordformbody">
        <h1 class="loginformheader">Change Password</h1>
        <div class="form-floating mb-3">
            <input type="text" required id="changepasswordnewpassword" class="form-control" placeholder="***">
            <label for="changepasswordnewpassword">New password</label>
        </div>
        <div class="d-grid gap-2">
            <button class="btn btn-primary">Change</button>
            <button class="btn btn-primary" id="cancelchangepassword">Cancel</button>
        </div>
    </form>
</div>

<div class="message">
    <div class="messagetextbox">
        <h3 class="messagetext"></h3>
    </div>
</div>

<div class="table">
    <table class="table">
        <thead class="alluserstablehead">
            <tr>
                <th>id</th>
                <th>username</th>
                <th>email</th>
                <th>group</th>
                <th>is_superuser</th>
                <th>delete</th>
                <th>change password</th>
                <th>change user data</th>
            </tr>
        </thead>
        <tbody id="alluserstablebody"></tbody>
    </table>
</div>
<script src="/js/security.js"></script>
<script src="/js/message.js"></script>
<script src="/js/routes.js"></script>
<script src="/js/window.js"></script>
<script src="/js/theme.js"></script>
<script src="/js/login.js"></script>
<script src="/js/get_all_users.js"></script>
<script src="/js/add_user.js"></script>
<script src="/js/del_user.js"></script>
<script src="/js/change_password.js"></script>
<script src="/js/change_user.js"></script>
<script src="/js/bootstrap.min.js"></script>
</body>
</html>