mirror of
https://github.com/ae-utbm/sith.git
synced 2025-07-01 15:45:17 +00:00
rework login page CSS
This commit is contained in:
parent
63b898be35
commit
e324f32fde
78
core/static/user/login.scss
Normal file
78
core/static/user/login.scss
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
html,
|
||||||
|
body {
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#page {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#quick_notif,
|
||||||
|
#info_boxes,
|
||||||
|
#page > nav {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 10px !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
background-color: white !important;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
> div,
|
||||||
|
> form {
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 10px;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 500px;
|
||||||
|
|
||||||
|
> div {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
> label {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
@media (min-width: 500px) {
|
||||||
|
width: 300px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> input,
|
||||||
|
> div > input {
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 500px;
|
||||||
|
|
||||||
|
@media (min-width: 500px) {
|
||||||
|
max-width: 300px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .danger,
|
||||||
|
> div > error {
|
||||||
|
color: red;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
@ -1,35 +1,65 @@
|
|||||||
{% extends "core/base.jinja" %}
|
{% extends "core/base.jinja" %}
|
||||||
|
|
||||||
|
{%- block additional_css -%}
|
||||||
|
<link rel="stylesheet" href="{{ scss('core/override.scss') }}">
|
||||||
|
<link rel="stylesheet" href="{{ scss('user/login.scss') }}">
|
||||||
|
{%- endblock -%}
|
||||||
|
|
||||||
{% block title %}
|
{% block title %}
|
||||||
{% trans %}Login{% endtrans %}
|
{% trans %}Login{% endtrans %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
{% if form.errors %}
|
|
||||||
<p>{% trans %}Your username and password didn't match. Please try again.{% endtrans %}</p>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% if next %}
|
{% if next %}
|
||||||
{% if user.is_authenticated %}
|
{% if user.is_authenticated %}
|
||||||
<p>{% trans %}Your account doesn't have access to this page. To proceed,
|
<p>{% trans %}Your account doesn't have access to this page. To proceed,
|
||||||
please login with an account that has access.{% endtrans %}</p>
|
please login with an account that has access.{% endtrans %}</p>
|
||||||
{% else %}
|
{% else %}
|
||||||
<p>{% trans %}Please login or create an account to see this page.{% endtrans %}</p>
|
<p>{% trans %}Please login or create an account to see this page.{% endtrans %}</p>
|
||||||
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<form method="post" action="{{ url('core:login') }}">
|
<form method="post" action="{{ url('core:login') }}">
|
||||||
{% csrf_token %}
|
{% if form.errors %}
|
||||||
<p>{{ form.username.errors }}<label for="{{ form.username.name }}">{{ form.username.label }}
|
<p class="danger">{% trans %}Your username and password didn't match. Please try again.{% endtrans %}</p>
|
||||||
</label><input id="id_username" maxlength="254" name="username" type="text" autofocus="autofocus" /></p>
|
<br>
|
||||||
<p>{{ form.password.errors }}<label for="{{ form.password.name }}">{{ form.password.label }}</label>{{ form.password }}</p>
|
{% endif %}
|
||||||
<input type="hidden" name="next" value="{{ next }}">
|
|
||||||
<p><input type="submit" value="{% trans %}login{% endtrans %}"></p>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
{# Assumes you setup the password_reset view in your URLconf #}
|
{% csrf_token %}
|
||||||
<p><a href="{{ url('core:password_reset') }}">{% trans %}Lost password?{% endtrans %}</a></p>
|
|
||||||
<p><a href="{{ url('core:register') }}">{% trans %}Create account{% endtrans %}</a></p>
|
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label for="{{ form.username.name }}">{{ form.username.label }}</label>
|
||||||
|
<input id="id_username" maxlength="254" name="username" type="text" autofocus="autofocus" />
|
||||||
|
{{ form.username.errors }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label for="{{ form.password.name }}">{{ form.password.label }}</label>
|
||||||
|
{{ form.password }}
|
||||||
|
{{ form.password.errors }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input type="hidden" name="next" value="{{ next }}">
|
||||||
|
<input type="submit" value="{% trans %}Login{% endtrans %}">
|
||||||
|
|
||||||
|
|
||||||
|
{# Assumes you setup the password_reset view in your URLconf #}
|
||||||
|
<p>
|
||||||
|
<a href="{{ url('core:password_reset') }}">{% trans %}Lost password?{% endtrans %}</a>
|
||||||
|
|
||||||
|
<a href="{{ url('core:register') }}">{% trans %}Create account{% endtrans %}</a>
|
||||||
|
</p>
|
||||||
|
</form>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block additional_js %}
|
||||||
|
<script defer>
|
||||||
|
$(() => {
|
||||||
|
$("#info_boxes").remove();
|
||||||
|
$("#page > nav").remove();
|
||||||
|
$("#quick_notif").remove();
|
||||||
|
})
|
||||||
|
</script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user