summaryrefslogtreecommitdiff |
diff options
Diffstat (limited to 'src/battlemap/www/style.css')
-rw-r--r-- | src/battlemap/www/style.css | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css index 7d4ba53..2688bdd 100644 --- a/src/battlemap/www/style.css +++ b/src/battlemap/www/style.css @@ -712,6 +712,60 @@ transition: top linear 0.3s, left linear 0.3s; } +.battlemap-animated-portrait-damaged .battlemap-character-portrait > * +{ + animation: blinking 0.2s steps(2, start) 8; +} + +.battlemap-animated-portrait-absent .battlemap-character-portrait > * +{ + visibility: hidden; +} + +.battlemap-animated-portrait-dodges .battlemap-character-portrait, +.battlemap-animated-portrait-dies .battlemap-character-portrait, +.battlemap-animated-portrait-parries .battlemap-character-portrait, +.battlemap-animated-portrait-attacks .battlemap-character-portrait +{ + overflow: hidden; +} + +.battlemap-animated-portrait +{ + width: 100%; + height: 100%; +} + +.battlemap-animated-portrait-dodges .battlemap-character-portrait > * +{ + animation-name: dodges; + animation-duration: 1s; + animation-iteration-count: 1; +} + +.battlemap-animated-portrait-attacks .battlemap-character-portrait > * +{ + animation-name: attacks; + animation-duration: 1s; + animation-iteration-count: 1; +} + +.battlemap-animated-portrait-dies .battlemap-character-portrait > * +{ + animation-name: blinking, dies; + animation-duration: 1s, 2s; + animation-delay: 0s, 1s; + animation-iteration-count: 1, 1; + animation-fill: default, forwards; +} + +.battlemap-animated-portrait-parries .battlemap-character-portrait > * +{ + animation-name: parries; + animation-duration: 1s; + animation-iteration-count: 1; +} + .battlemap-animation-move-1 .battlemap-animation-move-R, .battlemap-animation-move-L, @@ -795,6 +849,34 @@ 100% {background-color: rgba(0,0,255,0.2);} } +@keyframes blinking { + to { visibility: hidden; } +} + +@keyframes dodges { + 0% { transform: translate(0, 0); } + 50% { transform: translate(-75%, 0); } + 100% { transform: translate(0, 0); } +} + +@keyframes attacks { + 0% { transform: translate(0, 0); } + 25% { transform: translate(25%, 0); } + 100% { transform: translate(0, 0); } +} + +@keyframes parries { + 0% { transform: translate(0, 0); } + 25% { transform: translate(-25%, 0); } + 50% { transform: translate(50%, 20%); } + 100% { transform: translate(0, 0); } +} + +@keyframes dies { + from { transform: translate(0, 0); } + to { transform: translate(0, 100%); } +} + @keyframes blue-alarm-bd { 0% {border-color: rgba(0,0,255,0.25);} 25% {border-color: rgba(0,0,255,1);} |