title: How do I force Sweet Alert 2 to fire over Google Map while the map is full screen?
body: <p>I have an application that uses Google Maps.  I'm using Sweet Alert 2 for js confirmations.  I'm not having a problem firing Sweet Alert dialogs as long as the Google Map is NOT in full screen mode.  However, when Google Maps in in full screen mode, the dialog fires but is not visible until I exit full screen mode.</p>
  
  <p>I had a similar issue with bootstrap modal, and I resolved it by setting the z-index on the modal containers.  I thought that I could do the same with Sweet Alert 2, but it is not working.</p>
  
  <p>below is the js used to fire the swal:</p>
  
  <pre><code>Swal.fire({
      title: 'Are you sure you want to delete this point?',
      text: "You won't be able to revert this!",
      type: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#d33',
      confirmButtonText: 'Yes, delete it!',
      customClass: {
          container: 'my-swal'
      }
  }).then((result) =&gt; {
      ...
  });
  </code></pre>
  
  <p>and this is the css:</p>
  
  <pre><code>.my-swal {
      z-index: 2147483600;
  }
  </code></pre>
  
  <p>In addition to the code above I've also tried just applying the z-index to the default Sweet Alert 2 container class "swal2-container" and not specifying a customClass on fire.  This did not work either.</p>
  
  <p>The interesting thing is, for both examples, when I inspect the page, it shows that the z-index of the container is set to what I've specified, but the alert is still not visible.  And again, this same solution is applied to Bootstrap Modal containers on the page and working fine.</p>
  
  <p>Any suggestions would be appreciated :)</p>