/
romazherebtsov
/
tictactoe
Обзор
Документация
Войти
/
romazherebtsov
/
tictactoe
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
main
css/animations.css
51 строка
1 KB
Roma
[Spec Kit] Implement tic-tac-toe hacker game
07 май 2026, 14:55
07 май 2026, 14:55
37aa231
Код
Авторство
О чём код?
/* Typewriter: symbol appears as if printed character-by-character */ @keyframes typewriter { from { clip-path: inset(0 100% 0 0); opacity: 0.4; } to { clip-path: inset(0 0% 0 0); opacity: 1; } } .animate-typewriter { animation: typewriter 160ms ease-out forwards; } /* Neon pulse: win-line cells glow in green */ @keyframes neon-pulse { 0%, 100% { box-shadow: 0 0 6px rgba(0,255,65,0.4), inset 0 0 6px rgba(0,255,65,0.08); opacity: 1; } 50% { box-shadow: 0 0 22px rgba(0,255,65,0.9), 0 0 40px rgba(0,255,65,0.4), inset 0 0 16px rgba(0,255,65,0.25); opacity: 0.85; } } .animate-neon-pulse { animation: neon-pulse 600ms ease-in-out 2; } /* Glitch: result message distorts before settling */ @keyframes glitch { 0% { transform: translateX(0) skewX(0deg); clip-path: inset(0 0 0 0); } 15% { transform: translateX(-5px) skewX(-3deg); clip-path: inset(10% 0 55% 0); } 30% { transform: translateX(5px) skewX(3deg); clip-path: inset(50% 0 8% 0); } 45% { transform: translateX(-3px) skewX(-1deg); clip-path: inset(25% 0 35% 0); } 60% { transform: translateX(3px) skewX(2deg); clip-path: inset(0 0 75% 0); } 75% { transform: translateX(-1px) skewX(-1deg); clip-path: inset(40% 0 20% 0); } 100% { transform: translateX(0) skewX(0deg); clip-path: inset(0 0 0 0); } } .animate-glitch { animation: glitch 420ms steps(1) forwards; }