Files
bunkerweb/ui/templates/login.html
2022-06-03 17:24:14 +02:00

150 lines
4.7 KiB
HTML
Executable File

<!DOCTYPE html>
{% block content %}
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>BunkerWeb UI</title>
<link href="images/favicon.ico" rel="icon" type="image/x-icon" />
<link href="webfonts/karla.css" rel="stylesheet" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/login.css" />
</head>
<body>
<div class="position-fixed bottom-0 end-0 p-3 pt-5 toast-container">
{% if error %}
<div
class="toast fade show"
role="alert"
aria-live="assertive"
aria-atomic="true"
>
<div class="toast-header">
<img
src="images/favicon.ico"
class="rounded me-2"
alt="BunkerWeb icon"
width="14"
height="14"
/>
<strong class="me-auto">BunkerWeb</strong>
<small style="color: rgb(168, 0, 0)">error</small>
<button
type="button"
class="btn-close"
data-bs-dismiss="toast"
aria-label="Close"
></button>
</div>
<div class="toast-body">{{ error }}</div>
</div>
{% endif %} {% with messages = get_flashed_messages(with_categories=true)
%} {% if messages %} {% for category, message in messages %}
<div
class="toast fade show"
role="alert"
aria-live="assertive"
aria-atomic="true"
>
<div class="toast-header">
<img
src="images/favicon.ico"
class="rounded me-2"
alt="BunkerWeb icon"
width="14"
height="14"
/>
<strong class="me-auto">BunkerWeb</strong>
<small style="color: rgb(168, 0, 0)">error</small>
<button
type="button"
class="btn-close"
data-bs-dismiss="toast"
aria-label="Close"
></button>
</div>
<div class="toast-body">{{ message|safe }}</div>
</div>
{% endfor %} {% endif %} {% endwith %}
</div>
<main>
<div class="container-fluid">
<div class="row">
<div class="col-sm-6 login-section-wrapper">
<div class="brand-wrapper d-sm-none">
<img
src="images/BUNKERWEB-print-hd.png"
alt="logo"
class="logo"
/>
</div>
<div class="login-wrapper my-auto">
<h1 class="login-title">Log in</h1>
<form action="login" method="POST" autocomplete="off">
<input
type="hidden"
name="csrf_token"
value="{{ csrf_token() }}"
/>
<input
type="hidden"
name="next"
value="{{ request.values.get('next', '') }}"
/>
<div class="form-group">
<label for="username">Username</label>
<input
type="username"
name="username"
id="username"
class="form-control"
placeholder="Username"
required=""
/>
</div>
<div class="form-group mb-4">
<label for="password">Password</label>
<input
type="password"
name="password"
id="password"
class="form-control"
placeholder="enter your password"
required=""
/>
</div>
<input
name="login"
id="login"
class="btn btn-block login-btn"
type="submit"
value="Login"
/>
</form>
</div>
</div>
<div class="col-sm-6 px-0 d-none d-sm-block">
<div id="particles-js" class="login-img"></div>
<img
src="images/BUNKERWEB-print-hd-blanc.png"
alt="logo"
class="images login-logo"
/>
</div>
</div>
</div>
</main>
<script src="js/tsparticles.bundle.min.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
<script>
tsParticles.loadJSON("particles-js", "json/particles.json");
</script>
</body>
</html>
{% endblock %}