From 822d3d66c007b2d9f15b3dee685dad119db73dd0 Mon Sep 17 00:00:00 2001
From: Jean-Marie Favreau <j-marie.favreau@uca.fr>
Date: Sun, 6 Oct 2024 11:58:46 +0200
Subject: [PATCH] =?UTF-8?q?Am=C3=A9lioration=20de=20la=20mise=20en=20page?=
 =?UTF-8?q?=20=C3=A0=20venir=20sur=20PC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/agenda_culturel/static/style.scss         | 23 +++++-----
 .../single-event/event-in-upcoming-inc.html   | 42 ++++++++++---------
 2 files changed, 34 insertions(+), 31 deletions(-)

diff --git a/src/agenda_culturel/static/style.scss b/src/agenda_culturel/static/style.scss
index 352fe37..afe4ecd 100644
--- a/src/agenda_culturel/static/style.scss
+++ b/src/agenda_culturel/static/style.scss
@@ -165,7 +165,7 @@ details[role="list"] summary + ul li.selected>a:hover {
     }
 }
 
-#filters .clear {
+.clear {
     clear: both;
 }
 
@@ -1215,19 +1215,18 @@ article {
             column-count: 4;
         }
         .single-event {
-            .head {
-                float: left;
-                width: 30%;
-                margin-right: 1em;
-            }
-            .description {
-                float: left;
-                width: calc(70% - 16em);
-                max-width: 42em;
-                margin-bottom: 1em;
+            display: grid;
+            grid-template-columns: 30% auto 14em;
+            grid-column-gap: 1em;
+
+            header {
+                margin: 0;
             }
             .illustration {
-                width: 14em;
+                width: auto;
+            }
+            .description>div {
+                max-width: 42em;
             }
         }
     }
diff --git a/src/agenda_culturel/templates/agenda_culturel/single-event/event-in-upcoming-inc.html b/src/agenda_culturel/templates/agenda_culturel/single-event/event-in-upcoming-inc.html
index d765e35..5025422 100644
--- a/src/agenda_culturel/templates/agenda_culturel/single-event/event-in-upcoming-inc.html
+++ b/src/agenda_culturel/templates/agenda_culturel/single-event/event-in-upcoming-inc.html
@@ -5,12 +5,7 @@
 {% load tag_extra %}
 
 <article id="event-{{ event.pk}}" class="single-event">
-    {% if event.image or event.local_image %}
-    <article class='illustration'>
-        <img src="{% if event.local_image %}{{ event.local_image.url }}{% else %}{{ event.image }}{% endif %}" alt="{{ event.image_alt }}" />
-    </article>
-    {% endif %}
-    <div class="head">
+    <header class="head">
     {% if event|can_show_start_time:day %}
         {% if event.start_time %}
         <article class='ephemeris-hour'>
@@ -47,13 +42,11 @@
                 {% include "agenda_culturel/date-times-inc.html" with event=event %}
             </em></p>
         {% endif %}
-    </div>
-
-    <div class="description">
-    <p>{{ event.description |linebreaks2 | truncatewords:60 }}</p>
-    </div>
-    
-    <footer class="infos-and-buttons">
+        <div class="buttons">
+            {% if perms.agenda_culturel.change_event %}
+            {% include "agenda_culturel/edit-buttons-inc.html" with event=event %}
+            {% endif %}
+        </div>
         <div class="infos">
             <p>
                 {% for tag in event.tags %}
@@ -70,14 +63,25 @@
             </p>
             {% endif %}
             </div>
-        {% if perms.agenda_culturel.change_event %}
-        <div class="buttons">
-            {% include "agenda_culturel/edit-buttons-inc.html" with event=event %}
-            <a href="{{ event.get_absolute_url }}" role="button">Voir l'événement <svg width="1em" height="1em" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+
+    </header>
+
+    <div class="description">
+        <div>
+            <p>{{ event.description |linebreaks2 | truncatewords:60 }}</p>
+            <div class="right">
+            <a href="{{ event.get_absolute_url }}">Voir l'événement <svg width="1em" height="1em" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                 <use href="{% static 'images/feather-sprite.svg' %}#chevron-right" />
             </svg></a>
+            </div>
         </div>
-        {% endif %}
-        </footer>
+    </div>
+
+    <article class='illustration'>
+        {% if event.image or event.local_image %}
+        <img src="{% if event.local_image %}{{ event.local_image.url }}{% else %}{{ event.image }}{% endif %}" alt="{{ event.image_alt }}" />
+    {% endif %}
+    </article>
+
 </article>