Maybe it’s not a great idea to have the modal open on mouse over/touch area, but activate it using a regular button.
Then just hide the button on small screens.
Make sure your page has the browser component added already which it probably does.
Click your button you want to hide and go to dynamic attributes. Display. Hide. In the condition choose browser1.viewport.width >= 768px
I get easily confused with less than or greater than so you are trying to say hide button when view port width is less than or equal to 768px wide or any number you choose
Like @Teodor said. There is actually an easier way. Just select the button. Turn off the dynamic attribute I spoke about earlier. Look in the normal properties for the display section and click the phone icon. Then choose none.
Yes, I tried it that way but when I do that it always disappears - so I must be doing something wrong. And when it does go away - it causes elements on my page to move and messes up the alignment.
Ahh I see that makes sense. It is default bootstrap behaviour. Mobile first. So click phone and say none like you have which will make Mobile and all larger none then click tablet and say display block which will make tablet and all up from that block which means tablet laptop and computer. I think, sorry not in front of wappler right now.