Fix: iOS fullscreen popups extend outside safe area

[jfmcquade]

PR Checklist

• [x] PR title descriptive (can be used in release notes)

Description

Previously on iOS, fullscreen popups would not respect the device "safe area", meaning that the content overlapped with the device status bar (and notch/punch-out if present) at the top of the screen.

I've manually uploaded an iOS build of the PLH Facilitator MX app, using this PR's feature branch, to appetize here.

Dev notes

It's worth noting that this issue is due to the fact that only the ion-footer and ion-header with toolbars inside them will automatically account for the device safe area. This grants flexibility, but means we need to manually account for the safe area when the header and footer are omitted.

For reviewing: the first commit refactors the popup component code into a folder, look at the second commit for meaningful code changes.

Git Issues

Closes #2263

Screenshots/Videos

Debug deployment

iPhone 15

https://github.com/IDEMSInternational/parenting-app-ui/assets/64838927/cd6d55de-a257-4b63-bed1-6083c6f970b4

iPhone 8 Plus

https://github.com/IDEMSInternational/parenting-app-ui/assets/64838927/d38285c0-6608-4e6d-9c25-42adc79e3af7

PLH Facilitator MX deployment

iPhone 15

https://github.com/IDEMSInternational/parenting-app-ui/assets/64838927/88efabf6-220b-4a05-bd19-cecdd47cdb1b

iPhone 8 Plus

https://github.com/IDEMSInternational/parenting-app-ui/assets/64838927/7e95d94d-bd57-45c1-af87-bc0efc6ce0cc

[jfmcquade]

The close button on a regular pop-up (in front of a full screen pop up) annoyingly does still intersect the device status bar. ... Shall I create a follow up issue for this?

Thanks, I'll see if it's quick to resolve and can be included in this PR

[jfmcquade]

@esmeetewinkel I've pushed a commit which should fix the non-fullscreen popup issue. I've updated the appetize link. I think we should be good to merge if you agree that it looks good functionally.

I also noticed a bug with the close button being obscured, I've created a new issue: #2274. Let me know if you notice this or have any more details to add.

Debug deployment

https://github.com/IDEMSInternational/parenting-app-ui/assets/64838927/74f23a71-4b58-459e-bf37-1a77e80cc17d

Chrome desktop:

Facilitator deployment

https://github.com/IDEMSInternational/parenting-app-ui/assets/64838927/aed762d6-0661-4724-a96f-5aaaa657fb6c