Add new integrations dialog appears beneath keyboard when filtered (on mobile/iOS)

SeanPM5 commented 4 years ago

Checklist

[x] I have updated to the latest available Home Assistant version.
[x] I have cleared the cache of my browser.
[x] I have tried a different browser to see if it is related to my browser.

The problem

Because the integrations dialog is a bottom sheet, when you search for a specific integration (such as Spotify in this example) the entire dialog shrinks to the bottom. This appears underneath the keyboard on mobile devices - at least with iOS. So you cannot see what you're typing, and you cannot see the results. Annotated screenshots below, the middle one is the main problem.

Expected behavior

Make the dialog show in the center of the screen or use the whole screen (like more info) rather than being attached to the bottom. Keyboards take up like half the screen on mobile devices.

Steps to reproduce

Use an iPhone
Go to Configuration > Integrations
Press FAB / + button and type Spotify

Environment

Home Assistant release with the issue: 0.105.1b
Last working Home Assistant release (if known): ??
UI Type (States or Lovelace): Lovelace
Browser and browser version: Home Assistant iOS App
Operating system: iOS 13.3

Problem-relevant configuration

Javascript errors shown in your browser console/inspector

Additional information

stale[bot] commented 4 years ago

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue now has been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.

SeanPM5 commented 4 years ago

Still an issue in 0.109.

Here I search for "wemo" and there is a result, but it's completely invisible cause it renders underneath the keyboard. If you look at the 123 button on the keyboard you can see the faint green wemo brand icon behind there.

This is how it should look imo, always visible in the center of the screen above the keyboard.

SeanPM5 commented 4 years ago

No longer an issue in 0.112, dialog now always keeps the same size 🎉

home-assistant / frontend