Better Rendering of Forms

This commit is contained in:
reverend 2020-08-03 17:29:25 +02:00
parent 799644bf31
commit ceb0a2cc68
3 changed files with 47 additions and 5 deletions

View File

@ -10,6 +10,7 @@ pylint = "*"
django = "*" django = "*"
django-thumbs-v2 = "*" django-thumbs-v2 = "*"
image = "*" image = "*"
django-widget-tweaks = "*"
# Commented out to not explicitly specify Python3 subversion. # Commented out to not explicitly specify Python3 subversion.
# [requires] # [requires]
# python_version = "3.8" # python_version = "3.8"

View File

@ -0,0 +1,16 @@
{% load widget_tweaks %}
<div class="LP-Input {% if field.errors %} LP-Input--error {% endif %}">
<label for="{{field.id_for_label}}" class="LP-Input__Label">{{field.label}}</label>
{% render_field field class="LP-Input__Field"%}
<span class="LP-Input__Message">
{% if field.errors %}
{% for error in field.errors%}
{{error}}
{% endfor %}
{% elif field.help_text%}
{{ field.help_text }}
{% endif %}
</span>
</div>

View File

@ -1,15 +1,40 @@
{% extends 'global.html'%} {% extends 'global.html'%}
{% load static %} {% load static %}
{% load widget_tweaks %}
# {% block title %}Registrierung{% endblock %} # {% block title %}Registrierung{% endblock %}
{% block maincontent %} {% block maincontent %}
<h2>Registrierung</h2> <form class="LP-Form" method="POST">
<form method="post"> <fieldset class="LP-Form__Fieldset">
{% csrf_token %} <legend class="LP-Form__Legend">Registrierung</legend>
{{ form.as_p }} {% csrf_token %}
<button type="submit">Sign up</button> <div class="LP-Form__Composition LP-Form__Composition--breakable">
<div class="LP-Form__Field">
{% include 'partials/form/inputField.html' with field=form.username %}
</div>
<div class="LP-Form__Field">
{% include 'partials/form/inputField.html' with field=form.email %}
</div>
</div>
<div class="LP-Form__Composition">
<div class="LP-Form__Field">
{% include 'partials/form/inputField.html' with field=form.password1 %}
</div>
</div>
<div class="LP-Form__Composition">
<div class="LP-Form__Field">
{% include 'partials/form/inputField.html' with field=form.password2 %}
</div>
</div>
<div class="LP-Form__Composition">
<input type="submit" class="LP-Button" value="Registrieren"/>
</div>
</fieldset>
</form> </form>
{% endblock maincontent %} {% endblock maincontent %}