From 38b27beb9d0e30135b57e2b766dcd0ba5b5aae97 Mon Sep 17 00:00:00 2001
From: Khalid MOUTAOUAKIL <khalid.moutaouakil@sanef.fr>
Date: Mon, 6 Apr 2026 16:49:45 +0200
Subject: [PATCH] Fix KPIs detail serveur sur une seule ligne (inline
 flex-nowrap)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 app/templates/audit_full_detail.html | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/app/templates/audit_full_detail.html b/app/templates/audit_full_detail.html
index 0642de0..4d1d0c6 100644
--- a/app/templates/audit_full_detail.html
+++ b/app/templates/audit_full_detail.html
@@ -15,13 +15,13 @@
 </div>
 
 <!-- KPI -->
-<div class="grid grid-cols-6 gap-3 mb-4">
-    <div class="card p-3 text-center"><div class="text-lg font-bold text-cyber-accent">{{ services|length }}</div><div class="text-xs text-gray-500">Services</div></div>
-    <div class="card p-3 text-center"><div class="text-lg font-bold text-cyber-accent">{{ processes|length }}</div><div class="text-xs text-gray-500">Process</div></div>
-    <div class="card p-3 text-center"><div class="text-lg font-bold text-cyber-accent">{{ listen_ports|length }}</div><div class="text-xs text-gray-500">Ports</div></div>
-    <div class="card p-3 text-center"><div class="text-lg font-bold text-cyber-accent">{{ connections|length }}</div><div class="text-xs text-gray-500">Connexions</div></div>
-    <div class="card p-3 text-center"><div class="text-lg font-bold {% if a.reboot_required %}text-cyber-red{% else %}text-cyber-green{% endif %}">{% if a.reboot_required %}Oui{% else %}Non{% endif %}</div><div class="text-xs text-gray-500">Reboot</div></div>
-    <div class="card p-3 text-center"><div class="text-lg font-bold {% if a.services_failed %}text-cyber-red{% else %}text-cyber-green{% endif %}">{% if a.services_failed %}KO{% else %}OK{% endif %}</div><div class="text-xs text-gray-500">Failed svc</div></div>
+<div style="display:flex;flex-wrap:nowrap;gap:8px;margin-bottom:16px;">
+    <div class="card p-2 text-center" style="flex:1;min-width:0"><div class="text-base font-bold text-cyber-accent">{{ services|length }}</div><div class="text-xs text-gray-500">Services</div></div>
+    <div class="card p-2 text-center" style="flex:1;min-width:0"><div class="text-base font-bold text-cyber-accent">{{ processes|length }}</div><div class="text-xs text-gray-500">Process</div></div>
+    <div class="card p-2 text-center" style="flex:1;min-width:0"><div class="text-base font-bold text-cyber-accent">{{ listen_ports|length }}</div><div class="text-xs text-gray-500">Ports</div></div>
+    <div class="card p-2 text-center" style="flex:1;min-width:0"><div class="text-base font-bold text-cyber-accent">{{ connections|length }}</div><div class="text-xs text-gray-500">Connexions</div></div>
+    <div class="card p-2 text-center" style="flex:1;min-width:0"><div class="text-base font-bold {% if a.reboot_required %}text-cyber-red{% else %}text-cyber-green{% endif %}">{% if a.reboot_required %}Oui{% else %}Non{% endif %}</div><div class="text-xs text-gray-500">Reboot</div></div>
+    <div class="card p-2 text-center" style="flex:1;min-width:0"><div class="text-base font-bold {% if a.services_failed %}text-cyber-red{% else %}text-cyber-green{% endif %}">{% if a.services_failed %}KO{% else %}OK{% endif %}</div><div class="text-xs text-gray-500">Failed svc</div></div>
 </div>
 
 <!-- Onglets -->