Add some styling for task-panel and "running task" overlay icon.

core/src/plugins/gui.ajax/res/themes/orbit/css/components/spinner.less

@@ -20,7 +20,7 @@
   to { -o-transform:rotate(360deg); }
 }
 
-.rotating, .icon-spinner {
+.rotating, .icon-spinner, .mdi.mdi-radar{
   -webkit-transform-origin: 50% 50%;
   -webkit-animation-name: rotate;
   -webkit-animation-duration: 1.0s;
@@ -47,6 +47,10 @@
   display: block !important;
   text-align: center;
 }
+.mdi.mdi-radar{
+  display: inline-block;
+  text-align: center;
+}
 
 .icon-spinner.spinner_large{
   font-size: 22px;

core/src/plugins/gui.ajax/res/themes/orbit/css/components/tasks.less

@@ -0,0 +1,43 @@
+@pydio-task-panel-height: 60px;
+@pydio-task-panel-width: 356px;
+@pydio-task-panel-margin: 20px;
+
+div.pydio-tasks-panel{
+  position: absolute;
+  width: @pydio-task-panel-width;
+  height: @pydio-task-panel-height;
+  bottom: @pydio-task-panel-margin;
+  right: @pydio-task-panel-margin;
+  overflow-y: auto;
+  background-color: white;
+  box-shadow: @reactBoxShadowDepth1;
+  z-index: 20001;
+  transition: @bezier_transition;
+  &.invisible{
+    right: -@pydio-task-panel-width - 5px;
+  }
+  div.task{
+    padding: 10px;
+    border-bottom: 1px solid #f2f2f2;
+    display: flex;
+    flex-direction: row;
+    .task_texts{
+      flex: 5;
+      max-width: @pydio-task-panel-width - 42px;
+      div{
+        text-overflow: ellipsis;
+        overflow: hidden;
+        white-space: nowrap;
+      }
+    }
+    .task_actions{
+      cursor: pointer;
+      > span{
+        display: inline-block;
+        margin-top: 15px;
+        margin-right: 10px;
+        color: @teal-500;
+      }
+    }
+  }
+}

core/src/plugins/gui.ajax/res/themes/orbit/css/fonts/mdi-subset.css

@@ -66,4 +66,8 @@
 
 .mdi-close-circle-outline:before {
     content: "\f250";
+}
+
+.mdi-radar:before {
+    content: "\f526";
 }

core/src/plugins/gui.ajax/res/themes/orbit/css/pydio.css

@@ -3409,7 +3409,8 @@ span.first-bread em {
   }
 }
 .rotating,
-.icon-spinner {
+.icon-spinner,
+.mdi.mdi-radar {
   -webkit-transform-origin: 50% 50%;
   -webkit-animation-name: rotate;
   -webkit-animation-duration: 1.0s;
@@ -3435,6 +3436,10 @@ span.first-bread em {
   display: block !important;
   text-align: center;
 }
+.mdi.mdi-radar {
+  display: inline-block;
+  text-align: center;
+}
 .icon-spinner.spinner_large {
   font-size: 22px;
 }
@@ -4538,6 +4543,51 @@ div.menu.rootDirChooser span.rootDirTitle {
 .left-panel.hidden {
   left: -255px;
 }
+div.pydio-tasks-panel {
+  position: absolute;
+  width: 356px;
+  height: 60px;
+  bottom: 20px;
+  right: 20px;
+  overflow-y: auto;
+  background-color: white;
+  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
+  z-index: 20001;
+  transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
+}
+div.pydio-tasks-panel.invisible {
+  right: -361px;
+}
+div.pydio-tasks-panel div.task {
+  padding: 10px;
+  border-bottom: 1px solid #f2f2f2;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: row;
+      -ms-flex-direction: row;
+          flex-direction: row;
+}
+div.pydio-tasks-panel div.task .task_texts {
+  -webkit-flex: 5;
+      -ms-flex: 5;
+          flex: 5;
+  max-width: 314px;
+}
+div.pydio-tasks-panel div.task .task_texts div {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+div.pydio-tasks-panel div.task .task_actions {
+  cursor: pointer;
+}
+div.pydio-tasks-panel div.task .task_actions > span {
+  display: inline-block;
+  margin-top: 15px;
+  margin-right: 10px;
+  color: #009688;
+}
 /**********************/
 /* MASTER VARIABLES
 /**********************/

core/src/plugins/gui.ajax/res/themes/orbit/css/pydio.less

@@ -46,6 +46,7 @@
 @import "components/menus";
 @import "components/infopanel";
 @import "components/leftpanel";
+@import "components/tasks";
 
 @import "theme/variables";