shni/amayo
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add new sections for Primeros Pasos, Racha Diaria, Recordatorios, Sistema de Juego, Tienda, Tips y un índice de contenidos; update styles for modern pixel art design

Browse Source
This commit is contained in:
shni
2025-10-09 22:12:13 -05:00
parent 91c0b4fc37
commit 84ada00118
39 changed files with 1120 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/server/views/index.ejs
View File

@@ -7,13 +7,13 @@
<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 con decoración de Halloween -->
<!-- Badge Moderno con decoraciones sutiles -->
<div class="inline-block relative">
<span class="pixel-pumpkin absolute -left-12 top-0"></span>
<span class="pixel-pumpkin absolute" style="left: -40px; top: 50%; transform: translateY(-50%);"></span>
<div class="pixel-badge">
<%= appName %> • v<%= version %>
</div>
<span class="pixel-ghost absolute -right-12 top-0" style="animation-delay: 1s;"></span>
<span class="pixel-ghost absolute" style="right: -40px; top: 50%; transform: translateY(-50%);"></span>
</div>
<!-- Título Principal -->
@@ -21,28 +21,28 @@
<h1 class="text-5xl sm:text-6xl md:text-7xl lg:text-8xl leading-tight">
Guía Completa
</h1>
<h2 class="text-4xl sm:text-5xl md:text-6xl">
<h2 class="text-4xl sm:text-5xl md:text-6xl" style="font-family: 'Inter', sans-serif; background: linear-gradient(135deg, #a78bfa, #f59e0b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;">
<%= appName %>
</h2>
</div>
<!-- Decoración de Halloween con murciélagos y estrellas -->
<div class="flex justify-center gap-8 items-center">
<span class="pixel-bat"></span>
<!-- Decoraciones sutiles -->
<div class="flex justify-center gap-6 items-center">
<span class="pixel-star-halloween">✦</span>
<span class="pixel-pumpkin" style="animation-delay: 0.5s;"></span>
<span class="pixel-star-halloween" style="animation-delay: 0.8s;">✦</span>
<span class="pixel-pumpkin"></span>
<span class="pixel-star-halloween" style="animation-delay: 0.5s;">✦</span>
<span class="pixel-ghost" style="animation-delay: 1s;"></span>
<span class="pixel-star-halloween" style="animation-delay: 1.5s;">✦</span>
</div>
<!-- Descripción -->
<!-- Descripción con diseño moderno -->
<div class="pixel-box max-w-3xl mx-auto">
<p class="text-xl sm:text-2xl leading-relaxed">
<p class="text-xl sm:text-2xl leading-relaxed" style="color: var(--text-secondary);">
Sistema completo de
<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>
<span class="gradient-text font-semibold">economía</span>,
<span class="gradient-text font-semibold">minijuegos</span>,
<span class="gradient-text font-semibold">misiones</span> y
<span class="gradient-text font-semibold">IA</span>
para Discord
</p>
</div>

20
src/server/views/layouts/layout.ejs
View File

@@ -11,9 +11,9 @@
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!-- Pixel Art CSS -->
<link rel="stylesheet" href="/assets/css/pixel-art.css?v=<%= version || '2.0.0' %>">
<link rel="stylesheet" href="/assets/css/pixel-sections.css?v=<%= version || '2.0.0' %>">
<!-- Modern Pixel Art CSS -->
<link rel="stylesheet" href="/assets/css/modern-pixel.css?v=<%= version || '2.0.0' %>">
<link rel="stylesheet" href="/assets/css/modern-sections.css?v=<%= version || '2.0.0' %>">
<link rel="stylesheet" href="/assets/css/styles.css?v=<%= version || '2.0.0' %>">
<% if (typeof head !== 'undefined' && head) { %>
<%= head %>
@@ -47,26 +47,26 @@
</div>
<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">
<div class="flex items-center justify-center gap-4 text-sm" style="color: var(--text-secondary);">
<span class="pixel-pumpkin" style="width: 16px; height: 16px;"></span>
<span>VER <%= version %></span>
<span>✦</span>
<span>•</span>
<span>DJS <%= djsVersion %></span>
<span>✦</span>
<span>•</span>
<span><%= currentDateHuman %></span>
<span class="pixel-ghost" style="width: 16px; height: 20px; animation-delay: 1.5s;"></span>
<span class="pixel-ghost" style="width: 16px; height: 20px;"></span>
</div>
</div>
<p class="text-center text-xs pixel-text-dim mb-6 flex items-center justify-center gap-2">
<span class="pixel-bat" style="width: 24px; height: 12px;"></span>
<p class="text-center text-sm mb-6 flex items-center justify-center gap-3" style="color: var(--text-muted);">
<span class="pixel-star-halloween">✦</span>
<span>Amayo © <%= new Date().getFullYear() %> — Documentación para usuarios finales de Discord</span>
<span class="pixel-star-halloween">✦</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
</a>
</div>
</div>

19
src/server/views/partials/navbar.ejs
View File

@@ -1,15 +1,14 @@
<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-3">
<div class="pixel-pumpkin" style="width: 20px; height: 20px;"></div>
<span class="font-['Press_Start_2P'] text-sm" style="color: var(--pixel-pumpkin);"><%= appName %></span>
<span class="pixel-star-halloween">✦</span>
<div class="mx-auto max-w-[120rem] px-4 sm:px-6 lg:px-8 h-16 flex items-center justify-between">
<a href="#" class="flex items-center gap-3 group">
<div class="pixel-pumpkin transition-transform group-hover:scale-110" style="width: 24px; height: 24px;"></div>
<span class="font-['Press_Start_2P'] text-sm gradient-text"><%= appName %></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">Economía</a>
<a href="#faq" class="pixel-tooltip" data-tooltip="👻 Ayuda">FAQ</a>
<div class="hidden md:flex items-center gap-8">
<a href="#primeros-pasos" class="text-sm font-medium hover:text-purple-400 transition-colors" style="color: var(--text-secondary);">Guía</a>
<a href="#minijuegos" class="text-sm font-medium hover:text-purple-400 transition-colors" style="color: var(--text-secondary);">Minijuegos</a>
<a href="#economia" class="text-sm font-medium hover:text-purple-400 transition-colors" style="color: var(--text-secondary);">Economía</a>
<a href="#faq" class="text-sm font-medium hover:text-purple-400 transition-colors" style="color: var(--text-secondary);">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">