Add branding image to left pane and polish styling

[sssoleileraaa]

Resolves #518

Description

I could not find an issue for polishing the left pane and applying the "branding" image background. But here you'll find:

• User icon character spacing correct width of 0.58
• User profile widget formatted with the updated margins and padding
• User dropdown menu button closer to the edge with updated margins and padding
• branding background image that spans across the left pane and resizes correctly (little trick to stretch blue widget from the top for larger screen sizes)

[sssoleileraaa]

Here's what it looks like now:

[sssoleileraaa]

Resolves #518

[sssoleileraaa]

For review, compare with zeplin brading bar which includes the user profile widget (user icon with the two letters, aka user badge, user name, and dropdown menu)

[ninavizz]

SVG art for this has been updated in the Content Inventory. :)

[sssoleileraaa]

Note: The svg aspect ratio does not match the left pane dimensions when the client is maximum size, so I added a blue widget at the top of the left pane that can respond to window resizing by stretching.

[zenmonkeykstop]

Confirmed:

• User icon character spacing correct width of 0.58 (code check)
• User profile widget formatted with the updated margins and padding
• User dropdown menu button closer to the edge with updated margins and padding
• branding background image that spans across the left pane and resizes correctly (little trick to stretch blue widget from the top for larger screen sizes) *confirmed branding pane resizes correctly and the branding graphic pins to the bottom when windows resized on larger screen.

One thing (and this might just be my QT noob status showing): would it be worthwhile defining constants for layout values (like the user icon character spacing) and referring to those rather than hard-coding the values? This is not a blocker for merge but it would make review (and rebranding) easier.