Adjust countdown and page navigation
This commit is contained in:
devRaGonSa
@@ -0,0 +1,68 @@
|
|||||||
|
---
|
||||||
|
id: TASK-241
|
||||||
|
title: Adjust countdown and page navigation
|
||||||
|
status: done
|
||||||
|
type: frontend
|
||||||
|
team: Frontend Senior
|
||||||
|
supporting_teams:
|
||||||
|
- Experto en interfaz
|
||||||
|
roadmap_item: foundation
|
||||||
|
priority: medium
|
||||||
|
---
|
||||||
|
|
||||||
|
# TASK-241 - Adjust countdown and page navigation
|
||||||
|
|
||||||
|
## Goal
|
||||||
|
|
||||||
|
Apply the requested visual cleanup to the home countdown and align `partida-actual.html` and `historico-partida.html` with the existing public navigation pattern.
|
||||||
|
|
||||||
|
## Context
|
||||||
|
|
||||||
|
The countdown copy needed to move into the green capsule without duplicating the heading below it. The current-match page still had redundant hero buttons after the shared top navigation was added. The historical match detail page still lacked the shared top navigation and kept a local back button.
|
||||||
|
|
||||||
|
## Steps
|
||||||
|
|
||||||
|
1. Reviewed the existing public nav markup and countdown block.
|
||||||
|
2. Updated the home countdown markup and capsule styling.
|
||||||
|
3. Removed redundant hero buttons from current match and added the shared nav to historical match detail.
|
||||||
|
|
||||||
|
## Files to Read First
|
||||||
|
|
||||||
|
- `AGENTS.md`
|
||||||
|
- `ai/architecture-index.md`
|
||||||
|
- `ai/repo-context.md`
|
||||||
|
- `frontend/index.html`
|
||||||
|
- `frontend/partida-actual.html`
|
||||||
|
- `frontend/historico-partida.html`
|
||||||
|
|
||||||
|
## Expected Files to Modify
|
||||||
|
|
||||||
|
- `frontend/index.html`
|
||||||
|
- `frontend/assets/css/styles.css`
|
||||||
|
- `frontend/partida-actual.html`
|
||||||
|
- `frontend/historico-partida.html`
|
||||||
|
|
||||||
|
## Constraints
|
||||||
|
|
||||||
|
- No backend changes for this task.
|
||||||
|
- No assets, weapons, SVGs or clan images.
|
||||||
|
- Do not touch the weapon icon system.
|
||||||
|
- Keep the countdown target at `2026-08-13T00:00:00+02:00`.
|
||||||
|
|
||||||
|
## Validation
|
||||||
|
|
||||||
|
- `node --check frontend/assets/js/main.js` if touched
|
||||||
|
- `node --check frontend/assets/js/partida-actual.js` if touched
|
||||||
|
- `node --check frontend/assets/js/historico-partida.js` if touched
|
||||||
|
- `git diff --name-only`
|
||||||
|
|
||||||
|
## Outcome
|
||||||
|
|
||||||
|
- The countdown capsule now contains the full launch text and the duplicate white heading was removed.
|
||||||
|
- `partida-actual.html` keeps the shared top navigation and the public scoreboard button, but no longer repeats `VOLVER INICIO` or `ABRIR HISTORICO` inside the hero.
|
||||||
|
- `historico-partida.html` now uses the same shared top navigation and no longer shows `VOLVER HISTORICO`.
|
||||||
|
- No weapon icons, weapon assets or backend code were touched for this task.
|
||||||
|
|
||||||
|
## Change Budget
|
||||||
|
|
||||||
|
- Stayed within a small, HTML/CSS-only frontend scope.
|
||||||
@@ -617,10 +617,9 @@ h2 {
|
|||||||
|
|
||||||
.release-countdown {
|
.release-countdown {
|
||||||
margin-top: 18px;
|
margin-top: 18px;
|
||||||
display: grid;
|
display: flex;
|
||||||
grid-template-columns: minmax(0, 0.85fr) minmax(360px, 1.15fr);
|
flex-direction: column;
|
||||||
align-items: center;
|
gap: 14px;
|
||||||
gap: 18px;
|
|
||||||
padding: 18px;
|
padding: 18px;
|
||||||
border: 1px solid rgba(210, 182, 118, 0.24);
|
border: 1px solid rgba(210, 182, 118, 0.24);
|
||||||
border-radius: 18px;
|
border-radius: 18px;
|
||||||
@@ -635,12 +634,17 @@ h2 {
|
|||||||
|
|
||||||
.release-countdown__copy {
|
.release-countdown__copy {
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
padding: 11px 16px;
|
||||||
|
border: 1px solid rgba(168, 199, 109, 0.3);
|
||||||
|
border-radius: 999px;
|
||||||
|
background: rgba(62, 88, 43, 0.62);
|
||||||
}
|
}
|
||||||
|
|
||||||
.release-countdown__copy h3 {
|
.release-countdown__copy h3 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: clamp(1.15rem, 1.8vw, 1.55rem);
|
color: var(--text-main);
|
||||||
line-height: 1.2;
|
font-size: clamp(0.95rem, 1.45vw, 1.12rem);
|
||||||
|
line-height: 1.25;
|
||||||
}
|
}
|
||||||
|
|
||||||
.release-countdown__units {
|
.release-countdown__units {
|
||||||
|
|||||||
@@ -14,13 +14,24 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="page-shell historical-shell">
|
<div class="page-shell historical-shell">
|
||||||
|
<nav class="public-nav" aria-label="Navegación pública principal">
|
||||||
|
<a class="public-nav__link" href="./index.html">
|
||||||
|
Inicio
|
||||||
|
</a>
|
||||||
|
<a class="public-nav__link" href="./historico.html">
|
||||||
|
Histórico
|
||||||
|
</a>
|
||||||
|
<a class="public-nav__link" href="./stats.html">
|
||||||
|
Estadísticas
|
||||||
|
</a>
|
||||||
|
<a class="public-nav__link" href="./ranking.html">
|
||||||
|
Ranking
|
||||||
|
</a>
|
||||||
|
</nav>
|
||||||
<header class="hero historical-hero">
|
<header class="hero historical-hero">
|
||||||
<div class="hero__overlay"></div>
|
<div class="hero__overlay"></div>
|
||||||
<div class="hero__content historical-hero__content">
|
<div class="hero__content historical-hero__content">
|
||||||
<div class="historical-hero__topline">
|
<div class="historical-hero__topline">
|
||||||
<a class="secondary-button secondary-button--ghost" href="./historico.html">
|
|
||||||
VOLVER HISTORICO
|
|
||||||
</a>
|
|
||||||
<p class="eyebrow">Detalle interno</p>
|
<p class="eyebrow">Detalle interno</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="historical-hero__layout">
|
<div class="historical-hero__layout">
|
||||||
|
|||||||
@@ -93,7 +93,6 @@
|
|||||||
aria-labelledby="release-countdown-title"
|
aria-labelledby="release-countdown-title"
|
||||||
>
|
>
|
||||||
<div class="release-countdown__copy">
|
<div class="release-countdown__copy">
|
||||||
<p class="eyebrow eyebrow--section">Hell Let Loose Vietnam</p>
|
|
||||||
<h3 id="release-countdown-title">
|
<h3 id="release-countdown-title">
|
||||||
Fecha de lanzamiento de Hell Let Loose Vietnam (13 de agosto)
|
Fecha de lanzamiento de Hell Let Loose Vietnam (13 de agosto)
|
||||||
</h3>
|
</h3>
|
||||||
|
|||||||
@@ -32,9 +32,6 @@
|
|||||||
<div class="hero__overlay"></div>
|
<div class="hero__overlay"></div>
|
||||||
<div class="hero__content historical-hero__content">
|
<div class="hero__content historical-hero__content">
|
||||||
<div class="historical-hero__topline">
|
<div class="historical-hero__topline">
|
||||||
<a class="secondary-button secondary-button--ghost" href="./index.html">
|
|
||||||
VOLVER INICIO
|
|
||||||
</a>
|
|
||||||
<p class="eyebrow">Partida en vivo</p>
|
<p class="eyebrow">Partida en vivo</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="historical-hero__layout">
|
<div class="historical-hero__layout">
|
||||||
@@ -58,9 +55,6 @@
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="hero__actions">
|
<div class="hero__actions">
|
||||||
<a class="secondary-button" id="current-match-history" href="./historico.html">
|
|
||||||
Abrir historico
|
|
||||||
</a>
|
|
||||||
<a
|
<a
|
||||||
class="secondary-button"
|
class="secondary-button"
|
||||||
id="current-match-scoreboard"
|
id="current-match-scoreboard"
|
||||||
|
|||||||
Reference in New Issue
Block a user