85 lines
2.6 KiB
HTML
85 lines
2.6 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block media %}
|
|
<style>
|
|
#login-panel {
|
|
display: inline-block;
|
|
position: relative;
|
|
margin: 5em auto auto -10em;
|
|
top: 40%;
|
|
left: 50%;
|
|
}
|
|
|
|
h4 {
|
|
padding-top: 1em;
|
|
}
|
|
|
|
.social {
|
|
display: inline;
|
|
font-size: 2.3em;
|
|
float: none;
|
|
}
|
|
|
|
.google-icon i {
|
|
color: #DD4B38;
|
|
}
|
|
|
|
.facebook-icon i {
|
|
color: #133783;
|
|
}
|
|
|
|
.github-icon i {
|
|
color: black;
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block body %}
|
|
<div id="login-panel">
|
|
<form action="" method="post" class="form-area">
|
|
{% csrf_token %}
|
|
{% if form.errors %}
|
|
<div id="form-errors">
|
|
<p class="error">{{ _('Invalid username or password.') }}</p>
|
|
</div>
|
|
{% endif %}
|
|
<table border="0" style="text-align:left">
|
|
<tr>
|
|
<th><i class="fa fa-user fa-fw"></i>
|
|
</th>
|
|
<td>{{ form.username }}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th><i class="fa fa-key fa-fw"></i>
|
|
</th>
|
|
<td>{{ form.password }}
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
<button style="float:right;" type="submit">{{ _('Login!') }}</button>
|
|
<input type="hidden" name="next" value="{{ next }}">
|
|
</form>
|
|
<br><a href="{{ url('password_reset') }}">{{ _('Forgot your password?') }}</a>
|
|
|
|
{% if form.has_google_auth or form.has_facebook_auth or form.has_github_auth %}
|
|
<h4>{{ _('Or log in with...') }}</h4>
|
|
{% if form.has_google_auth %}
|
|
<a href="{{ url('social:begin', "google-oauth2") }}?next={{ next }}" class="social google-icon">
|
|
<i class="fa fa-google-plus-square"></i>
|
|
</a>
|
|
{% endif %}
|
|
{% if form.has_facebook_auth %}
|
|
<a href="{{ url('social:begin', "facebook") }}?next={{ next }}" class="social facebook-icon">
|
|
<i class="fa fa-facebook-square"></i>
|
|
</a>
|
|
{% endif %}
|
|
{% if form.has_github_auth %}
|
|
<a href="{{ url('social:begin', "github-secure") }}?next={{ next }}" class="social github-icon">
|
|
<i class="fa fa-github-square"></i>
|
|
</a>
|
|
{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|