Skip to content

Commit

Permalink
Fix form error message creating its own column
Browse files Browse the repository at this point in the history
  • Loading branch information
thibault committed Nov 28, 2023
2 parents 1faad36 + d0b68a4 commit 5495371
Show file tree
Hide file tree
Showing 5 changed files with 83 additions and 114 deletions.
40 changes: 18 additions & 22 deletions envergo/static/sass/project.scss
Original file line number Diff line number Diff line change
Expand Up @@ -1113,35 +1113,31 @@ main.home {
}

.moulinette-columns {
form {
input[type=text] {
background-color: var(--background-alt-grey);
}

@media (min-width: 62em) {
display: flex;
flex-wrap: nowrap;
justify-content: center;
}
input[type=text] {
background-color: var(--background-alt-grey);
}

#form-groups {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
margin: -1em;

div.moulinette-col {
width: 100;
max-width: 390px;
margin: 0 auto;
flex: 1;
width: 100%;
min-width: 320px;
max-width: 410px;
padding: 1em;

@media (min-width: 62em) {
flex: 1;
margin: 0 3rem;
}
}
}

div.last-section {
div.last-section {

button {
display: block;
margin: 3rem auto 0 auto;
}
button {
display: block;
margin: 3rem auto 0 auto;
}
}
}
Expand Down
118 changes: 60 additions & 58 deletions envergo/templates/moulinette/_form.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,77 +17,79 @@
</div>
{% endif %}

<div id="form-group-coords"
class="fr-input-group hide-print moulinette-col first-section">
<div id="form-groups">
<div id="form-group-coords"
class="fr-input-group hide-print moulinette-col first-section">

{{ form.lng.as_hidden }}
{{ form.lat.as_hidden }}
{{ form.lng.as_hidden }}
{{ form.lat.as_hidden }}

{% include '_field_snippet.html' with field=form.address %}
{% include '_field_snippet.html' with field=form.address %}

<label class="step">
Double-cliquez ou déplacez le marqueur sur la carte pour ajuster
l'emplacement du projet.
</label>
<label class="step">
Double-cliquez ou déplacez le marqueur sur la carte pour ajuster
l'emplacement du projet.
</label>

<div class="ratio-4x3 fr-mt-1w fr-mb-2w">
<div class="ratio-content">
<div class="leaflet-container">
<div id="map"></div>
<div class="ratio-4x3 fr-mt-1w fr-mb-2w">
<div class="ratio-content">
<div class="leaflet-container">
<div id="map"></div>
</div>
</div>
</div>
</div>

{% if form.lat.errors or form.lng.errors %}
<p class="fr-error-text">
Les coordonnées saisies sont incorrectes
</p>

{% endif %}
</div>
{% if form.lat.errors or form.lng.errors %}
<p class="fr-error-text">
Les coordonnées saisies sont incorrectes
</p>

<div class="moulinette-col last-section">
<div class="fr-mb-3w">
<label class="step">Complétez les informations décrivant le projet</label>
{% endif %}
</div>
<p class="hint-header">
<span class="fr-icon-info-fill" aria-hidden="true"></span>
Surfaces à prendre en compte : bâti, voirie, espaces verts, remblais et bassins — impacts définitifs et temporaires (travaux).
</p>
{% include '_field_snippet.html' with field=form.created_surface %}
{% include '_field_snippet.html' with field=form.final_surface %}
{% if additional_forms %}
<hr />
<div id="additional-forms"
class="{{ additional_forms_bound|yesno:"bound,unbound" }}">
<p>
<strong>Question(s) complémentaire(s)</strong>
</p>
{% for field_name, field in additional_fields.items %}
{% if field|is_checkbox %}
{% include '_checkbox_snippet.html' with field=field %}
{% elif field|is_radio %}
{% include '_radio_snippet.html' with field=field %}
{% elif field|is_input_file %}
{% include '_input_file_snippet.html' with field=field %}
{% else %}
{% include '_field_snippet.html' with field=field %}

<div class="moulinette-col last-section">
<div class="fr-mb-3w">
<label class="step">Complétez les informations décrivant le projet</label>
</div>
<p class="hint-header">
<span class="fr-icon-info-fill" aria-hidden="true"></span>
Surfaces à prendre en compte : bâti, voirie, espaces verts, remblais et bassins — impacts définitifs et temporaires (travaux).
</p>
{% include '_field_snippet.html' with field=form.created_surface %}
{% include '_field_snippet.html' with field=form.final_surface %}
{% if additional_forms %}
<hr />
<div id="additional-forms"
class="{{ additional_forms_bound|yesno:"bound,unbound" }}">
<p>
<strong>Question(s) complémentaire(s)</strong>
</p>
{% for field_name, field in additional_fields.items %}
{% if field|is_checkbox %}
{% include '_checkbox_snippet.html' with field=field %}
{% elif field|is_radio %}
{% include '_radio_snippet.html' with field=field %}
{% elif field|is_input_file %}
{% include '_input_file_snippet.html' with field=field %}
{% else %}
{% include '_field_snippet.html' with field=field %}
{% endif %}
{% endfor %}
{% if additional_forms and moulinette.has_missing_data %}
<button type="submit" class="fr-btn">Compléter la simulation</button>
{% endif %}
{% endfor %}
</div>
{% endif %}
<div class="hide-print">
{% if additional_forms and moulinette.has_missing_data %}
<button type="submit" class="fr-btn">Compléter la simulation</button>
{% elif moulinette %}
<button type="submit" class="fr-btn">Renouveler la simulation</button>
{% else %}
<button type="submit" class="fr-btn">Démarrer la simulation</button>
{% endif %}
</div>
{% endif %}
<div class="hide-print">
{% if additional_forms and moulinette.has_missing_data %}
{% elif moulinette %}
<button type="submit" class="fr-btn">Renouveler la simulation</button>
{% else %}
<button type="submit" class="fr-btn">Démarrer la simulation</button>
{% endif %}
</div>
</div>
</form>
33 changes: 1 addition & 32 deletions envergo/templates/moulinette/base_result.html
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
{% extends 'base.html' %}
{% extends 'moulinette/base.html' %}

{% load evaluations static l10n %}

{% block title %}Simulation réglementaire du projet{% endblock %}

{% block container %}

<div id="moulinette-container"
Expand All @@ -29,32 +27,3 @@ <h2>Saisissez les caractéristiques du projet</h2>
</div>

{% endblock %}

{% block extra_css %}
{% include 'moulinette/_form_styles.html' %}

{% endblock %}

{% block extra_js %}
<script>
var FEEDBACK_MODAL_DIALOGS = '.feedback-dialog';
var FEEDBACK_BUTTONS = '.feedback-buttons button';
var FEEDBACK_RESPOND_URL = '{% url "feedback_respond" %}';
var VISITOR_ID = '{{ visitor_id }}';
var CSRF_TOKEN = '{{ csrf_token }}';
var ADDRESS_AUTOCOMPLETE_FIELD_NAME = 'address';
var DISPLAY_MARKER = {{ display_marker|yesno:'true,false' }};
var CENTER_MAP = {lng: {{ center_map.0|unlocalize }}, lat: {{ center_map.1|unlocalize }}};
var DEFAULT_ZOOM = {{ default_zoom }};
var LAT_FIELD_ID = 'id_lat';
var LNG_FIELD_ID = 'id_lng';
var IS_MAP_STATIC = {{ is_map_static|yesno:'true,false' }};
var EVENTS_URL = "{% url 'events' %}";
{% if moulinette_summary %}
var MOULINETTE_DATA = {{ moulinette_summary|safe }};
{% endif %}
var SIMULATION_FORM_ID = "moulinette-form";
</script>
{% include 'moulinette/_form_scripts.html' %}

{% endblock %}
2 changes: 1 addition & 1 deletion envergo/templates/moulinette/home.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
{% block container %}
<div id="main-container" class="fr-container fr-pt-6w fr-pb-8w">
<div class="fr-grid-row fr-grid-row--center">
<article class="fr-col fr-col-md-11 fr-col-xl-9">
<article class="fr-col fr-col-lg-9">

<h1 class="centered">Simulez votre projet en phase amont</h1>

Expand Down
4 changes: 3 additions & 1 deletion envergo/templates/pages/home.html
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,9 @@ <h2>
class="moulinette moulinette-columns fr-pt-8w fr-pb-5w">
<div class="fr-container">
<h2 class="fr-h3">Simulez votre projet en phase amont !</h2>
{% include 'moulinette/_form.html' with form=form %}
<div class="fr-grid-row fr-grid-row--center">
<div class="fr-col fr-col-lg-9">{% include 'moulinette/_form.html' with form=form %}</div>
</div>
</div>
</section>

Expand Down

0 comments on commit 5495371

Please sign in to comment.