[ui][fix] Application Menubar: Ensure Menubar occupies all of available height of the layout

[waaake]

Description

This PR modifies the Menubar component to ensure it fills the layout in terms of height.
The change addresses an inconsistency where the MenuBar did not align with the Parent's dimensions.

Details of the change

• Parenting the Menubar inside the Rectangle matching the colour of the background header ensures the additional area is filled correctly.
• Aligning the Menubar at the bottom, leaving a pixel to match the placement of the HomeButton.
• HomeButton and ExecutionButtons have reduced padding to reduce the overall area of the button while retaining the icon size.

The above changes ensure the overall alignment of the Header bar elements, Custom buttons and MenuBar.

Appearence after the changes

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 69.96%. Comparing base (e51bb93) to head (5f77674).

Additional details and impacted files

@@           Coverage Diff            @@
##           develop    #2643   +/-   ##
========================================
  Coverage    69.96%   69.96%           
========================================
  Files          121      121           
  Lines         7084     7084           
========================================
  Hits          4956     4956           
  Misses        2128     2128           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[cbentejac]

The main issue I have with this change is that, although the menu bar now takes up the whole space as it should, the menus themselves are not vertically centered with the homepage icon. The menu bar starts slightly higher than the homepage button but finishes slightly higher as well, and it's very clear when hovering.

It'd be great if the button and the menu bar could be aligned.

[fabiencastan]

Looks better to me without this offset.

Suggested change

anchors.bottomMargin: 1 /// this margin counters the offset vertically when lining up against with the homeButton

[fabiencastan]

if we could avoid anchors that's ideal.

[fabiencastan]

Just using "height: parent.height" on the MenuBar seems to work, without adding a Rectangle into the hierarchy.

[waaake]

This rectangle already existed to cover up additional space horizontally, but I could try using height property to set this, last I can recall, there was a very minor pixel worth of offset against the Custom buttons. Let me try the changes, thanks.