zoom and shake

This commit is contained in:
2026-07-02 13:45:13 +02:00
parent 44be07c461
commit 262199e31a
2 changed files with 31 additions and 0 deletions

View File

@@ -287,6 +287,26 @@ body {
border: 3px solid var(--gold);
box-shadow: 0 0 30px rgba(255, 158, 0, 0.5),
inset 0 0 40px rgba(0, 0, 0, 0.6);
transform-origin: center center;
transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.45s ease;
}
/* zoom in avanti durante lo spin */
.slot.zoom {
transform: scale(1.14);
box-shadow: 0 0 70px rgba(255, 158, 0, 0.85), 0 0 120px rgba(255, 46, 136, 0.35),
inset 0 0 40px rgba(0, 0, 0, 0.6);
z-index: 20;
}
/* tremolio mantenendo lo zoom (le keyframe tengono scale(1.14)) */
.slot.zoom.shake {
animation: slotShake 0.22s linear infinite;
}
@keyframes slotShake {
0%, 100% { transform: scale(1.14) translate(0, 0) rotate(0deg); }
20% { transform: scale(1.14) translate(-7px, 4px) rotate(-0.5deg); }
40% { transform: scale(1.14) translate(7px, -5px) rotate(0.5deg); }
60% { transform: scale(1.14) translate(-5px, 6px) rotate(-0.4deg); }
80% { transform: scale(1.14) translate(6px, -4px) rotate(0.4deg); }
}
.slot-side {
width: 46px;