hivewallet / hive-js

Hive digital currency wallet
http://www.hivewallet.com
GNU General Public License v2.0
81 stars 57 forks source link

Fixed position issues with content underneath modals #88

Closed haustraliaer closed 10 years ago

haustraliaer commented 10 years ago

This is by design as the content must become fixed (or be torn down) to allow the overlay to scroll properly. In some cases, however, it's jarring for the user to jump back to the top (see below). So we need to figure out a solution for returning to (or maintaining) scroll position.

overlay

haustraliaer commented 10 years ago

Putting this on pause until we review the transaction detail design.

mackuba commented 10 years ago

Why does it have to scroll up? This looks pretty bad...

haustraliaer commented 10 years ago

@jsuder it's because the content in the background is set to position fixed in order to create a new layer on top with a separately defined height. Basically - browsers are shit at layout.

So to use the same method we'd need to figure out the distance scrolled underneath and then apply it to the bottom layer's positioning - which is possible but a bit hacky and error prone.

I'm going to look into other ways we might be able to handle this - but for now we're just not going to show any more transaction detail until other priority issues are solved.

mackuba commented 10 years ago

Wait, are you saying the menu and the list of transactions on the screenshot are position:fixed too?

haustraliaer commented 10 years ago

They become position fixed when the overlay is active - so that if the overlay has content which exceeds the height of the browser it will scroll, and if not - it won't.

haustraliaer commented 10 years ago

Also an issue here...

drawer_position

...so will try and find an alternative solution in general to dealing with multiple layers. Or just capture the content height with js and reposition everything manually.

haustraliaer commented 10 years ago

https://github.com/hivewallet/hive-js/commit/b289c2950a909e2d4b3a788bb4e410ec884c7178

Removing the fixed position for now, the thing that breaks the most (visually) is added scrollbars on some browsers... but seeing as we are focusing on iOS for the next month I'm gonna let that slide (it won't even be noticable).

We can revisit overlays for other browsers once we decide to spend time on broader compatibility.