diff --git a/platypush/backend/http/webapp/src/style/themes/light.scss b/platypush/backend/http/webapp/src/style/themes/light.scss
index 1a88de9b6c..2b24c47132 100644
--- a/platypush/backend/http/webapp/src/style/themes/light.scss
+++ b/platypush/backend/http/webapp/src/style/themes/light.scss
@@ -205,3 +205,6 @@ $tile-hover-bg-2: linear-gradient(90deg, rgb(71, 226, 179) 0%, rgb(81, 186, 210)
 $tile-hover-bg-3: linear-gradient(90deg, rgb(41, 216, 63) 0%, rgb(9, 188, 138) 120%);
 $tile-keyword-fg: #f8ff00;
 $tile-code-fg: #2a5ab7;
+
+//// Misc
+$info-header-bg: #f2f7f5;
diff --git a/platypush/backend/http/webapp/src/utils/DateTime.vue b/platypush/backend/http/webapp/src/utils/DateTime.vue
index 2284e49545..05b7393076 100644
--- a/platypush/backend/http/webapp/src/utils/DateTime.vue
+++ b/platypush/backend/http/webapp/src/utils/DateTime.vue
@@ -35,6 +35,22 @@ export default {
 
       return `${this.formatDate(date, year)}, ${this.formatTime(date, seconds)}`
     },
+
+    formatDuration(duration, seconds=true) {
+      if (duration == null)
+        return ''
+
+      let hours = Math.floor(duration / 3600)
+      let minutes = Math.floor((duration % 3600) / 60)
+      let secs = duration % 60
+
+      if (hours > 0)
+        return `${hours}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`
+      else if (minutes > 0)
+        return `${minutes}:${secs.toString().padStart(2, '0')}`
+      else
+        return seconds ? `0:${secs.toString().padStart(2, '0')}` : `0:00`
+    },
   },
 }
 </script>