From 48c6b3c868b9e922f4029abd61345df9371b1dd1 Mon Sep 17 00:00:00 2001 From: Fabien Le Frapper Date: Fri, 1 Nov 2024 15:50:45 +0100 Subject: [PATCH] improve modal --- .../_addresses_partials/filters/_modal.html | 38 +++++-- .../filters/panel_filters.html | 106 ++++++++---------- jinja2/qfdmo/carte/modals/a_propos.html | 99 ++++++++-------- jinja2/qfdmo/carte/modals/filters.html | 10 +- tailwind.config.js | 8 ++ 5 files changed, 134 insertions(+), 127 deletions(-) diff --git a/jinja2/qfdmo/_addresses_partials/filters/_modal.html b/jinja2/qfdmo/_addresses_partials/filters/_modal.html index a160d1f09..5a468be9b 100644 --- a/jinja2/qfdmo/_addresses_partials/filters/_modal.html +++ b/jinja2/qfdmo/_addresses_partials/filters/_modal.html @@ -1,24 +1,40 @@
-
- {% block content %} - {% endblock content %} +
+ {% block modal_header %} + {% endblock modal_header %} +
+ +
+

+ {% block modal_title %} + {% endblock modal_title %} +

+
+ + {% block modal_content %} + {% endblock modal_content %} +
+ +
+ {% block modal_footer %} + {% endblock modal_footer %}
+
diff --git a/jinja2/qfdmo/_addresses_partials/filters/panel_filters.html b/jinja2/qfdmo/_addresses_partials/filters/panel_filters.html index c7c4cf7de..60f98aab0 100644 --- a/jinja2/qfdmo/_addresses_partials/filters/panel_filters.html +++ b/jinja2/qfdmo/_addresses_partials/filters/panel_filters.html @@ -9,68 +9,58 @@ tabindex="0" {% endblock wrapper_attrs %} -{% block content %} -
- -
-
- - {% block filters_title %} -

- Filtres avancés -

- {% endblock %} -
+{% block modal_header %} + +{% endblock modal_header %} - {% block filters_content %} - {% with field=form.bonus, legend="Éligibles au bonus réparation" %} - {% include "qfdmo/_addresses_partials/filter/_panel_filters" %} - {% endwith %} +{% block modal_title %}Filtres avancés{% endblock modal_title %} - {% with field=form.ess, legend="Type d'enseigne ESS" %} - {% include "qfdmo/_addresses_partials/filter/_panel_filters" %} - {% endwith %} +{% block modal_content %} + {% with field=form.bonus, legend="Éligibles au bonus réparation" %} + {% include "qfdmo/_addresses_partials/filter/_panel_filters" %} + {% endwith %} - {% with field=form.label_reparacteur, legend="Enseignes labellisées Répar’Acteurs", icon="qfdmo/partials/label_reparacteur_icon.html" %} - {% include "qfdmo/_addresses_partials/filter/_panel_filters" %} - {% endwith %} - {% endblock %} + {% with field=form.ess, legend="Type d'enseigne ESS" %} + {% include "qfdmo/_addresses_partials/filter/_panel_filters" %} + {% endwith %} + {% with field=form.label_reparacteur, legend="Enseignes labellisées Répar’Acteurs", icon="qfdmo/partials/label_reparacteur_icon.html" %} + {% include "qfdmo/_addresses_partials/filter/_panel_filters" %} + {% endwith %} +{% endblock modal_content %} -
-
-
+ -
-
+
+
+ -
-
-{% endblock content %} + Appliquer + +
+{% endblock modal_footer %} diff --git a/jinja2/qfdmo/carte/modals/a_propos.html b/jinja2/qfdmo/carte/modals/a_propos.html index 4964925a5..caf106ed0 100644 --- a/jinja2/qfdmo/carte/modals/a_propos.html +++ b/jinja2/qfdmo/carte/modals/a_propos.html @@ -5,61 +5,56 @@ data-search-solution-form-target="aProposMainPanel" {% endblock wrapper_attrs %} -{% block content %} -
- -
-
-

- À propos de La Carte -

-
-
-
-
-

- - Réutiliser La Carte - -

-

- Et si vous ajoutiez cette carte à votre site ? Pour utiliser notre widget, c'est par ici ! -

-
+{% block modal_header %} + +{% endblock modal_header %} + +{% block modal_title %}À propos de La Carte{% endblock modal_title %} + +{% block modal_content %} +
+
+
+

+ + Réutiliser La Carte + +

+

+ Et si vous ajoutiez cette carte à votre site ? Pour utiliser notre widget, c'est par ici ! +

-
-
-
-

- - Donner votre avis - -

-

Cette carte doit-être la vôtre ! Si vous avez des idées pour l'améliorer, on vous écoute.

-
+
+
+
+
+

+ + Donner votre avis + +

+

Cette carte doit-être la vôtre ! Si vous avez des idées pour l'améliorer, on vous écoute.

-
-
- {% include 'layout/_partials/header_logos.html' %} -
+
+ {% include 'layout/_partials/header_logos.html' %}
-{% endblock content %} +{% endblock modal_content %} diff --git a/jinja2/qfdmo/carte/modals/filters.html b/jinja2/qfdmo/carte/modals/filters.html index 2741f8217..e74e4432e 100644 --- a/jinja2/qfdmo/carte/modals/filters.html +++ b/jinja2/qfdmo/carte/modals/filters.html @@ -1,12 +1,10 @@ {% extends 'qfdmo/_addresses_partials/filters/panel_filters.html' %} -{% block filters_title %} -

- Filtres -

+{% block modal_title %} +Filtres {% endblock %} -{% block filters_content %} +{% block modal_content %} {% include 'qfdmo/_addresses_partials/filters/_object_filter.html' %} {% endwith %} {% include 'qfdmo/_addresses_partials/filters/_labels_filters.html' %} -{% endblock %} +{% endblock modal_content %} diff --git a/tailwind.config.js b/tailwind.config.js index c4ffea031..d21452b8d 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -197,9 +197,17 @@ module.exports = { "40%": { transform: "rotate(0deg) scale3d(0.9, 0.9, 1)" }, "100%": { transform: "rotate(0) scale3d(0.9, 0.9, 1) translateZ(0)" }, }, + "modal-appear": { + "0%": { opacity: 0, transform: "translateY(0px) scale(0.98)" }, + "50%": { opacity: 1 }, + "100%": { + transform: "translateY(0px) scale(1)", + }, + }, }, animation: { wave: "wave 1.5s linear", + "modal-appear": "modal-appear 0.3s", }, }, },