PolymerElements / app-layout

App layout elements
https://webcomponents.org/element/PolymerElements/app-layout
597 stars 311 forks source link

Allow the header to move to the bottom #546

Closed mvysny closed 6 years ago

mvysny commented 6 years ago

When using an app from the phone with one hand, it is impossible to reach menu icons located in the top-left corner with a thumb only. It therefore makes no sense to have the header/toolbar located at the top where the user can't reach it.

See https://www.smashingmagazine.com/2016/09/the-thumb-zone-designing-for-mobile-users/ : the topmost header is always located in the "hard" zone. Hardly usable.

Please add support for configuring the header in a way that it is displayed in the bottom of the page. In this mode it is not necessary to scroll nor condense - the content above the header fills the page and is responsible for scrolling of its contents.

keanulee commented 6 years ago

Sounds like you just want a position: fixed <div> at the bottom of the page; don't see why you need <app-header> for that.