[pmg-devel] [PATCH pmg-gui] main view: remove wrong border on flex element in top bar

[Dominik Csapak]

In the top bar, we separate the left from the right items by having an
item with 'flex: 1' in between. Due to the default xtype/markup, this
element get's a border that looks like a line (because there's no
content). In light mode it's not visible because the border has the same
color as the panel, but in dark-mode, it's visible.

To remove this border, we added a css rule to make the border/background
transparent for this item by selecting the adjacent element of the
versioninfo one.

Since we added a BETA label here too, this does not match anymore and
the line is visible.

Instead of trying to fix it in CSS once more, override the xtype of the
element to be a plain 'box' without a complicated markup (since it's
only a spacer element anyway). This removes any border/background color
too and should be more robust than adapting the css rule.

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 js/MainView.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/js/MainView.js b/js/MainView.js
index 2f8dc57..d5ff643 100644
--- a/js/MainView.js
+++ b/js/MainView.js
@@ -187,6 +187,7 @@ Ext.define('PMG.MainView', {
                     html: '<a href="https://bugzilla.proxmox.com" target="_blank">BETA</a>',
                 },
                 {
+                    xtype: 'box', // keep markup simple, has no borders/background
                     flex: 1,
                 },
                 {
-- 
2.47.3