Finit les changement de visualisation des evaluations

app/static/css/style.css

@@ -2122,3 +2122,73 @@ a:hover { color: var(--primary-dark); }
         grid-template-columns: 1fr;
     }
 }
+
+/* Evaluation comments - separate grid so long notes stay readable */
+.eval-comments {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 12px;
+    margin-top: 16px;
+}
+
+.eval-comments-title {
+    grid-column: 1 / -1;
+    margin: 0 0 4px;
+    font-size: 0.95rem;
+    font-weight: 600;
+}
+
+.eval-comment {
+    background: var(--gray-50);
+    border: 1px solid var(--gray-200);
+    border-radius: var(--radius-sm);
+    padding: 12px 14px;
+}
+
+.eval-comment-text {
+    margin: 0 0 10px;
+    white-space: pre-wrap;
+    word-break: break-word;
+    color: var(--gray-800);
+}
+
+.eval-comment-meta {
+    display: flex;
+    justify-content: space-between;
+    gap: 8px;
+    flex-wrap: wrap;
+    font-size: 0.85rem;
+    color: var(--gray-500);
+}
+
+.eval-comment-author strong {
+    color: var(--gray-700);
+    font-weight: 600;
+}
+
+[data-theme="dark"] .eval-comment {
+    background: var(--bg-tertiary);
+    border-color: var(--border-color);
+}
+
+[data-theme="dark"] .eval-comment-text {
+    color: var(--text-primary);
+}
+
+[data-theme="dark"] .eval-comment-meta {
+    color: var(--text-muted);
+}
+
+[data-theme="dark"] .eval-comment-author strong {
+    color: var(--text-secondary);
+}
+
+.eval-comments-empty {
+    margin: 8px 0 0;
+    color: var(--gray-500);
+    font-size: 0.9rem;
+}
+
+[data-theme="dark"] .eval-comments-empty {
+    color: var(--text-muted);
+}

app/templates/pages/evaluations.html

@@ -79,7 +79,6 @@
                                             {% endfor %}
                                             <th>{{ _('Overall') }}</th>
                                             <th>{{ _('Position') }}</th>
-                                            <th>{{ _('Comment') }}</th>
                                             <th>{{ _('Date') }}</th>
                                         </tr>
                                     </thead>
@@ -93,16 +92,35 @@
                                             {% endfor %}
                                             <td><span class="score">{{ ev.overall if ev.overall is not none else '-' }}</span></td>
                                             <td>{{ ev.position or '-' }}</td>
-                                            <td class="eval-comment">{{ ev.comment or '-' }}</td>
                                             <td>{{ ev.date.strftime('%m/%d/%Y') if ev.date else '-' }}</td>
                                         </tr>
                                         {% else %}
                                         <tr>
-                                            <td colspan="{{ evaluation_criteria | length + 6 }}" class="text-center">{{ _('No evaluations for this player.') }}</td>
+                                            <td colspan="{{ evaluation_criteria | length + 5 }}" class="text-center">{{ _('No evaluations for this player.') }}</td>
                                         </tr>
                                         {% endfor %}
                                     </tbody>
                                 </table>
+
+                                {% if entry.evaluations %}
+                                {% set comment_evals = entry.evaluations | selectattr('comment') | list %}
+                                <div class="eval-comments">
+                                    <h4 class="eval-comments-title"><i class="fas fa-comments"></i> {{ _('Comments') }}</h4>
+                                    {% if comment_evals %}
+                                    {% for ev in comment_evals %}
+                                    <article class="eval-comment">
+                                        <p class="eval-comment-text">{{ ev.comment }}</p>
+                                        <footer class="eval-comment-meta">
+                                            <span class="eval-comment-author">{{ _('Evaluator') }}&nbsp;: <strong>{{ ev.evaluator.username if ev.evaluator else _('Deleted evaluator') }}</strong></span>
+                                            <span class="eval-comment-context">{{ ev.tryout.title if ev.tryout else _('Deleted tryout') }} &middot; {{ ev.date.strftime('%m/%d/%Y') if ev.date else '-' }}</span>
+                                        </footer>
+                                    </article>
+                                    {% endfor %}
+                                    {% else %}
+                                    <p class="eval-comments-empty">{{ _('No comments') }}</p>
+                                    {% endif %}
+                                </div>
+                                {% endif %}
                             </div>
                         </td>
                     </tr>
@@ -131,7 +149,6 @@
 .eval-chevron { transition: transform 0.15s ease; font-size: 0.75rem; }
 .eval-detail-inner { padding: 8px 4px; }
 .eval-detail-inner .table { margin-bottom: 0; }
-.eval-comment { max-width: 320px; white-space: pre-wrap; }
 .player-nav { display: flex; gap: 8px; align-items: center; }
 .is-disabled { opacity: 0.5; pointer-events: none; }
 </style>

app/templates/pages/player_evaluations.html

@@ -64,7 +64,6 @@
                         {% endfor %}
                         <th>{{ _('Overall') }}</th>
                         <th>{{ _('Position') }}</th>
-                        <th>{{ _('Comment') }}</th>
                         <th>{{ _('Date') }}</th>
                     </tr>
                 </thead>
@@ -78,12 +77,11 @@
                         {% endfor %}
                         <td><span class="score">{{ ev.overall if ev.overall is not none else '-' }}</span></td>
                         <td>{{ ev.position or '-' }}</td>
-                        <td class="eval-comment">{{ ev.comment or '-' }}</td>
                         <td>{{ ev.date.strftime('%m/%d/%Y') if ev.date else '-' }}</td>
                     </tr>
                     {% else %}
                     <tr>
-                        <td colspan="{{ evaluation_criteria | length + 6 }}" class="text-center">
+                        <td colspan="{{ evaluation_criteria | length + 5 }}" class="text-center">
                             <div class="empty-state">
                                 <i class="fas fa-clipboard"></i>
                                 <h3>{{ _('No evaluations for this player yet') }}</h3>
@@ -94,6 +92,35 @@
                 </tbody>
             </table>
         </div>
+
+        {% if evaluations %}
+        {% set comment_evals = evaluations | selectattr('comment') | list %}
+        <div class="card mt-4">
+            <div class="card-header">
+                <h3><i class="fas fa-comments"></i> {{ _('Comments') }}</h3>
+            </div>
+            <div class="card-body">
+                {% if comment_evals %}
+                <div class="eval-comments">
+                    {% for ev in comment_evals %}
+                    <article class="eval-comment">
+                        <p class="eval-comment-text">{{ ev.comment }}</p>
+                        <footer class="eval-comment-meta">
+                            <span class="eval-comment-author">{{ _('Evaluator') }}&nbsp;: <strong>{{ ev.evaluator.username if ev.evaluator else _('Deleted evaluator') }}</strong></span>
+                            <span class="eval-comment-context">{{ ev.tryout.title if ev.tryout else _('Deleted tryout') }} &middot; {{ ev.date.strftime('%m/%d/%Y') if ev.date else '-' }}</span>
+                        </footer>
+                    </article>
+                    {% endfor %}
+                </div>
+                {% else %}
+                <div class="empty-state">
+                    <i class="fas fa-comments"></i>
+                    <h3>{{ _('No comments') }}</h3>
+                </div>
+                {% endif %}
+            </div>
+        </div>
+        {% endif %}
     </div>
 </div>
 {% endblock %}
@@ -103,6 +130,5 @@
 .view-toggle { display: flex; gap: 8px; }
 .player-nav { display: flex; gap: 8px; align-items: center; }
 .is-disabled { opacity: 0.5; pointer-events: none; }
-.eval-comment { max-width: 320px; white-space: pre-wrap; }
 </style>
 {% endblock %}

app/translations/en/LC_MESSAGES/messages.po

@@ -1826,9 +1826,16 @@ msgid "Enter position (optional)"
 msgstr "Enter position (optional)"
 
 #: app/templates/pages/evaluate_player.html:121
+#: app/templates/pages/player_evaluations.html
+#: app/templates/pages/evaluations.html
 msgid "Comments"
 msgstr "Comments"
 
+#: app/templates/pages/player_evaluations.html
+#: app/templates/pages/evaluations.html
+msgid "No comments"
+msgstr "No comments"
+
 #: app/templates/pages/evaluate_player.html:122
 msgid "Enter your evaluation notes..."
 msgstr "Enter your evaluation notes..."

app/translations/fr/LC_MESSAGES/messages.po

@@ -1836,9 +1836,16 @@ msgid "Enter position (optional)"
 msgstr "Saisir un poste (facultatif)"
 
 #: app/templates/pages/evaluate_player.html:121
+#: app/templates/pages/player_evaluations.html
+#: app/templates/pages/evaluations.html
 msgid "Comments"
 msgstr "Commentaires"
 
+#: app/templates/pages/player_evaluations.html
+#: app/templates/pages/evaluations.html
+msgid "No comments"
+msgstr "Aucun commentaire"
+
 #: app/templates/pages/evaluate_player.html:122
 msgid "Enter your evaluation notes..."
 msgstr "Vos notes d’évaluation..."