rotateSlow

Author: odeimaiz

services/static-webserver/client/source/class/osparc/jobs/JobsButton.js

@@ -41,8 +41,8 @@ qx.Class.define("osparc.jobs.JobsButton", {
       let control;
       switch (id) {
         case "icon": {
-          control = new qx.ui.basic.Image("@FontAwesome5Solid/cog/24");
-          osparc.utils.Utils.addClass(control.getContentElement(), "rotate");
+          control = new qx.ui.basic.Image("@FontAwesome5Solid/cog/22");
+          osparc.utils.Utils.addClass(control.getContentElement(), "rotateSlow");
 
           const logoContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox().set({
             alignY: "middle"

services/static-webserver/client/source/class/osparc/task/TasksButton.js

@@ -41,8 +41,8 @@ qx.Class.define("osparc.task.TasksButton", {
       let control;
       switch (id) {
         case "icon": {
-          control = new qx.ui.basic.Image("@FontAwesome5Solid/cog/24");
-          osparc.utils.Utils.addClass(control.getContentElement(), "rotate");
+          control = new qx.ui.basic.Image("@FontAwesome5Solid/cog/22");
+          osparc.utils.Utils.addClass(control.getContentElement(), "rotateSlow");
 
           const logoContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox().set({
             alignY: "middle"

services/static-webserver/client/source/resource/common/common.css

@@ -15,7 +15,11 @@
 }
 
 .rotate {
-  animation: rotation 1.5s infinite linear;
+  animation: rotation 2s infinite linear;
+}
+
+.rotateSlow {
+  animation: rotation 4s infinite linear;
 }
 
 .verticalText {