cl-deck-builder2/templates/user/login.html
2024-03-05 22:11:33 -05:00

79 lines
2.5 KiB
HTML

{% extends "layouts/minimal.html" %}
{% block title %}{_ "Login" _}{% endblock %}
{% block content %}
<style>
/* https://stackoverflow.com/a/49278385 */
html {
overflow-y: scroll;
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* Internet Explorer 10+ */
}
html::-webkit-scrollbar { /* WebKit */
width: 0;
height: 0;
}
body {
background-image: url("/img/rune-full-white.png");
background-position: center;
background-size: cover;
}
</style>
<form id="login-form" name="login-form" action="/user/login" method="POST">
{{ token | safe }}
</form>
<div class="hero is-fullheight">
<div class="hero-body">
<div class="container">
<div class="columns is-centered">
<div class="column is-5-tablet is-4-desktop is-3-widescreen">
{% include "messages.html" %}
</div>
<div class="column is-5-tablet is-4-desktop is-3-widescreen">
<div class="box">
<div class="field">
<label class="label" for="email">Email</label>
<div class="control has-icons-left">
<input class="input" form="login-form" name="email" id="email" type="text" placeholder="e.g. bobsmith@gmail.com" required>
<span class="icon is-small is-left">
<i class="fa fa-envelope"></i>
</span>
</div>
</div>
<div class="field">
<label class="label" for="password">Password</label>
<div class="control has-icons-left">
<input class="input" form="login-form" name="password" id="password" type="password" placeholder="*******" required>
<span class="icon is-small is-left">
<i class="fa fa-lock"></i>
</span>
</div>
</div>
<div class="field is-grouped is-grouped-centered">
<div class="control">
<label for="remember-me" class="checkbox">
<input type="checkbox" id="remember-me" name="remember-me">
Remember me
</label>
</div>
</div>
<div class="field">
<button class="button is-success is-fullwidth" form="login-form" type="submit">Login</button>
</div>
<hr>
<div class="field">
<a class="button is-link is-fullwidth" href="/user/register">Register</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}