Merge branch 'ui-design-login'
This commit is contained in:
Santiago Lamora
commit
daa6aee70b
|
|
@ -42,3 +42,60 @@ a:hover {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: #6d7fcc;
|
background: #6d7fcc;
|
||||||
}*/
|
}*/
|
||||||
|
|
||||||
|
.vertical-center {
|
||||||
|
min-height: 100%; /* Fallback for browsers do NOT support vh unit */
|
||||||
|
min-height: 100vh; /* These two lines are counted as one :-) */
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** bootstrap override **/
|
||||||
|
.btn-primary {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #8DB823;
|
||||||
|
border-color: #8DB823;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary:hover,
|
||||||
|
.btn-primary:not(:disabled):not(.disabled).active,
|
||||||
|
.btn-primary:not(:disabled):not(.disabled):active,
|
||||||
|
.show>.btn-primary.dropdown-toggle {
|
||||||
|
color: #fff;
|
||||||
|
background-color: #acc862;
|
||||||
|
border-color: #ccde98;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary.focus, .btn-primary:focus {
|
||||||
|
box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** login **/
|
||||||
|
#body-login .jumbotron {
|
||||||
|
background: #282532;/**#50466E;**/
|
||||||
|
}
|
||||||
|
|
||||||
|
#login-content {
|
||||||
|
background:white;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#login-content input[type="text"].form-control,
|
||||||
|
#login-content input[type="password"].form-control {
|
||||||
|
border-radius: 0;
|
||||||
|
border: 0;
|
||||||
|
border-bottom: 2px solid #8E8E8E;
|
||||||
|
}
|
||||||
|
|
||||||
|
#login-content .form-actions-no-box {
|
||||||
|
margin-top: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#login-footer {
|
||||||
|
margin-top: 1.5rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#login-footer a {
|
||||||
|
color: #FEFBF2;
|
||||||
|
}
|
||||||
|
|
|
||||||
BIN
musician/static/musician/images/logo-pangea-monocrome-h.png
Normal file
BIN
musician/static/musician/images/logo-pangea-monocrome-h.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -1,50 +1,72 @@
|
||||||
{% extends "auth/login_base.html" %}
|
{% extends "musician/base.html" %}
|
||||||
{% load i18n %}
|
{% load i18n static %}
|
||||||
|
|
||||||
{% block login_content %}
|
{% block body %}
|
||||||
<div>
|
|
||||||
<form action="{% url 'musician:login' %}" role="form" method="post">
|
|
||||||
{% csrf_token %}
|
|
||||||
<input type="hidden" name="next" value="{{ next }}" />
|
|
||||||
|
|
||||||
<div id="div_id_username" class="clearfix control-group {% if form.username.errors %}error{% endif %}">
|
<body id="body-login">
|
||||||
<div class="form-group">
|
<div class="jumbotron vertical-center">
|
||||||
<label for="id_username">{{ form.username.label }}:</label>
|
<div id="login-wrapper" class="container" style="width: 430px;">
|
||||||
<input type="text" name="username" maxlength="100" autocapitalize="off" autocorrect="off"
|
<div id="login-content" class="rounded">
|
||||||
class="form-control textinput textInput" id="id_username" required autofocus
|
<div id="login-branding">
|
||||||
{% if form.username.value %}value="{{ form.username.value }}" {% endif %}>
|
{% block branding %}
|
||||||
{% if form.username.errors %}
|
<h1>
|
||||||
<p class="text-error">
|
<img class="img-fluid" src="{% static 'musician/images/logo-pangea-monocrome-h.png' %}"
|
||||||
{{ form.username.errors|striptags }}
|
alt="Pangea.org - Internet etic i solidari" />
|
||||||
</p>
|
</h1>
|
||||||
{% endif %}
|
{% endblock %}
|
||||||
|
</div><!-- /login-branding -->
|
||||||
|
<div class="mt-5">
|
||||||
|
<form action="{% url 'musician:login' %}" role="form" method="post">
|
||||||
|
{% csrf_token %}
|
||||||
|
<input type="hidden" name="next" value="{{ next }}" />
|
||||||
|
|
||||||
|
<div id="div_id_username"
|
||||||
|
class="clearfix control-group {% if form.username.errors %}error{% endif %}">
|
||||||
|
<div class="form-group">
|
||||||
|
<input type="text" name="username" maxlength="100" autocapitalize="off"
|
||||||
|
autocorrect="off" class="form-control textinput textInput" id="id_username" required
|
||||||
|
autofocus placeholder="{{ form.username.label }}"
|
||||||
|
{% if form.username.value %}value="{{ form.username.value }}" {% endif %}>
|
||||||
|
{% if form.username.errors %}
|
||||||
|
<p class="text-error">
|
||||||
|
{{ form.username.errors|striptags }}
|
||||||
|
</p>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="div_id_password"
|
||||||
|
class="clearfix control-group {% if form.password.errors %}error{% endif %}">
|
||||||
|
<div class="form-group">
|
||||||
|
<input type="password" name="password" maxlength="100" autocapitalize="off"
|
||||||
|
autocorrect="off" class="form-control textinput textInput" id="id_password"
|
||||||
|
placeholder="{{ form.password.label }}" required>
|
||||||
|
{% if form.password.errors %}
|
||||||
|
<p class="text-error">
|
||||||
|
{{ form.password.errors|striptags }}
|
||||||
|
</p>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% if form.non_field_errors %}
|
||||||
|
{% for error in form.non_field_errors %}
|
||||||
|
<div class="well well-small text-error" style="border: none">{{ error }}</div>
|
||||||
|
{% endfor %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<div class="form-actions-no-box">
|
||||||
|
<input type="submit" name="submit" value="{% trans 'Log in' %}"
|
||||||
|
class="btn btn-primary form-control" id="submit-id-submit">
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div><!-- /.row-fluid -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<!--/#login-content-->
|
||||||
|
<div id="login-footer">
|
||||||
<div id="div_id_password" class="clearfix control-group {% if form.password.errors %}error{% endif %}">
|
<a href="#password_reset">{% trans "Forgot your password? Click here to recover" %}</a>
|
||||||
<div class="form-group">
|
|
||||||
<label for="id_password">{{ form.password.label }}:</label>
|
|
||||||
<input type="password" name="password" maxlength="100" autocapitalize="off" autocorrect="off"
|
|
||||||
class="form-control textinput textInput" id="id_password" required>
|
|
||||||
{% if form.password.errors %}
|
|
||||||
<p class="text-error">
|
|
||||||
{{ form.password.errors|striptags }}
|
|
||||||
</p>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div><!-- /#login-wrapper -->
|
||||||
|
</div><!-- /.container-fluid -->
|
||||||
{% if form.non_field_errors %}
|
</body>
|
||||||
{% for error in form.non_field_errors %}
|
{% endblock %}
|
||||||
<div class="well well-small text-error" style="border: none">{{ error }}</div>
|
|
||||||
{% endfor %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<div><a href=#password_reset">{% trans "Have you forgot the password?" %}</a></div>
|
|
||||||
<div class="form-actions-no-box">
|
|
||||||
<input type="submit" name="submit" value="{% trans 'Log in' %}" class="btn btn-primary form-control"
|
|
||||||
id="submit-id-submit">
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
{% endblock login_content %}
|
|
||||||
|
|
|
||||||
|
|
@ -1,22 +0,0 @@
|
||||||
{% extends "musician/base.html" %}
|
|
||||||
|
|
||||||
{% block body %}
|
|
||||||
<body class="container">
|
|
||||||
<div class="container-fluid" style="margin-top: 30px;">
|
|
||||||
<div class="row-fluid">
|
|
||||||
<div class="well rounded" style="width: 320px; margin-left: auto; margin-right: auto; background: rgba(169, 169, 169, 0.25); padding: 1em;">
|
|
||||||
<div class="row-fluid">
|
|
||||||
<div>
|
|
||||||
{% block branding %}<h3 style="margin: 0 0 20px;">Musician <span class="small">v{{ version }}</span></h3>{% endblock %}
|
|
||||||
</div>
|
|
||||||
</div><!-- /row fluid -->
|
|
||||||
|
|
||||||
<div class="row-fluid">
|
|
||||||
{% block login_content %}
|
|
||||||
{% endblock login_content %}
|
|
||||||
</div><!-- /.row-fluid -->
|
|
||||||
</div><!--/.well-->
|
|
||||||
</div><!-- /.row-fluid -->
|
|
||||||
</div><!-- /.container-fluid -->
|
|
||||||
</body>
|
|
||||||
{% endblock %}
|
|
||||||
Loading…
Reference in a new issue