[PATCH widget-toolkit] confirm remove dialog: improve layout for larger fields/components

[PATCH widget-toolkit] confirm remove dialog: improve layout for larger fields/components

[Dominik Csapak]

If there are larger fields e.g. in the additionalItems property, the
current layout configuration leads to cut-off text and fields.

To fix this, apply 'flex: 1' to the overall body and actual content
component (so they adapt their size) and use 'align: stretch' for the
content vbox (so the elements adapt to the size of the other content
elements).

with that, these larger elements (e.g. a hint box) will either shrink,
or wrap it's text.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 src/window/ConfirmRemoveDialog.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/window/ConfirmRemoveDialog.js b/src/window/ConfirmRemoveDialog.js
index 94f1e84..5f76e47 100644
--- a/src/window/ConfirmRemoveDialog.js
+++ b/src/window/ConfirmRemoveDialog.js
@@ -133,6 +133,7 @@ Ext.define('Proxmox.window.ConfirmRemoveDialog', {
         }
 
         let body = {
+            flex: 1,
             xtype: 'container',
             layout: 'hbox',
             items: [
@@ -149,8 +150,12 @@ Ext.define('Proxmox.window.ConfirmRemoveDialog', {
         }
 
         let content = {
+            flex: 1,
             xtype: 'container',
-            layout: 'vbox',
+            layout: {
+                type: 'vbox',
+                align: 'stretch',
+            },
             items: [
                 {
                     xtype: 'component',
-- 
2.47.3

applied: [PATCH widget-toolkit] confirm remove dialog: improve layout for larger fields/components

[Thomas Lamprecht]

On Wed, 29 Apr 2026 12:12:03 +0200, Dominik Csapak wrote:
> If there are larger fields e.g. in the additionalItems property, the
> current layout configuration leads to cut-off text and fields.
> 
> To fix this, apply 'flex: 1' to the overall body and actual content
> component (so they adapt their size) and use 'align: stretch' for the
> content vbox (so the elements adapt to the size of the other content
> elements).
> 
> [...]

Applied, thanks!

[1/1] confirm remove dialog: improve layout for larger fields/components
      commit: ec688ccdcee5c21518c8134bf7415f63a64c6e92

Re: [PATCH widget-toolkit] confirm remove dialog: improve layout for larger fields/components

[Samuel Rufinatscha]

On 4/29/26 12:11 PM, Dominik Csapak wrote:
> If there are larger fields e.g. in the additionalItems property, the
> current layout configuration leads to cut-off text and fields.
> 
> To fix this, apply 'flex: 1' to the overall body and actual content
> component (so they adapt their size) and use 'align: stretch' for the
> content vbox (so the elements adapt to the size of the other content
> elements).
> 
> with that, these larger elements (e.g. a hint box) will either shrink,
> or wrap it's text.
> 
> Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
> ---
>   src/window/ConfirmRemoveDialog.js | 7 ++++++-
>   1 file changed, 6 insertions(+), 1 deletion(-)
> 
> diff --git a/src/window/ConfirmRemoveDialog.js b/src/window/ConfirmRemoveDialog.js
> index 94f1e84..5f76e47 100644
> --- a/src/window/ConfirmRemoveDialog.js
> +++ b/src/window/ConfirmRemoveDialog.js
> @@ -133,6 +133,7 @@ Ext.define('Proxmox.window.ConfirmRemoveDialog', {
>           }
>   
>           let body = {
> +            flex: 1,
>               xtype: 'container',
>               layout: 'hbox',
>               items: [
> @@ -149,8 +150,12 @@ Ext.define('Proxmox.window.ConfirmRemoveDialog', {
>           }
>   
>           let content = {
> +            flex: 1,
>               xtype: 'container',
> -            layout: 'vbox',
> +            layout: {
> +                type: 'vbox',
> +                align: 'stretch',
> +            },
>               items: [
>                   {
>                       xtype: 'component',

Thanks for the patch, I tested it and it fixes the mentioned issue!

Reviewed-by: Samuel Rufinatscha <s.rufinatscha@proxmox.com>
Tested-by: Samuel Rufinatscha <s.rufinatscha@proxmox.com>