[pmg-devel] [PATCH pmg-gui 4/5] quarantine: improve borders for docked items

[Dominik Csapak <d.csapak@proxmox.com>]

one cannot set the different borders seperately in panels/grids and
docked items don't have a bottom border in extjs, but we want to remove
all borders except the ones between the toolbar and the grids/content
below that.

to achieve that, set a custom 'border-bottom-width' with '!important'
(extjs has a rule with !important as well) for the toolbar, and
everywhere else remove the border.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 js/SpamQuarantine.js  | 8 +++++++-
 js/VirusQuarantine.js | 6 ++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/js/SpamQuarantine.js b/js/SpamQuarantine.js
index d3afcc5..2cdca0d 100644
--- a/js/SpamQuarantine.js
+++ b/js/SpamQuarantine.js
@@ -204,6 +204,11 @@ Ext.define('PMG.SpamQuarantine', {
 		{
 		    xtype: 'toolbar',
 		    dock: 'top',
+		    style: {
+			// docked items have set the bottom with to 0px with '! important'
+			// but we still want one here, so we can remove the borders of the grids
+			'border-bottom-width': '1px ! important',
+		    },
 		    items: [
 			{
 			    xtype: 'button',
@@ -270,8 +275,8 @@ Ext.define('PMG.SpamQuarantine', {
 		},
 		{
 		    xtype: 'pmgSpamInfoGrid',
-		    border: false,
 		    reference: 'spaminfo',
+		    border: false,
 		},
 		{
 		    xtype: 'pmgAttachmentGrid',
@@ -286,6 +291,7 @@ Ext.define('PMG.SpamQuarantine', {
 		    xtype: 'pmgMailInfo',
 		    hidden: true,
 		    reference: 'mailinfo',
+		    border: false,
 		},
 	    ],
 	},
diff --git a/js/VirusQuarantine.js b/js/VirusQuarantine.js
index 8580e7a..a92ba28 100644
--- a/js/VirusQuarantine.js
+++ b/js/VirusQuarantine.js
@@ -106,6 +106,11 @@ Ext.define('PMG.VirusQuarantine', {
 		{
 		    xtype: 'toolbar',
 		    dock: 'top',
+		    style: {
+			// docked items have set the bottom with to 0px with '! important'
+			// but we still want one here, so we can remove the borders of the grids
+			'border-bottom-width': '1px ! important',
+		    },
 		    items: [
 			{
 			    xtype: 'button',
@@ -163,6 +168,7 @@ Ext.define('PMG.VirusQuarantine', {
 		    xtype: 'pmgMailInfo',
 		    hidden: true,
 		    reference: 'mailinfo',
+		    border: false,
 		},
 	    ],
 	},
-- 
2.30.2