SafeAreaView for iphone X

The problem here is updating the color in the parent component, with the change that happens lower.. we could use a passed in function to do that, but I'm afraid it will casue a lot of unnecessary reloading and possible edge cases, since that thing surrounds routes.
we could also use a similar idea that we have in a menu - to just be above the background in a child component