fix: Evitar desbordamiento horizontal en logs

- Agregado overflow-x-auto a contenedores de logs
- Agregado break-words y overflow-wrap-anywhere a líneas de logs
- Aplicado tanto en logs de aplicaciones como en errores del sistema
- Las líneas largas ahora se ajustan correctamente sin scroll horizontal
This commit is contained in:
2026-01-20 06:43:46 -05:00
parent 13b36dda5f
commit 7a66f25150

View File

@@ -238,9 +238,12 @@
<!-- Tab Content: App Logs -->
<div
id="content-app-logs"
class="flex-1 bg-[#0a0f16] overflow-y-auto p-4 font-mono text-sm tab-content"
class="flex-1 bg-[#0a0f16] overflow-y-auto overflow-x-auto p-4 font-mono text-sm tab-content"
>
<div id="log-container" class="space-y-1">
<div
id="log-container"
class="space-y-1 break-words overflow-wrap-anywhere"
>
<!-- Welcome Message -->
<div class="text-[#9dabb9] opacity-50">
<span class="text-green-400"></span> SIAX Monitor
@@ -256,9 +259,12 @@
<!-- Tab Content: System Errors -->
<div
id="content-system-errors"
class="hidden flex-1 bg-[#0a0f16] overflow-y-auto p-4 font-mono text-sm tab-content"
class="hidden flex-1 bg-[#0a0f16] overflow-y-auto overflow-x-auto p-4 font-mono text-sm tab-content"
>
<div id="system-errors-container" class="space-y-1">
<div
id="system-errors-container"
class="space-y-1 break-words overflow-wrap-anywhere"
>
<div class="text-[#9dabb9] opacity-50">
<span class="text-yellow-400"></span> Cargando logs
de errores del sistema...
@@ -405,7 +411,8 @@
function appendLog(type, message, logData = null) {
const logContainer = document.getElementById("log-container");
const logEntry = document.createElement("div");
logEntry.className = "log-line";
logEntry.className =
"log-line break-words overflow-wrap-anywhere";
const timestamp = new Date()
.toISOString()
@@ -572,7 +579,7 @@
color = "text-blue-400";
}
return `<div class="log-line ${color}">${icon} ${escapeHtml(line)}</div>`;
return `<div class="log-line break-words overflow-wrap-anywhere ${color}">${icon} ${escapeHtml(line)}</div>`;
})
.join("");