From 43dce3d18fa2c35509a8c707caa5125115f1c886 Mon Sep 17 00:00:00 2001 From: nsensfel Date: Fri, 15 Jun 2018 15:53:56 +0200 Subject: Flicker->blinking, basic tile costs. --- src/battlemap/www/style.css | 24 +++++++++++++++++++----- 1 file changed, 19 insertions(+), 5 deletions(-) (limited to 'src/battlemap/www/style.css') diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css index 3795425..cc05378 100644 --- a/src/battlemap/www/style.css +++ b/src/battlemap/www/style.css @@ -498,9 +498,10 @@ .battlemap-character-icon-enabled { - animation-name: flickering-opacity; - animation-duration: 2s; + animation-name: pulsating; + animation-duration: 1.5s; animation-iteration-count: infinite; + transform-origin: center; } .battlemap-character-icon-head { z-index: 1; } @@ -676,6 +677,20 @@ 100% { opacity: 1.0; } } +@keyframes pulsating { + 0% { opacity: 1.0; transform: scale(1);} + 25% { opacity: 1.0; transform: scale(1);} + 30% { opacity: 0.8; transform: scale(1.1);} + 50% { opacity: 1.0; transform: scale(1);} + 100% { opacity: 1.0; transform: scale(1);} +} + +@keyframes strongly-pulsating { + 0% { opacity: 1.0; transform: scale(1);} + 50% { opacity: 0.8; transform: scale(1.5);} + 100% { opacity: 1.0; transform: scale(1);} +} + @keyframes brown-alarm-bg { 0% {background-color: #917C6F;} 25% {background-color: #AC9D93} @@ -706,9 +721,8 @@ .battlemap-character-selected { - background-color: rgba(0,0,255,0.7); - animation-name: blue-alarm-bg; - animation-duration: 5s; + animation-name: strongly-pulsating; + animation-duration: 1.5s; animation-iteration-count: infinite; } -- cgit v1.2.3-70-g09d2