diff --git a/ai/tasks/done/TASK-036-historical-page-branding-and-copy-cleanup.md b/ai/tasks/done/TASK-036-historical-page-branding-and-copy-cleanup.md new file mode 100644 index 0000000..92cd321 --- /dev/null +++ b/ai/tasks/done/TASK-036-historical-page-branding-and-copy-cleanup.md @@ -0,0 +1,71 @@ +# TASK-036-historical-page-branding-and-copy-cleanup + +## Goal +Pulir la página histórica propia del proyecto en branding y copy, eliminando formulaciones que suenan técnicas o poco naturales, añadiendo el logo de la comunidad y reforzando la coherencia visual con la landing principal. + +## Context +La página histórica ya es funcional y útil, pero hay varios ajustes de acabado que mejorarían claramente la percepción del producto: +- eliminar la palabra `táctico` del hero de la página histórica +- añadir el logo de la comunidad también en esta página +- sustituir formulaciones con `importado` por textos más naturales como `registrado` o `registradas` +- mantener la coherencia visual con la landing principal + +Estos cambios son de UX/copy/branding y no deben alterar la arquitectura histórica ya construida. + +## Steps +1. Revisar la página histórica actual y su hero. +2. Eliminar o reformular el texto del hero para quitar la palabra `táctico`. +3. Añadir el logo de la comunidad en la página histórica usando la ruta de asset local ya establecida por el proyecto. +4. Revisar todos los textos visibles relacionados con cobertura o datos históricos y sustituir las referencias a: + - `importado` + - `importada` + - `importados` + - `importadas` + por formulaciones más naturales y adecuadas, preferentemente: + - `registrado` + - `registrada` + - `registrados` + - `registradas` + o equivalentes mejores si encajan más naturalmente con la UI. +5. Revisar que los nuevos textos no rompan layout, cards, badges o títulos. +6. Mantener la estética coherente con la landing y con la identidad actual del proyecto. +7. No introducir todavía nuevas métricas ni nuevas pestañas en esta task. +8. Al completar la implementación: + - dejar el repositorio consistente + - hacer commit + - hacer push al remoto si el entorno lo permite + +## Files to Read First +- AGENTS.md +- frontend/historico.html +- frontend/assets/css/historico.css +- frontend/assets/js/historico.js +- frontend/index.html +- frontend/assets/css/styles.css +- ai/repo-context.md + +## Expected Files to Modify +- frontend/historico.html +- frontend/assets/css/historico.css +- frontend/assets/js/historico.js +- opcionalmente frontend/assets/img/logo.png si solo hace falta referenciarlo correctamente, no reemplazarlo +- opcionalmente documentación mínima si hubiera un cambio visible que merezca reflejarse + +## Constraints +- No cambiar la arquitectura de la página histórica. +- No crear páginas externas o dependientes de la comunidad. +- No romper la UI histórica existente. +- No introducir librerías nuevas. +- No hacer cambios destructivos. +- Mantener el trabajo centrado en branding, copy y acabado. + +## Validation +- La palabra `táctico` desaparece del hero histórico. +- El logo de la comunidad aparece correctamente en la página histórica. +- Los textos visibles dejan de sonar técnicos o artificiales por el uso de `importado`. +- La página sigue siendo coherente visualmente con la landing. +- Los cambios quedan committeados y se hace push al remoto si el entorno lo permite. + +## Change Budget +- Preferir menos de 4 archivos modificados. +- Preferir menos de 180 líneas cambiadas. diff --git a/frontend/assets/css/historico.css b/frontend/assets/css/historico.css index 2db6113..1a1aef1 100644 --- a/frontend/assets/css/historico.css +++ b/frontend/assets/css/historico.css @@ -24,6 +24,18 @@ gap: 24px; } +.historical-hero__layout { + display: grid; + grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); + align-items: center; + gap: 32px; +} + +.historical-logo-frame { + width: min(300px, 100%); + min-height: 220px; +} + .historical-hero__title { max-width: 12ch; } @@ -228,6 +240,7 @@ } @media (max-width: 720px) { + .historical-hero__layout, .historical-hero__topline, .historical-panel__header, .historical-match-card__top { @@ -235,6 +248,10 @@ align-items: flex-start; } + .historical-hero__layout { + display: flex; + } + .historical-selector { flex-direction: column; } diff --git a/frontend/assets/js/historico.js b/frontend/assets/js/historico.js index 57e4254..fe2def2 100644 --- a/frontend/assets/js/historico.js +++ b/frontend/assets/js/historico.js @@ -27,7 +27,7 @@ document.addEventListener("DOMContentLoaded", () => { syncActiveButtons(selectorButtons, activeServerSlug); setRangeBadge(rangeNode, "Cargando rango temporal", false); summaryNoteNode.textContent = - "Este bloque resume solo la cobertura ya importada en la base local."; + "Este bloque resume solo la cobertura ya registrada en la base local."; renderSummaryLoading(summaryNode); weeklyWindowNoteNode.textContent = "Cargando ventana semanal..."; setState(weeklyStateNode, "Cargando ranking semanal..."); @@ -81,7 +81,7 @@ function hydrateSummary(result, summaryNode, rangeNode, noteNode) { renderSummaryError(summaryNode); setRangeBadge(rangeNode, "Resumen historico no disponible", false); noteNode.textContent = - "No se pudo leer la cobertura importada persistida para este servidor."; + "No se pudo leer la cobertura historica registrada para este servidor."; return; } @@ -91,7 +91,7 @@ function hydrateSummary(result, summaryNode, rangeNode, noteNode) { renderSummaryEmpty(summaryNode); setRangeBadge(rangeNode, "Sin cobertura historica", false); noteNode.textContent = - "Todavia no existe cobertura importada suficiente en la base local."; + "Todavia no existe cobertura historica suficiente en la base local."; return; } @@ -101,7 +101,7 @@ function hydrateSummary(result, summaryNode, rangeNode, noteNode) { const rangeLabel = buildCoverageBadgeLabel(coverage, timeRange); setRangeBadge( rangeNode, - rangeLabel || "Cobertura importada parcial", + rangeLabel || "Cobertura registrada parcial", coverage.status === "week-plus", ); noteNode.textContent = buildSummaryNote( @@ -112,12 +112,12 @@ function hydrateSummary(result, summaryNode, rangeNode, noteNode) { summaryNode.innerHTML = [ renderSummaryCard("Servidor", summary.server?.name || "Servidor no disponible"), renderSummaryCard( - "Partidas importadas", + "Partidas registradas", formatNumber(summary.imported_matches_count ?? summary.matches_count), ), renderSummaryCard("Jugadores unicos", formatNumber(summary.unique_players)), renderSummaryCard( - "Cobertura importada", + "Cobertura registrada", formatCoverageDays(coverage.coverage_days), ), renderSummaryCard("Primera partida", formatTimestamp(coverage.first_match_at)), @@ -288,7 +288,7 @@ function buildCoverageBadgeLabel(coverage, timeRange) { coverage?.last_match_at || timeRange?.end, ); if (coverageDays !== "Cobertura no disponible" && rangeLabel) { - return `${coverageDays} importados`; + return `${coverageDays} registrados`; } return rangeLabel; } @@ -296,7 +296,7 @@ function buildCoverageBadgeLabel(coverage, timeRange) { function buildSummaryNote(summaryBasis, weeklyWindowDays, coverage) { const basisLabel = summaryBasis === "persisted-import" - ? "la cobertura ya importada en la base local" + ? "la cobertura ya registrada en la base local" : "el historico persistido disponible"; const weeklyWindowLabel = Number.isFinite(Number(weeklyWindowDays)) ? `${weeklyWindowDays} dias` diff --git a/frontend/historico.html b/frontend/historico.html index f157e0c..0bb3c03 100644 --- a/frontend/historico.html +++ b/frontend/historico.html @@ -22,32 +22,44 @@
Historico propio
-- Consulta cobertura importada, ranking semanal y cierres - recientes usando solo la capa historica interna del proyecto. -
+
+ Consulta la cobertura registrada, el ranking semanal y los + cierres recientes usando solo la capa historica interna del proyecto. +
+Cobertura importada
+Cobertura registrada
- Este bloque resume solo la cobertura ya importada en la base local. + Este bloque resume solo la cobertura ya registrada en la base local.
@@ -115,7 +127,7 @@
Partidas recientes
- Lista de cierres ya importados para el servidor activo. + Lista de cierres ya registrados para el servidor activo.