Refactor code structure for improved readability and maintainability
This commit is contained in:
@@ -4,14 +4,16 @@
|
||||
<% const title = pageTitle; %>
|
||||
<% layout('layouts/layout', { title, head, scripts, appName, version, djsVersion, currentDateHuman }); %>
|
||||
|
||||
<header class="relative overflow-hidden py-20 sm:py-28 pixel-corner">
|
||||
<header class="relative overflow-hidden py-20 sm:py-28">
|
||||
<div class="container mx-auto px-4 sm:px-6 lg:px-8 relative">
|
||||
<div class="max-w-5xl mx-auto text-center space-y-12">
|
||||
<!-- Badge Pixel Art -->
|
||||
<div class="inline-block">
|
||||
<!-- Badge Pixel Art con decoración -->
|
||||
<div class="inline-block relative">
|
||||
<span class="pixel-star absolute -left-8 top-0"></span>
|
||||
<div class="pixel-badge">
|
||||
<%= appName %> • v<%= version %>
|
||||
</div>
|
||||
<span class="pixel-star absolute -right-8 top-0" style="animation-delay: 1s;"></span>
|
||||
</div>
|
||||
|
||||
<!-- Título Principal -->
|
||||
@@ -24,25 +26,21 @@
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
<!-- HP Bar decorativo -->
|
||||
<div class="flex justify-center">
|
||||
<div class="pixel-hp-bar">
|
||||
<div class="pixel-heart"></div>
|
||||
<div class="pixel-heart"></div>
|
||||
<div class="pixel-heart"></div>
|
||||
<div class="pixel-heart"></div>
|
||||
<div class="pixel-heart"></div>
|
||||
</div>
|
||||
<!-- Decoración con velas -->
|
||||
<div class="flex justify-center gap-8">
|
||||
<span class="pixel-candle"></span>
|
||||
<span class="pixel-candle" style="animation-delay: 0.5s;"></span>
|
||||
<span class="pixel-candle" style="animation-delay: 1s;"></span>
|
||||
</div>
|
||||
|
||||
<!-- Descripción -->
|
||||
<div class="pixel-box max-w-3xl mx-auto">
|
||||
<p class="text-xl sm:text-2xl leading-relaxed">
|
||||
Sistema completo de
|
||||
<span class="text-pixel-accent-4 font-bold">economía</span>,
|
||||
<span class="text-pixel-accent-3 font-bold">minijuegos</span>,
|
||||
<span class="text-pixel-accent-1 font-bold">misiones</span> y
|
||||
<span class="text-pixel-accent-2 font-bold">IA</span>
|
||||
<span style="color: var(--pixel-accent-1); font-weight: bold;">economía</span>,
|
||||
<span style="color: var(--pixel-accent-3); font-weight: bold;">minijuegos</span>,
|
||||
<span style="color: var(--pixel-accent-5); font-weight: bold;">misiones</span> y
|
||||
<span style="color: var(--pixel-accent-2); font-weight: bold;">IA</span>
|
||||
para Discord
|
||||
</p>
|
||||
</div>
|
||||
@@ -50,7 +48,7 @@
|
||||
<!-- Botones de Acción -->
|
||||
<div class="flex flex-col sm:flex-row gap-6 justify-center items-center pt-4">
|
||||
<a href="#primeros-pasos" class="pixel-btn">
|
||||
► Comenzar ahora
|
||||
▶ Comenzar ahora
|
||||
</a>
|
||||
|
||||
<button id="toggle-nav" class="pixel-btn pixel-btn-secondary">
|
||||
@@ -58,16 +56,18 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Stats Footer -->
|
||||
<!-- Stats Footer con decoración -->
|
||||
<div class="flex flex-wrap justify-center gap-4 pt-8">
|
||||
<div class="pixel-box py-3 px-6 text-sm">
|
||||
<span class="pixel-text-dim">Discord.js</span> <%= djsVersion %>
|
||||
<div class="pixel-box py-3 px-6 text-sm flex items-center gap-2">
|
||||
<span class="pixel-leaf"></span>
|
||||
<span><span class="pixel-text-dim">Discord.js</span> <%= djsVersion %></span>
|
||||
</div>
|
||||
<div class="pixel-box py-3 px-6 text-sm flex items-center gap-2">
|
||||
<span>✦</span>
|
||||
<span><span class="pixel-text-dim">Actualizado:</span> <%= currentDateHuman %></span>
|
||||
</div>
|
||||
<div class="pixel-box py-3 px-6 text-sm">
|
||||
<span class="pixel-text-dim">Actualizado:</span> <%= currentDateHuman %>
|
||||
</div>
|
||||
<div class="pixel-box py-3 px-6 text-sm pixel-corner">
|
||||
<span class="text-pixel-accent-4 font-bold">23 Secciones</span> • Creación de Contenido Incluida
|
||||
<span style="color: var(--pixel-accent-3); font-weight: bold;">23 Secciones</span> • Creación de Contenido
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -34,34 +34,39 @@
|
||||
<p class="text-sm pixel-text-dim">Sistema completo de juego, economía y gestión para Discord</p>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap justify-center gap-4 mb-6 text-sm">
|
||||
<div class="flex flex-wrap justify-center gap-4 mb-6 text-sm items-center">
|
||||
<span class="pixel-leaf" style="width: 16px; height: 10px;"></span>
|
||||
<a href="#primeros-pasos">Primeros Pasos</a>
|
||||
<span>•</span>
|
||||
<span>✦</span>
|
||||
<a href="#comandos-basicos">Comandos</a>
|
||||
<span>•</span>
|
||||
<span>✦</span>
|
||||
<a href="#minijuegos">Minijuegos</a>
|
||||
<span>•</span>
|
||||
<span>✦</span>
|
||||
<a href="#faq">FAQ</a>
|
||||
<span class="pixel-leaf" style="width: 16px; height: 10px; transform: rotate(20deg);"></span>
|
||||
</div>
|
||||
|
||||
<div class="pixel-border p-4 mb-6">
|
||||
<div class="pixel-border p-4 mb-6" style="background: linear-gradient(135deg, var(--pixel-bg-dark) 0%, var(--pixel-bg-medium) 100%);">
|
||||
<div class="pixel-status-bar justify-center">
|
||||
<span class="pixel-star" style="width: 12px; height: 12px;"></span>
|
||||
<span>VER <%= version %></span>
|
||||
<span>•</span>
|
||||
<span>✦</span>
|
||||
<span>DJS <%= djsVersion %></span>
|
||||
<span>•</span>
|
||||
<span>✦</span>
|
||||
<span><%= currentDateHuman %></span>
|
||||
<span class="pixel-star" style="width: 12px; height: 12px; animation-delay: 1.5s;"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="text-center text-xs pixel-text-dim mb-6">
|
||||
<span class="pixel-coin"></span>
|
||||
Amayo © <%= new Date().getFullYear() %> — Documentación para usuarios finales de Discord
|
||||
<p class="text-center text-xs pixel-text-dim mb-6 flex items-center justify-center gap-2">
|
||||
<span class="pixel-coin" style="width: 16px; height: 16px;"></span>
|
||||
<span>Amayo © <%= new Date().getFullYear() %> — Documentación para usuarios finales de Discord</span>
|
||||
<span class="pixel-candle" style="width: 8px; height: 12px;"></span>
|
||||
</p>
|
||||
|
||||
<div class="text-center">
|
||||
<a class="pixel-btn-secondary pixel-btn inline-block" href="#primeros-pasos">
|
||||
<span aria-hidden="true">↑</span> Volver arriba
|
||||
<span aria-hidden="true">✦</span> Volver arriba <span aria-hidden="true">✦</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,14 +1,15 @@
|
||||
<nav class="fixed inset-x-0 top-0 z-50 pixel-navbar">
|
||||
<div class="mx-auto max-w-[120rem] px-4 sm:px-6 lg:px-8 h-14 flex items-center justify-between">
|
||||
<a href="#" class="flex items-center gap-2">
|
||||
<a href="#" class="flex items-center gap-3">
|
||||
<div class="pixel-coin" style="width: 20px; height: 20px;"></div>
|
||||
<span class="font-['Press_Start_2P'] text-sm"><%= appName %></span>
|
||||
<span class="font-['Press_Start_2P'] text-sm" style="color: var(--pixel-accent-3);"><%= appName %></span>
|
||||
<span class="pixel-star" style="width: 12px; height: 12px;"></span>
|
||||
</a>
|
||||
<div class="hidden md:flex items-center gap-6">
|
||||
<a href="#primeros-pasos" class="pixel-tooltip" data-tooltip="Empieza aquí">Guía</a>
|
||||
<a href="#minijuegos" class="pixel-tooltip" data-tooltip="Juega">Minijuegos</a>
|
||||
<a href="#economia" class="pixel-tooltip" data-tooltip="Gana dinero">Economía</a>
|
||||
<a href="#faq" class="pixel-tooltip" data-tooltip="Ayuda">FAQ</a>
|
||||
<a href="#primeros-pasos" class="pixel-tooltip" data-tooltip="✨ Empieza aquí">Guía</a>
|
||||
<a href="#minijuegos" class="pixel-tooltip" data-tooltip="🎮 Juega">Minijuegos</a>
|
||||
<a href="#economia" class="pixel-tooltip" data-tooltip="💰 Gana">Economía</a>
|
||||
<a href="#faq" class="pixel-tooltip" data-tooltip="❓ Ayuda">FAQ</a>
|
||||
</div>
|
||||
<button id="toggle-nav" class="md:hidden" aria-label="Abrir navegación">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
|
||||
@@ -1,33 +1,34 @@
|
||||
<nav id="toc" class="hidden lg:block w-full max-w-sm pixel-box lg:sticky lg:top-24 lg:max-h-[calc(100vh-6rem)] lg:w-80 lg:overflow-y-auto">
|
||||
<div class="font-['Press_Start_2P'] text-xs p-6 uppercase tracking-wide text-pixel-accent-4 pixel-corner">
|
||||
≡ Índice
|
||||
<div class="font-['Press_Start_2P'] text-xs p-6 uppercase tracking-wide pixel-corner flex items-center justify-between">
|
||||
<span style="color: var(--pixel-accent-3);">📖 Índice</span>
|
||||
<span class="pixel-candle" style="width: 8px; height: 12px;"></span>
|
||||
</div>
|
||||
<ul class="ps-8 mt-4 space-y-3 text-sm pb-6">
|
||||
<li><a href="#primeros-pasos">► Primeros Pasos</a></li>
|
||||
<li><a href="#comandos-basicos">► Comandos Básicos</a></li>
|
||||
<li><a href="#ejemplos-basicos">► Ejemplos Básicos</a></li>
|
||||
<li><a href="#sistema-juego">► Sistema de Juego</a></li>
|
||||
<li><a href="#minijuegos">► Minijuegos</a></li>
|
||||
<li><a href="#inventario-equipo">► Inventario y Equipo</a></li>
|
||||
<li><a href="#economia">► Economía</a></li>
|
||||
<li><a href="#tienda">► Tienda</a></li>
|
||||
<li><a href="#crafteo">► Crafteo</a></li>
|
||||
<li><a href="#logros">► Logros</a></li>
|
||||
<li><a href="#misiones">► Misiones</a></li>
|
||||
<li><a href="#racha-diaria">► Racha Diaria</a></li>
|
||||
<li><a href="#consumibles">► Consumibles</a></li>
|
||||
<li><a href="#cofres">► Cofres</a></li>
|
||||
<li><a href="#encantamientos">► Encantamientos</a></li>
|
||||
<li><a href="#fundicion">► Fundición</a></li>
|
||||
<li><a href="#ia">► IA</a></li>
|
||||
<li><a href="#recordatorios">► Recordatorios</a></li>
|
||||
<li><a href="#alianzas">► Alianzas</a></li>
|
||||
<li><a href="#admin">► Administración</a></li>
|
||||
<li><a href="#configuracion">► Configuración</a></li>
|
||||
<li><a href="#ejemplos-avanzados">► Ejemplos Avanzados</a></li>
|
||||
<li><a href="#estadisticas">► Estadísticas</a></li>
|
||||
<li><a href="#tips">► Tips y Trucos</a></li>
|
||||
<li><a href="#faq">► FAQ</a></li>
|
||||
<li><a href="#primeros-pasos">✦ Primeros Pasos</a></li>
|
||||
<li><a href="#comandos-basicos">✦ Comandos Básicos</a></li>
|
||||
<li><a href="#ejemplos-basicos">✦ Ejemplos Básicos</a></li>
|
||||
<li><a href="#sistema-juego">✦ Sistema de Juego</a></li>
|
||||
<li><a href="#minijuegos">✦ Minijuegos</a></li>
|
||||
<li><a href="#inventario-equipo">✦ Inventario y Equipo</a></li>
|
||||
<li><a href="#economia">✦ Economía</a></li>
|
||||
<li><a href="#tienda">✦ Tienda</a></li>
|
||||
<li><a href="#crafteo">✦ Crafteo</a></li>
|
||||
<li><a href="#logros">✦ Logros</a></li>
|
||||
<li><a href="#misiones">✦ Misiones</a></li>
|
||||
<li><a href="#racha-diaria">✦ Racha Diaria</a></li>
|
||||
<li><a href="#consumibles">✦ Consumibles</a></li>
|
||||
<li><a href="#cofres">✦ Cofres</a></li>
|
||||
<li><a href="#encantamientos">✦ Encantamientos</a></li>
|
||||
<li><a href="#fundicion">✦ Fundición</a></li>
|
||||
<li><a href="#ia">✦ IA</a></li>
|
||||
<li><a href="#recordatorios">✦ Recordatorios</a></li>
|
||||
<li><a href="#alianzas">✦ Alianzas</a></li>
|
||||
<li><a href="#admin">✦ Administración</a></li>
|
||||
<li><a href="#configuracion">✦ Configuración</a></li>
|
||||
<li><a href="#ejemplos-avanzados">✦ Ejemplos Avanzados</a></li>
|
||||
<li><a href="#estadisticas">✦ Estadísticas</a></li>
|
||||
<li><a href="#tips">✦ Tips y Trucos</a></li>
|
||||
<li><a href="#faq">✦ FAQ</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user