feat: Mejorar el diseño del pie de página con nuevas secciones y estilos

This commit is contained in:
2025-10-09 23:26:55 -05:00
parent e3994c352a
commit c9dd77b4bd
2 changed files with 50 additions and 42 deletions

View File

@@ -1,6 +1,6 @@
{ {
"name": "amayo", "name": "amayo",
"version": "2.0.17", "version": "2.0.18",
"description": "", "description": "",
"main": "src/main.ts", "main": "src/main.ts",
"scripts": { "scripts": {

View File

@@ -36,54 +36,62 @@
</a> </a>
</div> </div>
<!-- Stats Footer con decoración y SVG background --> <!-- Stats Footer con SVG Background de dos secciones -->
<div class="flex flex-wrap justify-center gap-4 pt-8"> <div class="flex flex-wrap justify-center gap-6 pt-8">
<!-- Primera fila: Discord.js y Fecha -->
<div class="flex flex-wrap justify-center gap-6 w-full max-w-4xl">
<!-- Discord.js Version --> <!-- Discord.js Version -->
<div class="relative overflow-hidden py-3 px-6 text-sm flex items-center gap-2" <div class="relative overflow-hidden flex-1 min-w-[280px] max-w-[400px]"
style="background-image: url('/assets/images/snap.svg'); style="background-image: url('/assets/images/snap.svg');
background-size: cover; background-size: cover;
background-position: center; background-position: left center;
background-repeat: no-repeat; background-repeat: no-repeat;
min-width: 180px; border-radius: 16px;
border-radius: 12px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);">
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);"> <div class="absolute inset-0 bg-gradient-to-br from-black/50 via-black/40 to-transparent backdrop-blur-[2px] rounded-2xl"></div>
<div class="absolute inset-0 bg-black/40 backdrop-blur-sm rounded-xl"></div> <div class="relative z-10 py-4 px-6 flex flex-col items-center justify-center gap-2 min-h-[100px]">
<div class="relative z-10 flex items-center gap-2 flex-wrap justify-center"> <span class="pixel-leaf text-2xl"></span>
<span class="pixel-leaf"></span> <div class="text-center">
<span class="whitespace-nowrap"><span class="pixel-text-dim">Discord.js</span> <%= djsVersion %></span> <p class="text-sm pixel-text-dim mb-1">Discord.js</p>
<p class="text-xl font-bold text-white"><%= djsVersion %></p>
</div>
</div> </div>
</div> </div>
<!-- Fecha de actualización --> <!-- Fecha de actualización -->
<div class="relative overflow-hidden py-3 px-6 text-sm flex items-center gap-2" <div class="relative overflow-hidden flex-1 min-w-[280px] max-w-[400px]"
style="background-image: url('/assets/images/snap.svg'); style="background-image: url('/assets/images/snap.svg');
background-size: cover; background-size: cover;
background-position: center; background-position: right center;
background-repeat: no-repeat; background-repeat: no-repeat;
min-width: 200px; border-radius: 16px;
border-radius: 12px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);">
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);"> <div class="absolute inset-0 bg-gradient-to-br from-black/50 via-black/40 to-transparent backdrop-blur-[2px] rounded-2xl"></div>
<div class="absolute inset-0 bg-black/40 backdrop-blur-sm rounded-xl"></div> <div class="relative z-10 py-4 px-6 flex flex-col items-center justify-center gap-2 min-h-[100px]">
<div class="relative z-10 flex items-center gap-2 flex-wrap justify-center"> <span class="text-2xl">✦</span>
<span>✦</span> <div class="text-center">
<span class="whitespace-nowrap"><span class="pixel-text-dim">Actualizado:</span> <%= currentDateHuman %></span> <p class="text-sm pixel-text-dim mb-1">Actualizado</p>
<p class="text-xl font-bold text-white"><%= currentDateHuman %></p>
</div>
</div>
</div> </div>
</div> </div>
<!-- Secciones --> <!-- Segunda fila: Secciones (Ocupa todo el ancho) -->
<div class="relative overflow-hidden py-3 px-6 text-sm" <div class="relative overflow-hidden w-full max-w-4xl"
style="background-image: url('/assets/images/snap.svg'); style="background-image: url('/assets/images/snap.svg');
background-size: cover; background-size: cover;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
min-width: 220px; border-radius: 16px;
border-radius: 12px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);">
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);"> <div class="absolute inset-0 bg-gradient-to-br from-black/50 via-black/40 to-transparent backdrop-blur-[2px] rounded-2xl"></div>
<div class="absolute inset-0 bg-black/40 backdrop-blur-sm rounded-xl"></div> <div class="relative z-10 py-6 px-8 flex flex-col items-center justify-center gap-3 min-h-[120px]">
<div class="relative z-10 flex items-center justify-center gap-2 flex-wrap"> <span class="text-3xl">🎮</span>
<span style="color: var(--pixel-accent-3); font-weight: bold;">23 Secciones</span> <div class="text-center space-y-1">
<span>•</span> <p class="text-2xl font-bold" style="color: var(--pixel-accent-3);">23 Secciones</p>
<span class="whitespace-nowrap">Creación de Contenido</span> <p class="text-lg text-white/90">Sistema Completo • Creación de Contenido</p>
</div>
</div> </div>
</div> </div>
</div> </div>