all lists on 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 an external index of several public inboxes,
see mirroring instructions on how to clone and mirror
all data and code used by this external index.
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal