Improve side panel behavior in mobile interface#1343
Conversation
UV -> my dev
…moreinfo Mobile trigger moreinfo
…/universalviewer into fix-938-mobile-sidebars
…ormal panel open and full open
… leftpanel with isMetric
…o autoclose-mobile-thumbnails
…smisson/universalviewer into autoclose-mobile-thumbnails
…son/universalviewer into autoclose-mobile-panels
Thanks @demiankatz , I've just fixed this. The attribution panel had an arbitrarily high z-index I assume to get it over the media content, but the new left/right panel z-indexes were lower. I've put it at 19 just below the panels' 20. I figure we should keep the attribution below the panels, as it's got some transparency on it it'll potentially look messy if over text in the left panel. |
|
Thanks, @jamesmisson ! This looks a lot better; the Attribution box is consistently below the panels in terms of layers. My only remaining issue is one I pointed out in my first example with the orange arrows (above). The Attribution box on is located lower toward the bottom of the screen in mobile view, so its part of the box is visible when the autoclose panels are open. The Attribution box is lower toward the bottom of the screen for scanned items and PDFs than it is for audio and video items. When the autoclose panels are open for audio and video items, those panels completely cover the Attribution box. Is it possible to force the Attribution box to always appear in the same spot on the screen, ideally a bit higher up? Here are four screenshots to demonstrate: |
|
Thanks @sturkel89 , I've made it so that the attribution margins adapt to the mobile view and are in line with the bottom of the panel when viewing images or media, so it's not visible when the panel is open now. |
|
Thanks, @jamesmisson ! I see that the bottom of the attribution panel is higher now. I tested each of these examples and see that the sliding panels completely cover the attribution panel, so that solves my issue. The attribution panels are all in approximately the same location; the height of some may be shorter if the license is displayed as a line of text instead of a larger graphic. |
LlGC-jop
left a comment
There was a problem hiding this comment.
Added suggestion for comment update
Co-authored-by: Jonathan Phillips <125897079+LlGC-jop@users.noreply.github.com>
demiankatz
left a comment
There was a problem hiding this comment.
Thanks again, @LlGC-jop and @jamesmisson. I believe this is ready to merge now, unless anyone else wants to do any last-minute testing.
@demiankatz I just test this using Browserstack to test it in mobile view and looks good on my end. |


As discussed in #1337, this makes sure that the left and right panels can't be open at the same time in mobile view: if one is open while the other one is opened, it is automatically closed.