[gnome-usage] speedometer: Transition instead of animation

[Felipe Borges <felipeborges src gnome org>]

commit 16cf6259d48bb9bc778105ad11eeb466862a8b03
Author: makepost <makepost firemail cc>
Date:   Sat Nov 25 19:52:33 2017 +0200

    speedometer: Transition instead of animation

 data/interface/adwaita.css |  4 +---
 src/speedometer.vala       | 13 ++++---------
 2 files changed, 5 insertions(+), 12 deletions(-)
---
diff --git a/data/interface/adwaita.css b/data/interface/adwaita.css
index bc22821..fc05326 100644
--- a/data/interface/adwaita.css
+++ b/data/interface/adwaita.css
@@ -145,11 +145,9 @@ box.storage {
 
 .speedometer-inner {
     margin: -1px;
-    animation-fill-mode: forwards;
-    animation-duration: 200ms;
-    animation-timing-function: ease-in-out;
     background: linear-gradient(90deg, transparent 50%, @theme_base_color 50%),
                 linear-gradient(90deg, @theme_base_color 50%, transparent 50%);
+    transition: background 1s ease-in-out;
 }
 
 .speedometer-content-area {
diff --git a/src/speedometer.vala b/src/speedometer.vala
index 2ffb864..9c239a9 100644
--- a/src/speedometer.vala
+++ b/src/speedometer.vala
@@ -73,15 +73,10 @@ namespace Usage
             }
 
             var css =
-            @"@keyframes speedometer_keyframes-$(old_value)-$(new_value) {
-                from {
-                    background: linear-gradient($(old_angle)deg, transparent 50%, $filling_color 50%),
-                                linear-gradient(90deg, @theme_base_color 50%, transparent 50%);
-                } to {
-                    background: linear-gradient($(new_angle)deg, transparent 50%, $filling_color 50%),
-                                linear-gradient(90deg, @theme_base_color 50%, transparent 50%);
-                  }
-            } .speedometer-inner { animation-name: speedometer_keyframes-$(old_value)-$(new_value); }";
+            @".speedometer-inner {
+                background: linear-gradient($(new_angle)deg, transparent 50%, $filling_color 50%),
+                            linear-gradient(90deg, @theme_base_color 50%, transparent 50%);
+            }";
 
             try
             {