From dc41e86aedf2496877e8f5c01d561ab5e8b62d03 Mon Sep 17 00:00:00 2001 From: tdro Date: Sun, 11 Dec 2022 00:06:59 -0500 Subject: assets/css/default: Better grow, shrink, and tremble animation --- assets/css/default.css | 50 +++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 43 insertions(+), 7 deletions(-) diff --git a/assets/css/default.css b/assets/css/default.css index b4d227a..a7074d7 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -2108,7 +2108,8 @@ text-animation[twitch] { } text-animation[tremble] { - animation: quiver 0.35s infinite, quiver 0.75s infinite, quiver 1.35s infinite; + animation: leftward 0.1s infinite, quiver 0.75s infinite, + quiver 1.35s infinite; } text-animation[shake] span { @@ -2127,12 +2128,17 @@ text-animation[vibrate] span { animation: up 0.125s infinite, left 0.15s infinite; } -text-animation[grow] span { - animation: maximize 1s infinite; +text-animation[grow] { + animation: maximize 1.4s infinite; } -text-animation[shrink] span { - animation: minimize 1s infinite; +text-animation[shrink] { + animation: minimize 1.25s infinite; +} + +text-animation[grow], +text-animation[shrink] { + transform-origin: right 1rem; } text-animation[distort] span { @@ -2198,15 +2204,45 @@ text-animation[distort] span { } @keyframes maximize { + 0% { + transform: scale(1, 1.25); + } + 10% { + transform: scale(1, 1.05); + } + 20% { + transform: scale(1, 1.25); + } + 30% { + transform: scale(1, 1.1); + } + 40% { + transform: scale(1, 1.25); + } 50% { - transform: scale(1.15); + transform: none; } } @keyframes minimize { - 50% { + 0% { + transform: scale(0.75); + } + 10% { + transform: scale(0.95); + } + 20% { + transform: scale(0.75); + } + 30% { transform: scale(0.85); } + 40% { + transform: scale(0.75); + } + 50% { + transform: none; + } } @keyframes skip { -- cgit v1.2.3