feat: change popover z-index

stakwork · Nov 1, 2023 · a4b15d1 · a4b15d1
1 parent 9239e72
commit a4b15d1
Showing 1 changed file with 11 additions and 4 deletions.
diff --git a/src/components/common/ConfirmPopover/index.tsx b/src/components/common/ConfirmPopover/index.tsx
@@ -1,10 +1,10 @@
 import Popover, { PopoverOrigin } from '@mui/material/Popover'
 import React, { useState } from 'react'
 import styled from 'styled-components'
-import { Flex } from '../Flex'
+import { Button } from '~/components/Button'
 import { Text } from '~/components/common/Text'
 import { colors } from '~/utils/colors'
-import { Button } from '~/components/Button'
+import { Flex } from '../Flex'
 
 type ConfirmPopoverProps = {
   message: string
@@ -45,7 +45,7 @@ const ConfirmPopover: React.FC<ConfirmPopoverProps> = ({
   return (
     <>
       <div>{React.cloneElement(children, { onClick: handleOpen })}</div>
-      <Popover
+      <StyledPopover
         anchorEl={anchorEl}
         anchorOrigin={anchorOrigin}
         onClose={handleClose}
@@ -63,7 +63,7 @@ const ConfirmPopover: React.FC<ConfirmPopoverProps> = ({
             </Button>
           </Flex>
         </Wrapper>
-      </Popover>
+      </StyledPopover>
     </>
   )
 }
@@ -72,6 +72,7 @@ const Wrapper = styled(Flex)`
   background: ${colors.headerBackground};
   color: ${colors.white};
   padding: 16px 8px;
+  z-index: 100000;
 
   .secondary {
     margin-left: 8px;
@@ -80,4 +81,10 @@ const Wrapper = styled(Flex)`
   }
 `
 
+const StyledPopover = styled(Popover)`
+  && {
+    z-index: 9999;
+  }
+`
+
 export default ConfirmPopover