Dropdown covered by modal footer

[Thai Tran]

The dropdown menu inside of a modal dialog is now below the modal footer. This makes it extremely frustrating to select a menu item. The user has to scrolls inside of the modal dialog in order to get to an item.

Take a look at the identity users table and try to create a new user. At the bottom, select a Role. Notice that the dropdown is cut off.

[Richard Jones (r1chardj0n3s)]

I believe https://review.openstack.org/#/c/341945/ is necessary to reproduce this bug.

[Thai Tran (tqtran)]

Actually, I am seeing this on master in the django users panel. As stated in the description, its a modal issue and has nothing to do with users panel. I am only using it as an example.

[Richard Jones (r1chardj0n3s)]

Verified.

Yes, the contents have to scroll if they're too long to fit the modal's max height. I don't believe we can do anything differently here, but I'm marking this as a "wishlist" item in case you have an idea :-)

[Akihiro Motoki (amotoki)]

It's frustrating me a lot especially in a small modal form.

We specify overflow-y: auto [1] and as a result if a drop down menu is larger than a modal the menu is hidden and we need to scroll it. Changing this to 'visible', we can see a drop down menu outside of a modal.

[1] https://github.com/openstack/horizon/blob/master/openstack_dashboard/static/dashboard/scss/components/_modals.scss#L2

[Akihiro Motoki (amotoki)]

Screenshot after changing modal 'overflow-y' attribute to 'visible'

[OpenStack Infra (hudson-openstack)]

Fix proposed to branch: master
Review: https://review.openstack.org/460929

[OpenStack Infra (hudson-openstack)]

Change abandoned by Akihiro Motoki (<email address hidden>) on branch: master
Review: https://review.openstack.org/460929
Reason: https://review.openstack.org/#/c/389866/ already try to fix the same problem.

[Akihiro Motoki (amotoki)]

The current modal form is like this.