Gloss Detail View is overriding the Signbank Banner [CODE]

[susanodd]

When on a small device, compare the Signbank Banner in other views to the Signbank Banner in Gloss Detail.
The SEARCH TEXT fields are in a second row instead of on the right.

[susanodd]

The above layout problem in Gloss Detail is causing problems with other formatting in Gloss Detail.

The Senses Edit ends up getting behind the menu bar.

[susanodd]

I have no idea, but I suspect this has to do with the nesting structure as opposed to the z-index of layering.
The banner at the top should be above the "contents".
But the modals are part of the "contents" and should be in front of the banner.
So the code is basically contradicting itself.
The nesting would imply an order but the z-index would also imply an order, but then we have inheritance of properties and formatting, too, which follows the nesting.
But we also have a dynamic stack of elements.

(There are too many things going on at the same time in Gloss Detail.)

[susanodd]

THERE IS another problem with the Modals in Gloss Detail / Edit.

In the code they are nested inside of table cell elements.
But this causes the "background" (the part of the screen that is behind the modal) to have a size that is only as big as the containing div, not the entire screen. So the modal window ends up nested inside another "big area" that is a weird size.

The modals have ids on them, so the buttons that open them can refer to them.
But the modal contents code needs to be outside of the "table cells".

There are numerous modals on the Gloss Detail page. All of these are conflicting with each other qua css layout.
I'm working to fix this in dark mode, because all of the "nesting" becomes obvious there. It's also obvious that lots of fields are way too small to hold the text. The entire page probably needs to become a horizontal scroll. The user can then shove the "left video panel" to the left off of the screen to be able to see the stuff on the right.

[Woseseltops]

I'm confused about what you are referring to here. Could you show two screenshots:

• One where something is missing
• One where everything is okay, and highlight the missing UI?

[susanodd]

I'm confused about what you are referring to here. Could you show two screenshots:

* One where something is missing

* One where everything is okay, and highlight the missing UI?

Those are the screenshots.
Look at the first two. (Of two different pages)
In the first one, the two "search fields in the header" are to the right of the pull-down menus.
In the second one, of Gloss Detail, those same two fields have moved to a second line.
Something is causing them to be displayed on a second line instead of on the right of the pull-downs.

This in turn (that they are displayed on a second line) causes formatting problems with the rest of the page.

I think it's the code that displays the "affix" stuff. But I have not been able to locate the problem.
(The two screenshots of the modal are an attempt to show that other stuff is affected.)