I am struggling to debug the issue here. Until a react-select is shown on the UI the feedback on mobile touch elements do not provide feedback on touch.
This can be seen here by completing the journey on mobile until step 4: https://odd-panda-design.badgerbookings.com/booking
When you first interact with the elements there is no feedback however when you get to the 4th screen in the journey and click "signup" (showing the react select) the hover elements suddenly provide feedback if you navigate back to them. This issue is only on mobile and not web. I have tested on iPhone 6 using Chrome.
Below is the react-select element that triggers the touch feedback interactions.

I have tried adding
I am not sure if this is a react or javascript issue
from CSS hover/active touch feedback not working on mobile until react-select is shown
This can be seen here by completing the journey on mobile until step 4: https://odd-panda-design.badgerbookings.com/booking
When you first interact with the elements there is no feedback however when you get to the 4th screen in the journey and click "signup" (showing the react select) the hover elements suddenly provide feedback if you navigate back to them. This issue is only on mobile and not web. I have tested on iPhone 6 using Chrome.
Below is the react-select element that triggers the touch feedback interactions.

I have tried adding
onTouchStart and changing the hover elements to include :active or :focusI am not sure if this is a react or javascript issue
from CSS hover/active touch feedback not working on mobile until react-select is shown
No comments:
Post a Comment