From c4bdab007fa34dd685fa7700086e4f500a954d38 Mon Sep 17 00:00:00 2001
From: nsensfel <SpamShield0@noot-noot.org>
Date: Wed, 20 Jun 2018 17:47:02 +0200
Subject: They're not smooth, but there are some animations.

---
 src/battlemap/www/style.css | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

(limited to 'src/battlemap/www')

diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css
index fc93e8d..b50d65d 100644
--- a/src/battlemap/www/style.css
+++ b/src/battlemap/www/style.css
@@ -691,6 +691,47 @@
    filter: contrast(35%);
 }
 
+.battlemap-animated-character-icon
+{
+   transition: top linear 0.3s, left linear 0.3s;
+}
+
+.battlemap-animation-move-1
+.battlemap-animation-move-R,
+.battlemap-animation-move-L,
+.battlemap-animation-move-U,
+.battlemap-animation-move-D
+{
+   animation-duration: 0.3s;
+   animation-iteration-count: 1;
+   animation-fill-mode: forwards;
+}
+
+.battlemap-animation-move-R { animation-name: move-right; }
+.battlemap-animation-move-L { animation-name: move-left; }
+.battlemap-animation-move-U { animation-name: move-up; }
+.battlemap-animation-move-D { animation-name: move-down; }
+
+@keyframes move-right {
+    from { transform: translate(0, 0);}
+    to   { transform: translate(100%, 0);}
+}
+
+@keyframes move-left {
+    from { transform: translate(0, 0);}
+    to   { transform: translate(-100%, 0);}
+}
+
+@keyframes move-up {
+    from { transform: translate(0, 0);}
+    to   { transform: translate(0, -100%);}
+}
+
+@keyframes move-down {
+    from { transform: translate(0, 0);}
+    to   { transform: translate(0, 100%);}
+}
+
 @keyframes red-alarm-bg {
     0% {background-color: rgba(255,0,0,0.25);}
     25% {background-color: rgba(255,0,0,1);}
-- 
cgit v1.2.3-70-g09d2