z-index for inputfields shouldnt be given
Closed this issue · 1 comments
kabh commented
InputField Components are having z-index which makes its look odd when react-portals are used. For example check this codesandbox . While the modal is open click inside the inputfiled component of orbit which
Expected Behavior
Current Behavior
Possible Solution
No z-index for inputfields, its not a popup /popover.
Steps to Reproduce
https://codesandbox.io/s/orbit-sandbox-7kq4r
- Click on the "open modal" to open up a modal.
- While the modal is open click inside the inputfiled component of orbit
a) doesnt dismiss the react modal
b) also looks odd if background of react modal is dimmed when the modal is open.
Context (Environment)
I was using orbit in conjunction with react-modal , the whole background is dimmed except the Inputfield
vepor commented
Actually, z-indexes are necessary for proper visual functionally of InputFields. Problem in your case is that the rendered overlay of react-modal
doesn't have any z-index at all.
Preferably, use our component Modal
and Portal
, or add z-index
higher than 100
to the overlay.