Button visibility - mobile vs. desktop/tablet

Hi there,

We are developing an app that will be used primarily on iPhones and iPads.

When navigating through the app on mobile view, there is a back button to navigate backwards. There is no back button present on desktop view.

This was a major UX flaw when testing our app with users - testers could not figure out how to navigate backwards when using an iPad (desktop view).

I have inserted a Button component with the action “Go Back” which allows desktop view users to navigate backwards.

Now, I am met with the issue of having two back buttons when on mobile view.

Perhaps this is a feature request, but I am wondering if there is a way to target component visibility for mobile vs. desktop views? Could I hide the button from mobile view using Custom CSS?

We are on a Glide Business plan.

Images below of the confusing UI double back button conundrum!

Thanks in advance for any assistance :slight_smile:

Get the users device information and set a viability condition based on operating system or screen width.

Have you tried adding a Breadcrumbs component at the top of the screen?

Breadcrumbs should be good enough. It shows only on desktop.

If that doesn’t work, Eric’s suggestion would be the way to go. Get the screen width and then show/hide components accordingly, I think.

Clicking the breadcrumbs isn’t as intuitive as one might hope for first time tablet users, but appreciate the suggestion!

Curious about Eric’s suggestion…how would one get the user’s device information/screen width?

Thanks all for the help!

Oh brilliant, thanks Darren!

It seems like the Device Info is only computed once, the first time a user logs in.

So, for example, when a user logs in on a tablet, then logs in on an iPhone, the Device Info for only the tablet is recorded in the Data Editor.

Expected behavior or a bug?

No, you should get the info for whichever device they are using at the time.

Can you describe how you’ve set it up, and how you got that result?