[pbs-devel] [PATCH proxmox-backup] ui: align loading spinner to the left, added label

Gabriel Goller g.goller at proxmox.com
Wed Oct 18 12:08:57 CEST 2023


Moved the spinner in the Task View (and in other components that show
the status) to the left (`text-align: left`) so that the style matches
with the 'OK' and 'Error: ...' text shown in that grid-row. Also added a
label 'Running' (considers translations).
Note: The `x-grid-row-loading` and new `x-grid-row-loading-left` classes have
been moved to the `proxmox-widget-toolkit` repo.

Signed-off-by: Gabriel Goller <g.goller at proxmox.com>
---
 www/Utils.js         | 4 ++--
 www/css/ext6-pbs.css | 6 ------
 2 files changed, 2 insertions(+), 8 deletions(-)

diff --git a/www/Utils.js b/www/Utils.js
index 2eca600e..e92af6c6 100644
--- a/www/Utils.js
+++ b/www/Utils.js
@@ -205,8 +205,8 @@ Ext.define('PBS.Utils', {
 	}
 
 	if (!record.data['last-run-endtime']) {
-	    metadata.tdCls = 'x-grid-row-loading';
-	    return '';
+	    metadata.tdCls = 'x-grid-row-loading-left';
+	    return `<img src="extjs/theme-crisp/resources/images/loadmask/loading.gif" />${gettext('Running')}`;
 	}
 
 	let parsed = Proxmox.Utils.parse_task_status(value);
diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css
index 5fd65d25..a437ffae 100644
--- a/www/css/ext6-pbs.css
+++ b/www/css/ext6-pbs.css
@@ -79,12 +79,6 @@
     color: black;
 }
 
-/* loading in task list */
-.x-grid-row-loading {
-    background: no-repeat center center;
-    background-image:url(../extjs/theme-crisp/resources/images/loadmask/loading.gif);
-}
-
 /* displayfield minheight is wrong */
 .x-form-display-field-default {
     min-height: 20px;
-- 
2.39.2






More information about the pbs-devel mailing list