Optimize WellBeing form for smartphone

This commit is contained in:
Gregory Trullemans 2024-01-25 11:07:05 +01:00
parent 624664c4d7
commit ddcb3ed451
1 changed files with 15 additions and 15 deletions

View File

@ -13,8 +13,8 @@
<form action="{% if wellbeing_id %}{% url 'wellbeing_update' wellbeing_id %}{% else %}{% url 'wellbeing_create' %}{% endif %}" method="post" class="form-horizontal" id="formulaire" name="formulaire"> <form action="{% if wellbeing_id %}{% url 'wellbeing_update' wellbeing_id %}{% else %}{% url 'wellbeing_create' %}{% endif %}" method="post" class="form-horizontal" id="formulaire" name="formulaire">
{% csrf_token %} {% csrf_token %}
<div class="form-group row "> <div class="form-group row ">
<label for="id_gymnast" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Gymnast <span class="text-danger"><b>*</b></span></label> <label for="id_gymnast" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Gymnast <span class="text-danger"><b>*</b></span></label>
<div class="col-8 col-sm-10 col-md-8 col-lg-8 col-lg-8 col-xl-9 {% if form.jumper.errors %}has-danger{% endif %}"> <div class="col-8 col-sm-9 col-md-8 col-lg-8 col-lg-8 col-xl-9 {% if form.jumper.errors %}has-danger{% endif %}">
{% if request.user|has_group:"trainer" %} {% if request.user|has_group:"trainer" %}
{{ form.gymnast }} {{ form.gymnast }}
{{ form.gymnast_related }} {{ form.gymnast_related }}
@ -30,14 +30,14 @@
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_date" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Date <span class="text-danger"><b>*</b></span></label> <label for="id_date" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Date <span class="text-danger"><b>*</b></span></label>
<div class="col-5 col-sm-3 col-md-4 col-lg-4 col-xl-3 {% if form.date.errors %}has-danger{% endif %}"> <div class="col-5 col-sm-3 col-md-4 col-lg-4 col-xl-3 {% if form.date.errors %}has-danger{% endif %}">
{{ form.date }} {{ form.date }}
{% if form.date.errors %}<span class="btn btn-sm btn-danger-outline">{% for error in form.date.errors %}{{ error }}{% endfor %}</span>{% endif %} {% if form.date.errors %}<span class="btn btn-sm btn-danger-outline">{% for error in form.date.errors %}{{ error }}{% endfor %}</span>{% endif %}
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_event" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Event</label> <label for="id_event" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Event</label>
<div class="col-8 col-sm-8 col-md-8 col-lg-8 col-xl-9 {% if form.date.errors %}has-danger{% endif %}"> <div class="col-8 col-sm-8 col-md-8 col-lg-8 col-xl-9 {% if form.date.errors %}has-danger{% endif %}">
{{ form.event }} {{ form.event }}
{{ form.event_related }} {{ form.event_related }}
@ -49,8 +49,8 @@
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_mindstate" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Mind State <span class="text-danger"><b>*</b></span></label> <label for="id_mindstate" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Mind State <span class="text-danger"><b>*</b></span></label>
<div class="col-5 col-sm-3 col-md-3 col-lg-2 {% if form.mindstate.errors %}has-danger{% endif %}"> <div class="col-5 col-sm-2 col-md-3 col-lg-2 {% if form.mindstate.errors %}has-danger{% endif %}">
{{ form.mindstate }} {{ form.mindstate }}
{% if form.mindstate.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.mindstate.errors %}{{ error }}{% endfor %}</span>{% endif %} {% if form.mindstate.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.mindstate.errors %}{{ error }}{% endfor %}</span>{% endif %}
</div> </div>
@ -59,8 +59,8 @@
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_sleep" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Sleep <span class="text-danger"><b>*</b></span></label> <label for="id_sleep" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Sleep <span class="text-danger"><b>*</b></span></label>
<div class="col-5 col-sm-3 col-md-3 col-lg-2 {% if form.sleep.errors %}has-danger{% endif %}"> <div class="col-5 col-sm-2 col-md-3 col-lg-2 {% if form.sleep.errors %}has-danger{% endif %}">
{{ form.sleep }} {{ form.sleep }}
{% if form.sleep.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.sleep.errors %}{{ error }}{% endfor %}</span>{% endif %} {% if form.sleep.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.sleep.errors %}{{ error }}{% endfor %}</span>{% endif %}
</div> </div>
@ -69,8 +69,8 @@
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_stress" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Stress <span class="text-danger"><b>*</b></span></label> <label for="id_stress" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Stress <span class="text-danger"><b>*</b></span></label>
<div class="col-5 col-sm-3 col-md-3 col-lg-2 {% if form.stress.errors %}has-danger{% endif %}"> <div class="col-5 col-sm-2 col-md-3 col-lg-2 {% if form.stress.errors %}has-danger{% endif %}">
{{ form.stress }} {{ form.stress }}
{% if form.stress.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.stress.errors %}{{ error }}{% endfor %}</span>{% endif %} {% if form.stress.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.stress.errors %}{{ error }}{% endfor %}</span>{% endif %}
</div> </div>
@ -79,8 +79,8 @@
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_fatigue" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Fatigue <span class="text-danger"><b>*</b></span></label> <label for="id_fatigue" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Fatigue <span class="text-danger"><b>*</b></span></label>
<div class="col-5 col-sm-3 col-md-3 col-lg-2 {% if form.fatigue.errors %}has-danger{% endif %}"> <div class="col-5 col-sm-2 col-md-3 col-lg-2 {% if form.fatigue.errors %}has-danger{% endif %}">
{{ form.fatigue }} {{ form.fatigue }}
{% if form.fatigue.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.fatigue.errors %}{{ error }}{% endfor %}</span>{% endif %} {% if form.fatigue.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.fatigue.errors %}{{ error }}{% endfor %}</span>{% endif %}
</div> </div>
@ -89,8 +89,8 @@
</div> </div>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_muscle_soreness" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Muscle Soreness <span class="text-danger"><b>*</b></span></label> <label for="id_muscle_soreness" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Muscle Soreness <span class="text-danger"><b>*</b></span></label>
<div class="col-5 col-sm-3 col-md-3 col-lg-2 {% if form.muscle_soreness.errors %}has-danger{% endif %}"> <div class="col-5 col-sm-2 col-md-3 col-lg-2 {% if form.muscle_soreness.errors %}has-danger{% endif %}">
{{ form.muscle_soreness }} {{ form.muscle_soreness }}
{% if form.muscle_soreness.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.muscle_soreness.errors %}{{ error }}{% endfor %}</span>{% endif %} {% if form.muscle_soreness.errors %}&nbsp;<span class="btn btn-sm btn-danger-outline">{% for error in form.muscle_soreness.errors %}{{ error }}{% endfor %}</span>{% endif %}
</div> </div>
@ -102,7 +102,7 @@
<label class="col-12 text-center text-danger" id="note_info"><b>Merci de donner des détails concernant les scores.</b></label> <label class="col-12 text-center text-danger" id="note_info"><b>Merci de donner des détails concernant les scores.</b></label>
</div> </div>
<div class="form-group row "> <div class="form-group row ">
<label for="id_information" class="col-4 col-sm-2 col-md-4 col-lg-4 col-xl-3 col-form-label">Informations <span class="text-danger" id="span_info_required"><b>*</b></span></label> <label for="id_information" class="col-4 col-sm-3 col-md-4 col-lg-4 col-xl-3 col-form-label">Informations <span class="text-danger" id="span_info_required"><b>*</b></span></label>
<div class="col-8 col-sm-8 col-md-8 col-lg-8 col-xl-9 {% if form.id_information.errors %}has-danger{% endif %}"> <div class="col-8 col-sm-8 col-md-8 col-lg-8 col-xl-9 {% if form.id_information.errors %}has-danger{% endif %}">
{{ form.informations }} {{ form.informations }}
</div> </div>