Fix button and sidebar layout

[skjnldsv]

Fix some misused css data and reorder the sidebar layout to have a full width new message button without the need of js.

refs #1463
@ChristophWurst

[mention-bot]

By analyzing the blame information on this pull request, we identified @jancborchardt, @ChristophWurst and @DeepDiver1975 to be potential reviewers

[ChristophWurst]

[ChristophWurst]

[ChristophWurst]

Tested with FF an Chrome, works perfectly!

[skjnldsv]

Ahahahahahahhahaha! You're the best Christoph! 💯

[jancborchardt]

Yooo, have yet to test cause I'm on mobile but that looks pretty damn cool! :) Great work

[ChristophWurst]

@jancborchardt I thought you have your dev env on the smartphone? :P

[jancborchardt]

Hmmm, the problem though is that when there’s a scrollbar (like when you expand the collapsed folders), that scrollbar will be obstructed by the New Message button background … ;) Which is exactly why the hackery was in place. @skjnldsv

[skjnldsv]

@jancborchardt I don't have this problem at all on my device :)

[skjnldsv]

The new message is out of the scroll section, so the scrollbar will be contained to the list only, no risk of it being hidden by an other element.

[jancborchardt]

That was the visual point though, to have it in the same area. Now the sidebar feels cramped cause the list is cut off both at top and bottom. :/

[ChristophWurst]

I don't think it looks cramped because mostly there are only a few items in there as the folders are collapsed by default now :-/

[skjnldsv]

The sidebar is also a visual indicator.
Using a full height sidebar for a no-full-height element is not a good idea. When i see the scrollbar I assume that I can scroll from the start to the bottom. And using fixed elements like that in the css and in the global layout is also bad. (see owncloud/core#22347)

You should only have a scrollbar on scrollable elements, not just on a global div which only move a part of the page.