instead of having it in a separate line. This could be confusing on first glance, e.g. if it belongs to the line above or below.
To make it more clear, put it in line with the field itself. Because this uses a FieldContainer now, we can use that to hide and show both at the same time, reducing the amount of code a bit. Signed-off-by: Dominik Csapak <d.csa...@proxmox.com> --- this is a follow up to: https://lore.proxmox.com/all/20250410083333.1781596-1-d.csa...@proxmox.com/ could be squashed in if wanted www/manager6/window/Backup.js | 41 ++++++++++++++++++++--------------- 1 file changed, 24 insertions(+), 17 deletions(-) diff --git a/www/manager6/window/Backup.js b/www/manager6/window/Backup.js index 68e9565b..70b51409 100644 --- a/www/manager6/window/Backup.js +++ b/www/manager6/window/Backup.js @@ -53,18 +53,10 @@ Ext.define('PVE.window.Backup', { }, }); - let pbsChangeDetectionHelp = Ext.create('Ext.Component', { - hidden: true, - html: `<i class="fa fa-question-circle" data-qtip=" - ${gettext("Mode to detect file changes and switch archive encoding format for container backups to Proxmox Backup Server. Not available for VM backups.")} - "></i>`, - }); - let pbsChangeDetectionModeSelector = Ext.create({ xtype: 'proxmoxKVComboBox', - hidden: true, + flex: 1, disabled: true, - fieldLabel: gettext('PBS change detection mode'), name: 'pbs-change-detection-mode', deleteEmpty: true, value: '__default__', @@ -75,6 +67,25 @@ Ext.define('PVE.window.Backup', { ], }); + let pbsChangeDetection = Ext.create('Ext.form.FieldContainer', { + fieldLabel: gettext('PBS change detection mode'), + hidden: true, + layout: { + type: 'hbox', + align: 'center', + }, + items: [ + pbsChangeDetectionModeSelector, + { + xtype: 'box', + html: `<i class="fa fa-question-circle" data-qtip=" + ${gettext("Mode to detect file changes and switch archive encoding format for container backups to Proxmox Backup Server. Not available for VM backups.")} + "></i>`, + padding: 5, + }, + ], + }); + const keepNames = [ ['keep-last', gettext('Keep Last')], ['keep-hourly', gettext('Keep Hourly')], @@ -135,20 +146,17 @@ Ext.define('PVE.window.Backup', { if (me.vmtype === 'lxc') { pbsChangeDetectionModeSelector.setValue('__default__'); pbsChangeDetectionModeSelector.setDisabled(false); - pbsChangeDetectionModeSelector.setHidden(false); - pbsChangeDetectionHelp.setHidden(false); + pbsChangeDetection.setHidden(false); } else { pbsChangeDetectionModeSelector.setDisabled(true); - pbsChangeDetectionModeSelector.setHidden(true); - pbsChangeDetectionHelp.setHidden(true); + pbsChangeDetection.setHidden(true); } } else { if (!compressionSelector.getEditable()) { compressionSelector.setDisabled(false); } pbsChangeDetectionModeSelector.setDisabled(true); - pbsChangeDetectionModeSelector.setHidden(true); - pbsChangeDetectionHelp.setHidden(true); + pbsChangeDetection.setHidden(true); } @@ -231,8 +239,7 @@ Ext.define('PVE.window.Backup', { storagesel, modeSelector, protectedCheckbox, - pbsChangeDetectionHelp, - pbsChangeDetectionModeSelector, + pbsChangeDetection, ], column2: [ compressionSelector, -- 2.39.5 _______________________________________________ pve-devel mailing list pve-devel@lists.proxmox.com https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel