Design für Forms, closes #5

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 \

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'

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 %}
+  {% endblock %}
\ No newline at end of file
\ No newline at end of file

app/templates/login.html

 {% 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

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