public inbox for pve-devel@lists.proxmox.com
 help / color / mirror / Atom feed
From: Aaron Lauterer <a.lauterer@proxmox.com>
To: pve-devel@lists.proxmox.com
Subject: [pve-devel] [PATCH manager 1/2] ui: FirewallRules: make columns flexible
Date: Mon, 22 Feb 2021 11:16:25 +0100	[thread overview]
Message-ID: <20210222101626.19240-1-a.lauterer@proxmox.com> (raw)

Changing the width definitions to use flex will make better use on
larger monitors. Changing the `width` parameter to `minWidth` ensures
that on smaller screens it is still usable, though some horizontal
scrolling might be necessary.

Signed-off-by: Aaron Lauterer <a.lauterer@proxmox.com>
---
 www/manager6/grid/FirewallRules.js | 38 ++++++++++++++++++++----------
 1 file changed, 25 insertions(+), 13 deletions(-)

diff --git a/www/manager6/grid/FirewallRules.js b/www/manager6/grid/FirewallRules.js
index c3b8fa53..5a2241a0 100644
--- a/www/manager6/grid/FirewallRules.js
+++ b/www/manager6/grid/FirewallRules.js
@@ -627,7 +627,8 @@ Ext.define('PVE.FirewallRules', {
 		// similar to xtype: 'rownumberer',
 		dataIndex: 'pos',
 		resizable: false,
-		width: 42,
+		minWidth: 42,
+		flex: 1,
 		sortable: false,
 		align: 'right',
 		hideable: false,
@@ -658,7 +659,8 @@ Ext.define('PVE.FirewallRules', {
 			me.updateRule(data);
 		    },
 		},
-		width: 50,
+		minWidth: 50,
+		flex: 2,
 	    },
 	    {
 		header: gettext('Type'),
@@ -666,7 +668,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('type', value, metaData, record);
 		},
-		width: 50,
+		minWidth: 50,
+		flex: 2,
 	    },
 	    {
 		header: gettext('Action'),
@@ -674,7 +677,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('action', value, metaData, record);
 		},
-		width: 80,
+		minWidth: 80,
+		flex: 3,
 	    },
 	    {
 		header: gettext('Macro'),
@@ -682,7 +686,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('macro', value, metaData, record);
 		},
-		width: 80,
+		minWidth: 80,
+		flex: 3,
 	    },
 	];
 
@@ -693,7 +698,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('iface', value, metaData, record);
 		},
-		width: 80,
+		minWidth: 80,
+		flex: 3,
 	    });
 	}
 
@@ -704,7 +710,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('source', value, metaData, record);
 		},
-		width: 100,
+		minWidth: 100,
+		flex: 4,
 	    },
 	    {
 		header: gettext('Destination'),
@@ -712,7 +719,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('dest', value, metaData, record);
 		},
-		width: 100,
+		minWidth: 100,
+		flex: 4,
 	    },
 	    {
 		header: gettext('Protocol'),
@@ -720,7 +728,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('proto', value, metaData, record);
 		},
-		width: 100,
+		minWidth: 100,
+		flex: 3,
 	    },
 	    {
 		header: gettext('Dest. port'),
@@ -728,7 +737,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('dport', value, metaData, record);
 		},
-		width: 100,
+		minWidth: 100,
+		flex: 4,
 	    },
 	    {
 		header: gettext('Source port'),
@@ -736,7 +746,8 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('sport', value, metaData, record);
 		},
-		width: 100,
+		minWidth: 100,
+		flex: 3,
 	    },
 	    {
 		header: gettext('Log level'),
@@ -744,12 +755,13 @@ Ext.define('PVE.FirewallRules', {
 		renderer: function(value, metaData, record) {
 		    return render_errors('log', value, metaData, record);
 		},
-		width: 100,
+		minWidth: 100,
+		flex: 3,
 	    },
 	    {
 		header: gettext('Comment'),
 		dataIndex: 'comment',
-		flex: 1,
+		flex: 6,
 		renderer: function(value, metaData, record) {
 		    return render_errors('comment', Ext.util.Format.htmlEncode(value), metaData, record);
 		},
-- 
2.20.1





             reply	other threads:[~2021-02-22 10:16 UTC|newest]

Thread overview: 4+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2021-02-22 10:16 Aaron Lauterer [this message]
2021-02-22 10:16 ` [pve-devel] [PATCH manager 2/2] ui: FirewallRules: Add tooltip to comments Aaron Lauterer
2021-02-22 13:41   ` [pve-devel] applied: " Thomas Lamprecht
2021-02-22 13:40 ` [pve-devel] applied: [PATCH manager 1/2] ui: FirewallRules: make columns flexible Thomas Lamprecht

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=20210222101626.19240-1-a.lauterer@proxmox.com \
    --to=a.lauterer@proxmox.com \
    --cc=pve-devel@lists.proxmox.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal