This question is answered. Helpful answers available: 2. Correct answers available: 1.


Permlink Replies: 6 - Pages: 1 - Last Post: 25-Jun-2019 23:00 Last Post By: jGromit Threads: [ Previous | Next ]
ksmatharu

Posts: 65
Registered: 2-May-2009
Gromit - slide title not appearing above photo in iOS
Posted: 22-Jun-2019 10:59
 
  Click to reply to this thread Reply
In my desktop web browsers (Edge, Firefox, Chrome), on the slide pages, I can see the image tile above the image . But when I view on iPhone or iPad, in both Firefox and Safari, the image title just isn't there.

I'm not sure if it's caused by some custom CSS or misconfiguration on my part, or if Gromit is designed that way.

Slide page here:
https://www.silentnomad.com/images/showcase/slides/_8500296.php

Ta.
RobM

Posts: 3,090
Registered: 4-Aug-2006
Re: Gromit - slide title not appearing above photo in iOS
Posted: 22-Jun-2019 11:38   in response to: ksmatharu in response to: ksmatharu
 
  Click to reply to this thread Reply
I can confirm the title doesn’t show in normal IOS browsers, but I can see it with a debug browser for IOS - MIHTools.
jGromit

Posts: 7,350
Registered: 31-Jan-2006
Re: Gromit - slide title not appearing above photo in iOS
Posted: 22-Jun-2019 14:14   in response to: ksmatharu in response to: ksmatharu
 
  Click to reply to this thread Reply
ksmatharu wrote:
...Gromit is designed that way.

Bingo.

On a small display, Gromit eliminates things that don't work well when the screen real estate is limited, like page titles and thumbstrips. The page title is fighting for space with the navigation icons, so something has to give. Otherwise, the title ends up wrapping, and pushing everything else down. In fact, without some Javascript/CSS intervention, the navigation icons get scrambled.

It has nothing to do with iOS, or even with whether the device is a "mobile" - it's driven entirely by the window size. In a desktop browser, try shrinking the window, and you'll see the effect.

ETA: When I did this, I was thinking primarily of a title bar that would be showing the album or folder title, which is generally not all that important for the slide image. Losing the image-specific title is a little different. I'll consider changing the routine to move the text down, rather than hiding it. That's what the thumbnail page does. But that will reduce the space available for displaying the image, so....
ksmatharu

Posts: 65
Registered: 2-May-2009
Re: Gromit - slide title not appearing above photo in iOS
Posted: 22-Jun-2019 20:20   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
Thank you. No need for changes. I'd rather keep the real estate for the images as per your design :)
jGromit

Posts: 7,350
Registered: 31-Jan-2006
Re: Gromit - slide title not appearing above photo in iOS
Posted: 22-Jun-2019 20:44   in response to: ksmatharu in response to: ksmatharu
 
  Click to reply to this thread Reply
Attachment iPadMini.png (1.4 MB)
Attachment GalaxyS5.png (1.4 MB)
I think I can probably have my cake, and eat it, too. With a little CSS trickery, the title can still be shown, but truncated if necessary. A punchy one- or two-word title would still be entirely visible. But never any wrapping, so no extra space being chewed up. Compare the two screenshots (from the Chrome device simulator).

It would take some extra tinkering to account for font size issues, but not very difficult. I'll keep it on the "maybe in the next release" list (the Mercury skin could use some of the same kind of fiddling).
ksmatharu

Posts: 65
Registered: 2-May-2009
Re: Gromit - slide title not appearing above photo in iOS
Posted: 25-Jun-2019 21:02   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
And make it configurable ;)
jGromit

Posts: 7,350
Registered: 31-Jan-2006
Re: Gromit - slide title not appearing above photo in iOS
Posted: 25-Jun-2019 23:00   in response to: ksmatharu in response to: ksmatharu
 
  Click to reply to this thread Reply
Attachment small.png (503.9 KB)
Attachment normal.png (1.0 MB)
In my beta skin version (yes, it was easier than I thought), there's a new Hide page title on small displays checkbox on the Layout > Slides panel. If checked, it does what the skin does now. If not checked, it shows as much of the title as it can without wrapping, using ellipses to indicate that there's more there. There's no option to let the title wrap and push everything else down, however.

To make the most of the available space, it also doesn't force-center the title between the navigation icons on a small display (depending upon the options you've chosen, there can be a lot more of them on one side than the other). See screenshots.
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums