sidenav: should be `display: flex` by default

[sebakerckhof]

Actual Behavior:

• What is the issue? * md-sidenav scss sets some flexbox properties (like here: https://github.com/angular/material/blob/master/src/components/sidenav/sidenav.scss#L8 ), but then only in locked states it actually gets display: flex applied (e.g. here: https://github.com/angular/material/blob/master/src/components/sidenav/sidenav.scss#L58 ). This means that a sidenav which is open, but not locked open can have a different layout then when it is locked open. But one usually wants the contents of the sidenav to be the same whether or not is locked open.

• What is the expected behavior? The layout of the sidenav should always be the same. Whether it's just open or locked open.

• Proposed solution Add display: flex; by default

Angular Versions: *

• Angular Version: 1.5.8
• Angular Material Version: 1.1.1

[Splaktar]

Here's a simple demo of this. It's true that we have the following behaviors:

• Locked open: defined as display: flex
• Open: defaults to display: block
• Closed: defined as display: none

We should use display: flex for the Open state and not just default it to display: block.