react-spring-bottom-sheet icon indicating copy to clipboard operation
react-spring-bottom-sheet copied to clipboard

Allow setting an z-Index

Open CrysisDeu opened this issue 2 years ago • 5 comments

The webpages sometimes will have z-index > 3. Can we get an option to set the zIndex of the bottom sheet please

CrysisDeu avatar Apr 19 '23 22:04 CrysisDeu

I use styled components


const StyledBottomSheet = styled(BottomSheet)`
    --rsbs-backdrop-bg: ${({ theme }) => theme.body.colors.sparePrimary(0.5)};
    --rsbs-bg: ${({ theme }) => theme.body.colors.base()};
    --rsbs-overlay-rounded: ${({ theme }) => theme.decorations.borderRadius.base}px;

    & [data-rsbs-overlay],
    [data-rsbs-backdrop] {
        z-index: 9999;
    }

    &::after {
        z-index: 9999;
    }
`;
 

Yeroshenko avatar Apr 24 '23 07:04 Yeroshenko

Up

In my case: The overlay is not blocking the content, the content below still can be clicked

rein96 avatar Apr 24 '23 11:04 rein96

Experiencing the same. I can click elements through the backdrop.

AshRing avatar Oct 16 '23 23:10 AshRing

same issue here

nikolay-bennie avatar Dec 06 '23 17:12 nikolay-bennie

I'm experiencing the same issue. I hope options will be added soon.

donguk87 avatar Apr 22 '24 07:04 donguk87