Polish match detail final scoreboard

This commit is contained in:
devRaGonSa
2026-05-20 10:50:25 +02:00
parent 511ebedde7
commit d788597083
4 changed files with 30 additions and 39 deletions

View File

@@ -1,7 +1,7 @@
---
id: TASK-138
title: Polish RCON match detail final scoreboard UI
status: pending
status: done
type: frontend
team: Experto en interfaz
supporting_teams:
@@ -151,11 +151,28 @@ Then hard refresh with `Ctrl+F5` and verify:
## Outcome
To be completed by AI Platform Run / Codex CLI.
- Replaced the hero subtitle with only the server name, removing RCON implementation wording from the visible hero.
- Renamed the main detail heading from `Datos disponibles` to `Marcador final`.
- Increased the scoreboard score column and faction emblem sizing while preserving the left/right side layout, central score, map, mode, winner and compact metadata.
- Removed the unused hidden timeline markup from `frontend/historico-partida.html` so event labels such as `Eventos` and `Linea de tiempo` are no longer present in the match detail DOM.
- Preserved the player table, map hero, safe scoreboard action behavior and existing HLL Vietnam dark tactical styling.
## Validation Result
To be completed by AI Platform Run / Codex CLI.
- PASS: `node --check frontend/assets/js/historico-partida.js`
- PASS: `node --check frontend/assets/js/historico.js`
- PASS: `node --check frontend/assets/js/historico-recent-live.js`
- PASS: `python -m compileall backend/app`
- PASS: `powershell -ExecutionPolicy Bypass -File scripts/run-integration-tests.ps1`
- PASS: `powershell -ExecutionPolicy Bypass -File scripts/run-rcon-data-pipeline-tests.ps1`
- Note: the script completed successfully but emitted existing `ResourceWarning` messages from backend unittest sqlite connections.
- PASS: `docker compose up -d --build backend frontend`
- PASS: `Invoke-WebRequest "http://localhost:8000/health" | Select-Object -ExpandProperty Content`
- PASS: `Invoke-WebRequest "http://localhost:8000/api/historical/recent-matches?server=all-servers&limit=10" | Select-Object -ExpandProperty Content`
- Manual/rendered verification: Browser plugin was listed, but the required Node runtime tool was not exposed in this session; used local Chrome headless fallback.
- Verified rendered DOM contains `Marcador final`, `3 : 2`, `Ganador: Aliados`, `Carentan`, `1 h 30 min`, `AntonioPruna` and `M1 GARAND`.
- Verified rendered DOM does not include `Partida RCON materializada`, `Confianza`, `Fuente`, `Base`, `Eventos`, `Linea de tiempo`, event labels, `snapshot`, Elo/MVP blocks or Comunidad Hispana #03.
- Captured screenshots outside the repository at `C:\Temp\task-138-match-detail-final.png`, `C:\Temp\task-138-match-detail-mobile-final.png` and `C:\Temp\task-138-match-detail-mobile-score-final.png`.
## Change Budget

View File

@@ -18,10 +18,10 @@
.historical-scoreboard-layout__main {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(220px, 320px) minmax(0, 1fr);
grid-template-columns: minmax(0, 1fr) minmax(240px, 340px) minmax(0, 1fr);
align-items: center;
gap: 22px;
padding: 24px 28px;
padding: 28px 30px;
border: 1px solid rgba(210, 182, 118, 0.2);
border-radius: 24px;
background:
@@ -32,14 +32,14 @@
.historical-scoreboard-side {
display: grid;
grid-template-columns: 112px minmax(0, 1fr);
grid-template-columns: 124px minmax(0, 1fr);
align-items: center;
gap: 18px;
min-height: 136px;
min-height: 148px;
}
.historical-scoreboard-side--axis {
grid-template-columns: minmax(0, 1fr) 112px;
grid-template-columns: minmax(0, 1fr) 124px;
text-align: right;
}
@@ -57,8 +57,8 @@
}
.historical-scoreboard-side__emblem {
width: 112px;
height: 112px;
width: 124px;
height: 124px;
border-radius: 999px;
object-fit: contain;
padding: 10px;
@@ -110,7 +110,7 @@
.historical-scoreboard-center__score {
color: var(--text);
font-size: clamp(4rem, 8vw, 7rem);
font-size: clamp(4.6rem, 8.6vw, 7.6rem);
line-height: 0.9;
letter-spacing: 0.02em;
}

View File

@@ -66,7 +66,7 @@ function renderMatchDetail(item, nodes) {
const mapName = item.map?.pretty_name || item.map?.name || "Mapa no disponible";
const serverName = item.server?.name || item.server?.slug || "Servidor no disponible";
nodes.title.textContent = mapName;
nodes.summary.textContent = `${serverName} - ${formatDetailSubtitle(item)}`;
nodes.summary.textContent = serverName;
nodes.note.textContent = "";
renderMapHero(item, mapName, nodes);
nodes.grid.innerHTML = renderScoreboardDetail(item, { mapName, serverName });
@@ -337,19 +337,6 @@ function normalizeLookupText(value) {
.trim();
}
function formatDetailSubtitle(item) {
if (item.capture_basis === "rcon-materialized-admin-log") {
return "RCON";
}
if (item.capture_basis === "rcon-competitive-window") {
return "RCON";
}
if (item.result_source === "public-scoreboard-match") {
return "Partida del scoreboard";
}
return "Partida historica";
}
function formatTeamSide(value) {
const normalized = String(value || "").toLowerCase();
if (normalized === "allies" || normalized === "allied") {

View File

@@ -66,7 +66,7 @@
<div class="panel__header historical-panel__header">
<div>
<p class="eyebrow eyebrow--section">Partida historica</p>
<h2 id="match-detail-panel-title">Datos disponibles</h2>
<h2 id="match-detail-panel-title">Marcador final</h2>
<p class="historical-panel__note" id="match-detail-note">
Leyendo el detalle interno de la partida.
</p>
@@ -106,19 +106,6 @@
</table>
</div>
</div>
<div class="historical-detail-section" id="match-detail-timeline-section" hidden>
<div class="historical-detail-section__header">
<div>
<p class="eyebrow eyebrow--section">Eventos</p>
<h3>Linea de tiempo</h3>
</div>
<p class="historical-panel__note" id="match-detail-timeline-note">
Revisando eventos registrados para esta partida.
</p>
</div>
<p class="historical-state" id="match-detail-timeline-state" hidden></p>
<div class="historical-summary-grid" id="match-detail-timeline-grid" hidden></div>
</div>
<div class="historical-match-card__actions" id="match-detail-actions" hidden></div>
</div>
</section>