Capacitor Camera initiated from Modal

I am having an issue where the Camera from Capacitor is being launched from a Modal, however, the Camera is being displayed behind the modal. I need the Camera in front of the modal.

on the Modal Component

<ion-icon class="attachmentIcon" slot="end" name="camera-outline" (click)="addPhoto()"></ion-icon>

On the Modal ts

async addPhoto(){
    console.log("Camera Clicked");
    const image = await Camera.getPhoto({
        quality: 90,
        allowEditing: true,
        resultType: CameraResultType.Uri
      // image.webPath will contain a path that can be set as an image src.
      // You can access the original file using image.path, which can be
      // passed to the Filesystem API to read the raw data of the image,
      // if desired (or pass resultType: CameraResultType.Base64 to getPhoto)
      var imageUrl = image.webPath;
      // Can be set to the src of an image now
      //imageElement.src = imageUrl;

How can i get the camera to show on top of the Modal?

The issue here is z-index. The Modals Z index is higher than the camera. you can add the following to your styles.css

pwa-camera-modal-instance, pwa-action-sheet{
  z-index: 99999;