Polish match detail final scoreboard
This commit is contained in:
@@ -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
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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") {
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user