beautipimped the login

This commit is contained in:
gw3000 2023-07-15 21:45:45 +02:00
parent 813ca89161
commit 12c6d762e2
3 changed files with 60 additions and 75 deletions

4
app/static/css/login.css Normal file
View file

@ -0,0 +1,4 @@
.card {
width: 500px;
max-width: 100%;
}

View file

@ -1,48 +1,46 @@
h1 { h1 {
margin-bottom: 2rem; margin-bottom: 2rem;
color: #0068b4; color: #0068b4;
font-weight: bold; font-weight: bold;
} }
.logowvh { .logowvh {
display: block; display: block;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
max-height: 15rem; max-height: 15rem;
aspect-ratio: 1/1; aspect-ratio: 1/1;
margin-top: 2rem; margin-top: 0.6rem;
margin-bottom: 2rem; margin-bottom: 0.6rem;
} }
#loginMain{ #loginMain {
color: #0068b4; color: #0068b4;
font-weight: bold; font-weight: bold;
font-size: 1.5rem; font-size: 1.5rem;
text-decoration: none; text-decoration: none;
} }
.rounded-pill { .rounded-pill {
margin-left: 5px; margin-left: 5px;
} }
.footer { .footer {
font-size: small; font-size: small;
} }
#wfvmainsquare{ #wfvmainsquare {
width: 100px; width: 100px;
height: 100px; height: 100px;
background-color: #0068b4; background-color: #0068b4;
rotate: 70deg; rotate: 70deg;
margin: 3%; margin: 3%;
border: 3px solid #b1b2b3; border: 3px solid #b1b2b3;
} }
.wfvwhitesquare{ .wfvwhitesquare {
width: 20%; width: 20%;
height: 50%; height: 50%;
background-color: white; background-color: white;
position: absolute; position: absolute;
margin-left: 15%; margin-left: 15%;
} }

View file

@ -1,48 +1,31 @@
{% extends "base.html" %} {% extends "base.html" %}
{% load i18n %}
{% load i18n %} {% load static %}
{% load crispy_forms_tags %} {% load crispy_forms_tags %}
{% block header %}
{% load account socialaccount %} <link rel="stylesheet" href="{% static 'css/login.css' %}">
{% endblock header %}
{% block head_title %}{% trans "Sign In" %}{% endblock %} {% block head_title %}{% trans "Sign In" %}{% endblock head_title %}
{% block content %} {% block content %}
<div class="row"> <div class="row">
<div class="col-lg-5"> <img class="logowvh" src="{% static 'img/wvhLogo.svg'%}" alt="" >
<div class="d-flex justify-content-center mt-5">
<h1>{% trans "Sign In" %}</h1> <div class="card shadow-sm p-3 mb-5 bg-body rounded">
<div class="card-body">
{% get_providers as socialaccount_providers %} {% comment %} <p class="">Willkommen bei der Fallen Birdy App</p> {% endcomment %}
{% comment %} <form class="login" method="POST" action="{% url 'account_login' %}">
{% if socialaccount_providers %} {% csrf_token %}
<p>{% blocktrans with site.name as site_name %}Please sign in with one {{ form|crispy }}
of your existing third party accounts. Or, <a href="{{ signup_url }}">sign up</a> {% if redirect_field_value %}
for a {{ site_name }} account and sign in below:{% endblocktrans %}</p> <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}"/>
{% endif %}
<div class="socialaccount_ballot"> <div class="btn-group" data-toggle="buttons">
<ul class="socialaccount_providers"> <a class="btn btn-danger btn-block" href="{% url 'account_reset_password' %}">{% trans "Forgot Password?" %}</a>
{% include "socialaccount/snippets/provider_list.html" with process="login" %} <button class="btn btn-primary" type="submit">{% trans "Sign In" %}</button>
</ul> </div>
<div class="login-or">{% trans 'or' %}</div> </form>
</div>
</div>
</div>
</div> </div>
{% include "socialaccount/snippets/login_extra.html" %}
{% else %}
<p>{% blocktrans %}If you have not created an account yet, then please
<a href="{{ signup_url }}">sign up</a> first.{% endblocktrans %}</p>
{% endif %} {% endcomment %}
<form class="login" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{{ form|crispy }}
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<a class="btn btn-danger" href="{% url 'account_reset_password' %}">{% trans "Forgot Password?" %}</a>
<button class="btn btn-primary" type="submit">{% trans "Sign In" %}</button>
</form>
</div>
{% endblock %} {% endblock %}