Update templates/moderate.html

templates/moderate.html

@@ -1,22 +1,25 @@
 {% extends "base.html" %}
 {% block title %}Modération{% endblock %}
 {% block content %}
-<h2>Modération</h2>
+<h2 class="text-2xl font-semibold mb-4">Modération</h2>  <!-- Titre -->
 {% if messages %}
-    <ul class="message-list">
-    {% for msg in messages %}
-        <li>
-            <div class="message">
-                <p>{{ msg.content|safe }}</p>
-                <small>Posté le {{ msg.timestamp.strftime('%d/%m/%Y %H:%M:%S') }} - Signalements: {{ msg.reports }}</small>
-                <form action="{{ url_for('remove_message', message_id=msg.id) }}" method="POST">
-                    <button type="submit">Retirer le message</button>
-                </form>
-            </div>
-        </li>
-    {% endfor %}
+    <ul class="message-list space-y-4">  <!-- Liste des messages signalés -->
+        {% for msg in messages %}
+            <li class="bg-white p-4 rounded-md shadow-sm">  <!-- Style du message -->
+                <div class="message">
+                    <p class="text-gray-800">{{ msg.content|safe }}</p>  <!-- Contenu -->
+                    <small class="text-gray-500">Posté le {{ msg.timestamp.strftime('%d/%m/%Y %H:%M:%S') }} - Signalements: {{ msg.reports }}</small>  <!-- Infos -->
+                    <form action="{{ url_for('remove_message', message_id=msg.id) }}" method="POST" class="mt-2">  <!-- Formulaire de suppression -->
+                        <button type="submit"
+                                class="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded transition-colors duration-200">
+                            Retirer le message
+                        </button>
+                    </form>
+                </div>
+            </li>
+        {% endfor %}
     </ul>
 {% else %}
-    <p>Aucun message signalé.</p>
+    <p class="text-gray-600">Aucun message signalé.</p>  <!-- Aucun message signalé -->
 {% endif %}
-{% endblock %}
+{% endblock %}