From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id A2FE06BD05 for ; Fri, 19 Feb 2021 17:45:49 +0100 (CET) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 942651B6EC for ; Fri, 19 Feb 2021 17:45:19 +0100 (CET) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [212.186.127.180]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS id 589B71B6DF for ; Fri, 19 Feb 2021 17:45:03 +0100 (CET) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 0A7FE461B7 for ; Fri, 19 Feb 2021 17:45:03 +0100 (CET) Message-ID: Date: Fri, 19 Feb 2021 17:45:01 +0100 MIME-Version: 1.0 User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:86.0) Gecko/20100101 Thunderbird/86.0 Content-Language: en-US To: Proxmox VE development discussion , Aaron Lauterer References: <20201001121840.23081-1-a.lauterer@proxmox.com> <8a9a3acc-2552-5fe5-8f6b-11a9e4b28abc@proxmox.com> From: Thomas Lamprecht In-Reply-To: Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 7bit X-SPAM-LEVEL: Spam detection results: 0 AWL -0.557 Adjusted score from AWL reputation of From: address CTE_8BIT_MISMATCH 0.999 Header says 7bits but body disagrees KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment NICE_REPLY_A -0.001 Looks like a legit reply (A) RCVD_IN_DNSWL_MED -2.3 Sender listed at https://www.dnswl.org/, medium trust SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record URIBL_BLOCKED 0.001 ADMINISTRATOR NOTICE: The query to URIBL was blocked. See http://wiki.apache.org/spamassassin/DnsBlocklists#dnsbl-block for more information. [proxmox.com] Subject: Re: [pve-devel] [PATCH manager] ui: FirewallRules.js: fix #3049 wider rule number column X-BeenThere: pve-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox VE development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Fri, 19 Feb 2021 16:45:49 -0000 On 02.10.20 14:52, Aaron Lauterer wrote: > > On 10/1/20 5:10 PM, Thomas Lamprecht wrote: >> oh, and maybe you can try to switch that whole column definition away from fixed >> widths to relative "flex" only. Just needs to look OK on 720p and quite good on >> 1080p. It's not always possible, but most of the time it works out well and not >> using fixed widths is always nicer, IMO. >> > > I gave it a quick try and I think adding flex properties does help on large screens but for smaller screens I would keep the former width values as minWidth to keep the table readable and to force extjs to switch it to horizontal scrolling as it is currently doing with the fixed widths. Even 720p is already where the horizontal scroll bar shows up. > > This is the git diff I used: Could you send this as patch? > > diff --git a/www/manager6/grid/FirewallRules.js b/www/manager6/grid/FirewallRules.js > index 42035129..fee9c177 100644 > --- a/www/manager6/grid/FirewallRules.js > +++ b/www/manager6/grid/FirewallRules.js > @@ -629,7 +629,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, > @@ -660,7 +661,8 @@ Ext.define('PVE.FirewallRules', { >              me.updateRule(data); >              } >          }, > -        width: 50 > +        minWidth: 50, > +        flex: 2, >          }, >          { >          header: gettext('Type'), > @@ -668,7 +670,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'), > @@ -676,7 +679,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'), > @@ -684,7 +688,8 @@ Ext.define('PVE.FirewallRules', { >          renderer: function(value, metaData, record) { >              return render_errors('macro', value, metaData, record); >          }, > -        width: 80 > +        minWidth: 80, > +        flex: 3, >          } >      ]; >   > @@ -695,7 +700,8 @@ Ext.define('PVE.FirewallRules', { >          renderer: function(value, metaData, record) { >              return render_errors('iface', value, metaData, record); >          }, > -        width: 80 > +        minWidth: 80, > +        flex: 3, >          }); >      } >   > @@ -706,7 +712,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'), > @@ -714,7 +721,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'), > @@ -722,7 +730,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'), > @@ -730,7 +739,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'), > @@ -738,7 +748,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'), > @@ -746,12 +757,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); >          } > > > _______________________________________________ > pve-devel mailing list > pve-devel@lists.proxmox.com > https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel > >