feat: stamp+glitch logo animation, move keyframes outside @theme
logoStamp and pathFlicker defined at global CSS scope (outside @theme) so they are always emitted. Logo uses sharp stamp+bounce entrance with flickering path reveals. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -84,6 +84,27 @@
|
||||
from { transform: scale(0.95); opacity: 0; }
|
||||
to { transform: scale(1); opacity: 1; }
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@keyframes logoStamp {
|
||||
0% { opacity: 0; transform: scale(2) rotate(15deg); }
|
||||
38% { opacity: 1; transform: scale(0.82) rotate(-5deg); }
|
||||
58% { transform: scale(1.14) rotate(3deg); }
|
||||
74% { transform: scale(0.94) rotate(-1deg); }
|
||||
88% { transform: scale(1.04) rotate(0.3deg); }
|
||||
100% { transform: scale(1) rotate(0deg); }
|
||||
}
|
||||
|
||||
@keyframes pathFlicker {
|
||||
0% { opacity: 0; }
|
||||
28%, 30% { opacity: 0; }
|
||||
31%, 33% { opacity: 1; }
|
||||
34%, 40% { opacity: 0; }
|
||||
41%, 44% { opacity: 1; }
|
||||
45%, 49% { opacity: 0; }
|
||||
50% { opacity: 1; }
|
||||
100% { opacity: 1; }
|
||||
}
|
||||
|
||||
:root {
|
||||
|
||||
Reference in New Issue
Block a user