Amélioration de la mise en page à venir sur PC

This commit is contained in:
Jean-Marie Favreau 2024-10-06 11:58:46 +02:00
parent 8d90efaa2b
commit 822d3d66c0
2 changed files with 34 additions and 31 deletions

View File

@ -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;
}
}
}

View File

@ -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>