Toolbar height in app header

[s3ppo]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

What is the current behavior?

Toolbar height switches when android keyboard appears in chrome for mobile

What are the steps to reproduce?

place Toolbar on top of app header -> place input field under it -> click input field -> when android keyboard appears, the toolbar switches from portrait to landscape and the height of the toolbar jumps
u can see it on my demosite. https://atippr.moniholz.at click in the loginform an watche the toolbar on top, when the keyboard appears

What is the use-case or motivation for changing an existing behavior?

Which versions of Angular, Material, OS, browsers are affected?

beta-2

Is there anything else we should know?

[joejordanbrown]

Adding overflow hidden to the body fixes this issue with onscreen keyboards pushing up the toolbar.

body {
    overflow: hidden;
}

[s3ppo]

thanks for your answer, i tried this, but no effect :(

[joejordanbrown]

Looking into this more the problem is with how media queries calculate the orientation: portrait and landscape. So when the virtual keyboard is opened, it resizes the viewport and the media queries for the md-toolbar switch from portrait 56px to landscape 48px.

@devversion I notice you created the pull to add the responsive sizing to the toolbar #2157. Are there plans to use alternative media queries instead of using the orientation?

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}