qreastech/MNQ-Catering-y-Evento
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Revert "feat: slower entrance animations for a more elegant feel"

Browse Source 
This reverts commit 62355e154d.
This commit is contained in:
Manuel
2026-05-10 16:29:46 +02:00
parent 62355e154d
commit 49f391ee49
1 changed files with 28 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/animations.css
+28 -15
View File
@@ -7,10 +7,15 @@
.reveal {
opacity: 0;
transform: translateY(32px);
transform: translateY(28px);
transition:
opacity 1200ms cubic-bezier(0.22, 1, 0.36, 1),
transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
opacity 800ms cubic-bezier(0.22, 1, 0.36, 1),
transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal.visible {
opacity: 1;
transform: translateY(0);
}
/* stagger via CSS variable set by JS */
@@ -19,10 +24,14 @@
/* Variante horizontal (desde izquierda) */
.reveal-left {
opacity: 0;
transform: translateX(-40px);
transform: translateX(-32px);
transition:
opacity 1300ms cubic-bezier(0.22, 1, 0.36, 1),
transform 1300ms cubic-bezier(0.22, 1, 0.36, 1);
opacity 900ms cubic-bezier(0.22, 1, 0.36, 1),
transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-left.visible {
opacity: 1;
transform: translateX(0);
}
/* Variante scale (para imágenes de galería) */
@@ -30,8 +39,12 @@
opacity: 0;
transform: scale(0.94);
transition:
opacity 1100ms cubic-bezier(0.22, 1, 0.36, 1),
transform 1100ms cubic-bezier(0.22, 1, 0.36, 1);
opacity 700ms cubic-bezier(0.22, 1, 0.36, 1),
transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-scale.visible {
opacity: 1;
transform: scale(1);
}
/* ─── HERO ENTRANCE ──────────────────────────── */
@@ -39,8 +52,8 @@
@keyframes mnq-rise {
from {
opacity: 0;
transform: translateY(40px);
filter: blur(6px);
transform: translateY(36px);
filter: blur(4px);
}
to {
opacity: 1;
@@ -50,12 +63,12 @@
}
.hero-enter {
animation: mnq-rise 1200ms cubic-bezier(0.22, 1, 0.36, 1) both;
animation: mnq-rise 1000ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.hero-enter-1 { animation-delay: 300ms; }
.hero-enter-2 { animation-delay: 700ms; }
.hero-enter-3 { animation-delay: 1100ms; }
.hero-enter-4 { animation-delay: 1500ms; }
.hero-enter-1 { animation-delay: 200ms; }
.hero-enter-2 { animation-delay: 500ms; }
.hero-enter-3 { animation-delay: 780ms; }
.hero-enter-4 { animation-delay: 1050ms; }
/* ─── GOLD SHIMMER (botones) ─────────────────── */