kiwicom/orbit

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

  1. Click on the "open modal" to open up a modal.
  2. 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.