misp-modules/website/app/templates/account/login.html

126 lines
4.6 KiB
HTML

<!--
Author: David Cruciani
-->
{% import 'macros/form_macros.html' as f %}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Flowintel-cm</title>
<script src="{{ url_for('static',filename='js/popper.min.js') }}"></script>
<script src="{{ url_for('static',filename='bootstrap-5.3.0/js/bootstrap.min.js') }}"></script>
<script src="{{ url_for('static',filename='js/jquery.min.js') }}"></script>
<script src="{{ url_for('static',filename='js/jquery-ui.js') }}"></script>
<script src="{{ url_for('static',filename='js/vue.global.js') }}"></script>
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='bootstrap-5.3.0/css/bootstrap.min.css') }}">
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='fontawesome-6.3.0/css/fontawesome.css') }}">
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='fontawesome-6.3.0/css/solid.css') }}">
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='css/jquery-ui.css') }}">
<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
html, body {
height: 100%;
}
body {
display: flex;
align-items: center;
padding-top: 40px;
padding-bottom: 40px;
background-color: #f5f5f5;
}
.form-signin {
width: 100%;
max-width: 330px;
padding: 15px;
margin: auto;
}
.form-signin .checkbox {
font-weight: 400;
}
.form-signin .form-floating:focus-within {
z-index: 2;
}
.form-signin input[type="email"] {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
</style>
</head>
<body>
<main class="form-signin">
{% include 'macros/_flashes.html' %}
{% set flashes = {
'error': get_flashed_messages(category_filter=['form-error']),
'warning': get_flashed_messages(category_filter=['form-check-email']),
'info': get_flashed_messages(category_filter=['form-info']),
'success': get_flashed_messages(category_filter=['form-success'])
} %}
<form action="" method="post">
{{ form.hidden_tag() }}
<div class="mb-3">
{{form.password.label}}:
{{form.password(class_="form-control")}}
</div>
<div class="checkbox mb-3">
{{form.remember_me.label}}:
{{form.remember_me}}
</div>
{{ f.form_message(flashes['error'], header='Something went wrong.', class='error') }}
{{ f.form_message(flashes['warning'], header='Check your email.', class='warning') }}
{{ f.form_message(flashes['info'], header='Information', class='info') }}
{{ f.form_message(flashes['success'], header='Success!', class='success') }}
{{form.submit(class='btn btn-primary')}}
</form>
</main>
<!--Main layout-->
{# Implement CSRF protection for site #}
{% if csrf_token()|safe %}
<div style="visibility: hidden; display: none">
<input type="hidden" id="csrf_token" name="csrf_token" value="{{ csrf_token()|safe }}">
</div>
{% endif %}
</body>
<script>
$('.message').each((i, el) => {
const $el = $(el);
const $xx = $el.find('.close');
const sec = $el.data('autohide');
const triggerRemove = () => clearTimeout($el.trigger('remove').T);
$el.one('remove', () => $el.remove());
$xx.one('click', triggerRemove);
if (sec) $el.T = setTimeout(triggerRemove, sec * 1000);
});
</script>
</html>