From 10310fc62cf93e6d1c7316e1630b2cb8a1228c51 Mon Sep 17 00:00:00 2001 From: Christian Elberfeld <christian.elberfeld@adesso.de> Date: Mon, 22 Apr 2019 15:35:52 +0200 Subject: [PATCH] =?UTF-8?q?Design=20f=C3=BCr=20Forms,=20closes=20#5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Dockerfile | 1 + app/app/settings.py | 7 +++++++ app/templates/about.html | 28 +++++++++++++++++----------- app/templates/login.html | 27 ++++++++++++++++++++------- app/templates/main.html | 31 ++++++++++++++++--------------- 5 files changed, 61 insertions(+), 33 deletions(-) diff --git a/Dockerfile b/Dockerfile index fc83756..707f0c0 100644 --- a/Dockerfile +++ b/Dockerfile @@ -24,6 +24,7 @@ RUN pip3 install \ django>=2.0.2 \ django-auth-ldap \ django-bootstrap-static>=4.0 \ + django-crispy-forms \ django-mysql \ django-settings-export \ ldap3 \ diff --git a/app/app/settings.py b/app/app/settings.py index 1191644..222526e 100644 --- a/app/app/settings.py +++ b/app/app/settings.py @@ -36,6 +36,7 @@ INSTALLED_APPS = [ 'django.contrib.staticfiles', 'bootstrap', 'fontawesome', + 'crispy_forms', ] MIDDLEWARE = [ @@ -221,3 +222,9 @@ SETTINGS_EXPORT = [ 'DEBUG', 'APP_NAME' ] + +# +# Settings fpr Crispy +# + +CRISPY_TEMPLATE_PACK = 'bootstrap4' diff --git a/app/templates/about.html b/app/templates/about.html index 81a9053..b353dcf 100644 --- a/app/templates/about.html +++ b/app/templates/about.html @@ -3,17 +3,23 @@ {% block title %}About{% endblock %} {% block content %} - - <div class="jumbotron"> - <h1 class="display-4">About {{ settings.APP_NAME }}</h1> - <hr class="my-4"> - <p> - Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. +<div class="container"> + <div class="row"> + <div class="jumbotron" style="margin-top: 50px;"> + <h1 class="display-4">About {{ settings.APP_NAME }}</h1> + <hr class="my-4"> + <p> + Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et + dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet + clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, + consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed + diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea + takimata sanctus est Lorem ipsum dolor sit amet. + </p> + <p class="lead"> + <a class="btn btn-primary btn-lg" href="#" role="button">More Info</a> </p> - <p class="lead"> - <a class="btn btn-primary btn-lg" href="#" role="button">More Info</a> - </p> + </div> </div> - -{% endblock %} \ No newline at end of file + {% endblock %} \ No newline at end of file diff --git a/app/templates/login.html b/app/templates/login.html index 0659617..e5822de 100644 --- a/app/templates/login.html +++ b/app/templates/login.html @@ -1,14 +1,27 @@ {% extends 'base.html' %} +{% load crispy_forms_tags %} {% block title %}Login{% endblock %} {% block content %} -<h2>Login</h2> -<form method="post"> - <div class="form-group"> - {% csrf_token %} - {{ form.as_p }} +<div class="container"> + <div class="row"> + + <div class="container-fluid"> + <div class="card" style="width: 300px; margin-top: 50px;"> + <h5 class="card-header">Login</h5> + <div class="card-body"> + <form method="post"> + <div class="form-group"> + {% csrf_token %} + {{ form | crispy }} + </div> + <button type="submit" class="btn btn-primary">Login</button> + </form> + </div> + </div> + </div> </div> - <button type="submit">Login</button> -</form> +</div> + {% endblock %} \ No newline at end of file diff --git a/app/templates/main.html b/app/templates/main.html index 508f1f3..f323f89 100644 --- a/app/templates/main.html +++ b/app/templates/main.html @@ -3,22 +3,23 @@ {% block title %}Home{% endblock %} {% block content %} +<div class="container"> + <div class="row"> - <div class="jumbotron"> - <h1 class="display-4">Hi {{ user.username }}!</h1> - <hr class="my-4"> - <p> - Do some stuff - </p> - <p class="lead"> - <a class="btn btn-primary btn-lg" href="#" role="button">Do other Stuff</a> - </p> + <div class="jumbotron" style="margin-top: 50px;"> + <h1 class="display-4">Hi {{ user.username }}!</h1> + <hr class="my-4"> + {% if user.is_authenticated %} + <p>Logged in</p> + {% endif %} + <p> + Do some stuff + </p> + <p class="lead"> + <a class="btn btn-primary btn-lg" href="#" role="button">Do other Stuff</a> + </p> + </div> </div> +</div> -{% if user.is_authenticated %} - Hi {{ user.username }}! -{% else %} - <p>You are not logged in</p> - <a href="{% url 'login' %}">login</a> -{% endif %} {% endblock %} \ No newline at end of file -- GitLab