Page navigation should not be included in the query results table

[madalincm]

Steps to Reproduce:

1. Open this query: https://pipeline-sql.stage.mozaws.net/queries/273/source
2. Scroll down the page and observe the scroll bar and the page navigation positioning.

Expected results:

The page navigation is displayed outside the table. When the users uses the scroll bar the navigation is keeping it's position.

Actual results:

The page navigation is displayed inside the table. When the user scrolls to left the navigation is no longer displayed.

Notes/Issues:

Build identifier: Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:58.0) Gecko/20100101 Firefox/58.0
Verified in FF58(Win7). Issue can be reproduced in STMO-stage

[madalincm]

The query results are now truncated so I'm not able to test this properly. I have logged #342

[madalincm]

#342 Is no longer reproducing but the navigation is still inside the query results table. If the user scrolls to the right the navigation is no longer displayed.

[alison985]

@jezdez Would you agree this is fixed by centering the pagination navigation? Centering pagination occurred in #320 with PR #413. Just want to confirm that fixing that then fixes this.

[jezdez]

I don't think if centering the pagination (#320, #413) fixes this issue, as this it's about moving the paginator outside the div with the query results to prevent the paginator from vanishing in the first place.

Since this is obviously an issue from upstream, I suggest to open a ticket upstream and submitting a PR there, no need to create extra work to backport it later.

[alison985]

see getredash#2584

[alison985]

merged upstream

[jezdez]

Huzzah!

[madalincm]

Verified in FF61(Win7) in stmo-stage
The issue seems partially fixed. At this moment the page navigation is not affected by the horizontal scroll but when using the vertical scroll the navigation can be hided.
Please view this screecast:

Reopening the issue.

[alison985]

I've spent about an hour playing with this, but there is a CSS issue getting in the way of what I think Madalin is asking for. Namely: "The overflow property only works for block elements with a specified height." So I can add "overflow-y: scroll; display: block;" to the dynamic-table-container but to get it to work I have to add a pixel based height such as "height: 100px;" which makes the results table not responsive to monitor size. I have looked into the flex- components of CSS but they seem to be a) relative and b) not to work in this setting. @jezdez Can we close this since the navigation is now accessible again?

[jezdez]

@alison985 Yeah, let's close this ticket since it was partially fixed.

@madalincm Since this part of the Redash UI is heavily owned by the Redash team we need to file a bug upstream and see what their opinion on the hiding when vertically scrolling is. I'm afraid that we're running in circles when we only discuss this on the Mozilla side. Could you open a ticket upstream please?

[madalincm]

@jezdez I have logged the issue upstream getredash#2749

[jezdez]

@madalincm Thanks!