From 3e5c36b39ef3bd049ca5bdd1f06206fc7d8d0c25 Mon Sep 17 00:00:00 2001
From: Julien Constant <49886317+Juknum@users.noreply.github.com>
Date: Mon, 12 Dec 2022 20:27:47 +0100
Subject: [PATCH] Fix election candidate overflowing texte (#506)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Le texte affiché lorsqu'on appuyait sur "Show more" dépassait horizontalement (programme des candidats)
---
 core/static/election/election.scss                | 15 ++++++++++++---
 election/templates/election/election_detail.jinja |  6 +++---
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/core/static/election/election.scss b/core/static/election/election.scss
index 0af2286d..b51fe0d3 100644
--- a/core/static/election/election.scss
+++ b/core/static/election/election.scss
@@ -166,14 +166,15 @@ $min_col_width: 100px;
                     flex-direction: row;
                     flex-wrap: wrap;
                     justify-content: center;
+                    width: 100%;                    
                     gap: $gap;
 
                     >.candidate {
                         display: flex;
                         flex-direction: column;
                         align-items: center;
-
                         list-style-type: none;
+                        width: 100%;
                         gap: $gap;
 
                         >input[type="radio"]:checked + label,
@@ -186,6 +187,10 @@ $min_col_width: 100px;
                             }
                         }
 
+                        >label {
+                            width: 100%;
+                        }
+
                         >label>figure,
                         >figure {
                             position: relative;
@@ -196,15 +201,19 @@ $min_col_width: 100px;
                             padding: 10px;
 
                             >img {
-                                max-width: 100%;
+                                max-width: 100% !important;
                             }
 
                             >figcaption {
+                                width: 100%;
+                                max-width: inherit !important;
+                                overflow: hidden;
+                                
                                 h5 {
                                     margin: 0;
                                     text-align: center;
                                 }
-                                q {
+                                .candidate_program {
                                     margin: 5px 0;
                                 }
                             }
diff --git a/election/templates/election/election_detail.jinja b/election/templates/election/election_detail.jinja
index 853fab78..51eeb704 100644
--- a/election/templates/election/election_detail.jinja
+++ b/election/templates/election/election_detail.jinja
@@ -100,7 +100,7 @@
                         </td>
                     </tr>
                     <tr class="role_candidates">
-                        <td class="list_per_role" style="width: {{ 100 / (election_lists.count() + 1) }}%">
+                        <td class="list_per_role" style="width: 100%; max-width: {{ 100 / (election_lists.count() + 1) }}%">
                             {%- if role.max_choice == 1 and election.can_vote(user) %}
                             <div class="radio-btn">
                                 <input id="id_{{ role.title }}_{{ count[0] }}" type="radio" name="{{ role.title }}" value {{ '' if role_data in election_form else 'checked' }} {{ 'disabled' if election.has_voted(user) else '' }}>
@@ -118,7 +118,7 @@
                             {%- endif %}
                         </td>
                         {%- for election_list in election_lists %}
-                        <td class="list_per_role" style="width: {{ 100 / (election_lists.count() + 1) }}%">
+                        <td class="list_per_role" style="width: 100%; max-width: {{ 100 / (election_lists.count() + 1) }}%">
                             <ul class="candidates">
                                 {%- for candidature in election_list.candidatures.filter(role=role) %}
                                 <li class="candidate">
@@ -141,7 +141,7 @@
                                                     {%- endif %}
                                                 </figcaption>
                                                 {%- if user.can_edit(candidature) -%}
-                                                {% if election.is_vote_editable %}
+                                                {%- if election.is_vote_editable -%}
                                                     <div class="edit_btns">
                                                         <a href="{{url('election:update_candidate', candidature_id=candidature.id)}}">{% trans %}✏️{% endtrans %}</a>
                                                         <a href="{{url('election:delete_candidate', candidature_id=candidature.id)}}">{% trans %}❌{% endtrans %}</a>