Floating header on mobile

Need help Mobile
1

Hi.
I’m new to Bubble so apologies if this is an easy/silly question.
I am creating a PWA designed (solely) for mobile and have the bare bones of it coming together.
I’ve watched a bunch of tutorials (there’s some great ones out there!).

The issue I’m having is when you scroll up, the body content is re-appearing above the floating group at the top which doesn’t look great.
Also the phone time & signal strength icons are white against a white background.
Lastly is there an (easy) way of removing the scroll bar that appears on the right on mobile?

IMG_2E9C24116F6A-1
IMG_2E9C24116F6A-11125×2436 1.24 MB

2

You should check this out

http://forum.bubble.io/t/july-30-2020-bdk-native-apps-v1-8-released/103996?u=boston85719

it has features that will take care of that issue

Otherwise, it is quite difficult without using some CSS

3

Thanks. I’ve had a look through that. Would it be the ‘update header’ feature that does this?

4

I’m not familiar with the product…you might want to reach out to the developer to request information and specific details

5

Ok. Thanks

6

You should check this post. I am having the same problem with my app and have neither yet been successful in finding a good solution. The below post is what I am trying right now and it seems to help with some issues at least. Let me know if you found another solution!

7

Thanks. I had seen that thread but was reluctant to start adding in css as it’s something I don’t understand at all!

8

hi,
i never encounter the problem you described but did encounter it at the start.
make sure to right click to send your header to the front and that it starts at y coordinate of 0 px and experiment with the background colourof your page as well as the header to avoid the overlap.

9

Had the same issue. I don’t know what the correct fix is, but here is a workaround: Add a floating group 100% width, 100px height, same color as your header. Set the top margin to -100. Your content will scroll below this group and will not be visible. The group appears below the time/battery, etc.

1 Like