Safe area not being used properly in landscape view

[bhajneet]

Describe the bug

As you can see here (this is just one example of many), the bottom bar containing the search bar and bookmarks button are squished inwards to respect the iPhone notch area on either side. Things that are disrespecting the safe area:

• Main content (where gurbani, translations, etc are)
• Top bar (where timeline/settings button and logo are)
• Modals (both titlebar and modal content are not respecting the sides)

The above examples need to be squished in just like the bottom bar.

These also need to be tested on Android.

[bhajneet]

Top bar height is wrong, makes hitting buttons difficult.

Search and Collections were not implemented:

• search's "cancel" can't be clicked
• search's search bar is overflowing height wise from where top bar ends
• collection's content items are in danger zone
• main, search, and collection top bars are all too small

[Harjot1Singh]

What do you mean by top bar?

[bhajneet]

What do you mean by top bar?

It's too short, very evident by the size of the search bar input overflowing

[Harjot1Singh]

Hm, would we be able to compare it to a native horizontal bar? I believe it's using that as the the height and I can't seem to configure it. WIll have to look into other solutions.

[Harjot1Singh]

So for horizontal, these are the defaults popping out of react navigation and I'm not how to solve it without switching back to the stack navigator (not native). If we do that, we may have to figure out how to get the full height pull to dismiss working again as that does not come OOTB. Will evaluate and revisit.