Dashboard not displaying correctly on ipad


I have an iPad Air 10.9 inch and I can’t get the node red dashboard to display in full screen mode properly. As you can see in the attached screenshot there’s a white bar at the top. I am using safari and I added the dashboard to home screen as a shortcut

Also how do I bold the label in a text node? This didn't work


It has to do with this section of my template node:

body.nr-dashboard-theme {
background: radial-gradient(circle, rgb(60 60 60) 0%, rgb(40 40 40) 40%, rgba(20,20,20,1) 100%);

But I can't work out why it's showing that white line :\

Probably the browser is old enough not to support that particular CSS ?

Thanks for the response - the ipad is 4th gen (2 days old) with the newest version of safari installed. Is there an alternative way to fade the background without showing this white bar?

@Sirhc You probably should have opened with the fact that you are using a variation of @hotNipi's "But it is blue" example theme - Dashboard CSS - custom and blue

That top bar is part of the device display... clock, battery, WiFi, etc.

The same CSS background mod on Android (at least on my v7 phone) is white text on whatever colour the Node-Red theme's Base setting is (I usually use grey for my dark mode).

On an older Android (v4.4), it is always white on black. regardless of Base colour.

And as you noticed, on the iPad (and iPhone?) it is always white on white (when using that CSS background gradient mod), regardless of what Base colour (as tested on my iPad Air 1). It seems to be an Apple thing and I'm not sure you can change it and have a gradient background.

1 Like

Thanks for the responses!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.