This commit is contained in:
devRaGonSa
2026-06-05 16:57:25 +02:00
commit 0da8338ba8
310 changed files with 45849 additions and 0 deletions

128
frontend/index.html Normal file
View File

@@ -0,0 +1,128 @@
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="Comunidad hispana de HLL. Accede al Discord oficial y descubre el trailer del proyecto."
/>
<title>Comunidad Hispana - HLL</title>
<link rel="stylesheet" href="./assets/css/styles.css" />
<link rel="stylesheet" href="./assets/css/hero-header-compact.css" />
</head>
<body
data-backend-base-url="http://127.0.0.1:8000"
data-server-refresh-ms="300000"
>
<div class="page-shell">
<header class="hero">
<div class="hero__overlay"></div>
<div class="hero__content">
<div class="hero__brand">
<div class="logo-frame">
<img
src="./assets/img/logo.png"
alt="Logo oficial de la comunidad HLL"
class="logo-frame__image"
width="1024"
height="1044"
decoding="async"
/>
</div>
<div class="hero__copy">
<h1 class="hero__title">
Comunidad Hispana
<span class="hero__title-accent">HLL</span>
</h1>
<p class="hero__text">
Centro de reunion para escuadras, eventos y acceso directo al
Discord oficial de la comunidad.
</p>
<div class="hero__actions">
<a
class="discord-button"
href="https://discord.com/invite/PedEqZ2Xsa"
target="_blank"
rel="noreferrer"
>
Unirse al Discord
</a>
<a class="secondary-button" href="./historico.html">
Ver historico propio
</a>
</div>
</div>
</div>
</div>
</header>
<main class="content">
<section class="panel panel--video">
<div class="panel__shell">
<div class="panel__header">
<p class="eyebrow eyebrow--section">Trailer</p>
<h2 id="trailer-title">Primer vistazo a HLL Vietnam</h2>
</div>
<div class="video-wrapper">
<iframe
id="trailer-frame"
src="https://www.youtube.com/embed/JzYzYNVWZ_A"
title="Trailer HLL Vietnam"
loading="lazy"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
</div>
</section>
<section class="panel panel--servers" aria-labelledby="servers-title">
<div class="panel__shell">
<div class="panel__header panel__header--servers">
<div>
<p class="eyebrow eyebrow--section">Servidores públicos</p>
<h2 id="servers-title">Estado actual de servidores</h2>
</div>
<p class="status-chip status-chip--fallback" id="servers-badge">
Actualizado no disponible
</p>
</div>
<p class="panel__intro panel__intro--tight">
El panel muestra el ultimo estado disponible consultado de los servidores.
</p>
<div class="panel__actions panel__actions--compact">
<a class="secondary-button secondary-button--compact" href="./historico.html">
Abrir zona historico
</a>
</div>
<div class="servers-grid" id="servers-list" aria-live="polite">
<div class="servers-loading" id="servers-loading-state">
<span class="servers-loading__pulse"></span>
<p>Cargando estado real de servidores...</p>
</div>
</div>
</div>
</section>
<section class="panel panel--clans" aria-labelledby="clans-title">
<div class="panel__shell">
<div class="panel__header">
<p class="eyebrow eyebrow--section">Clanes de la comunidad</p>
<h2 id="clans-title">Grupo de la comunidad</h2>
</div>
<p class="panel__intro">
Clanes activos de la escena hispana con presencia confirmada.
</p>
<div class="clans-grid" id="community-clans-list"></div>
</div>
</section>
</main>
</div>
<script src="./assets/js/config.js"></script>
<script src="./assets/js/main.js"></script>
</body>
</html>