From 7aeb48e0fa469109e13eaa6f905de8d8347af22a Mon Sep 17 00:00:00 2001
From: Teal Larson <LARSON.TEAL@GMAIL.COM>
Date: Mon, 13 Jun 2022 15:02:18 -0400
Subject: [PATCH] fix modal overlay problem (#13724)

---
 airbyte-webapp/src/components/Modal/Modal.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/airbyte-webapp/src/components/Modal/Modal.tsx b/airbyte-webapp/src/components/Modal/Modal.tsx
index a3bca9d1190f..38d37c414a83 100644
--- a/airbyte-webapp/src/components/Modal/Modal.tsx
+++ b/airbyte-webapp/src/components/Modal/Modal.tsx
@@ -4,7 +4,7 @@ import styled, { keyframes } from "styled-components";
 
 import ContentCard from "components/ContentCard";
 
-export interface IProps {
+export interface ModalProps {
   title?: string | React.ReactNode;
   onClose?: () => void;
   clear?: boolean;
@@ -26,10 +26,10 @@ const Overlay = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  z-index: 10;
+  z-index: 100;
 `;
 
-const Modal: React.FC<IProps> = ({ children, title, onClose, clear, closeOnBackground }) => {
+const Modal: React.FC<ModalProps> = ({ children, title, onClose, clear, closeOnBackground }) => {
   const handleUserKeyPress = useCallback((event, closeModal) => {
     const { keyCode } = event;
     if (keyCode === 27) {