0

Make Lightbox take up full vertical height on mobile

305 0 1
Posted   3 months ago

Hello,

 

The TLDR on what I'm trying to do is, I have users going through scenarios and I will allow them to open up a knowledge base (the Flow knowledge base) in a lightbox, where the knowledge base is being iframed in via a website on that lightbox. This works great on a desktop/laptop, but when I go to mobile, the lighbox only takes up a small portion of the vertical height. I tried going through the CSS to see if I could figure it out, but no luck. I'd like the lightbox to take up the entire vertical height like it does on desktop/laptop.
 
In the below example, I'm using the Flow User Guide for demonstration purposes.
On desktop: As you can see it takes up the entire height. The knowledge base is nicely usable here.
On mobile: The lightbox only takes a small portion of the vertical height and the knowledge base is unusable.
 
 
Any help would be appreciated.
 
Thanks!

Comments

( 0 )
Filter

Answers  ( 1 )

0
avatar Chris Van Wingerden ●   |    
Posted   3 months ago
  ●   Edited   3 months ago

When you add an iframed url to a page (Insert tab >> Video >> From URL), the iframe's settings default to have width and height of 320x240. 

At the smallest breakpoint range, the page looks to the min height setting to control the iframe on the page.

So, you can change the Min Height setting to have control over the display height. I did a test with 600 instead of 240, for example.   

 

Comments

( 1 )
0
3 months ago   ●   redmondd   ●   21   |   5  

Thank Chris. The other thing was to make sure the section takes up 100% of the screen height. While this isn't technically needed if the iframe height is large enough, I found it helps.

Write your answer

Related Questions

0

Full width image

 1439 0 1
Posted   2 years ago
is there a way to input a full width image? so you open your program in a web browser it goes full width?  
0

Timeline not displaying on mobile phone

 1508 0 4
Posted   2 years ago
I have built a timeline using the widget in Flow. It does not display on a mobile phone. I have a Samsung Galaxy A71. Neither the timeline icons nor the content display when viewed on the phone. Is this a known issue?  
0

Rich Text Title Style on Mobile

 1092 0 0
Posted   one year ago
When I change the title text to white using the editor for all device sizes, why does it keep changing to grey for Mobile only? How can I fix this?    
0

Lightbox Question

 1404 0 1
Posted   2 years ago
When I use the show an image in the lightbox feature, the assets are not getting arranged in sequence, in spite of putting them in order multiple times. For example: if I want Red to come first and then I click the right arrow(>), the blue should come second. But for some reason, the above is not working and the result is : Blue comes first and red comes second.
0

Locking a header in place on a vertical scrolling Flow project

 1033 0 1
Posted   one year ago
  ●   Edited   one year ago
Is there any way to lock the header section in a vertical scrolling project so that it stays fixed in place at the top of the screen whilst the rest of the screen is scrolled?  
0

Changing button padding/size

 1431 0 1
Posted   one year ago
Hi, I'm trying to create a narrow button (height-wise) but the button seems to stop with a minimum height of about 35 pixels. Despite changing the height to less than that, the button itself doesn't get any shorter (althought the red bounding box does). I can see under options there are  padding/size options and in the theme settings, it shows a range of different sized buttons, however these padding/size options are disabled and i cant see any way of reducing the padding or overall height an...
0

Accessing the vertical player

 551 0 1
Posted   6 months ago
How do I edit the vertical navigation player if I want to change the colors?  
0

Embed an Assessment

1367 0 2
Posted   one year ago
I have an assessment that I created in another platform that I want to embed in dominKNow instead of re-creating the entire assessment. I know that I can link to it, but I want the learner to engage with my dominKnow content and take the assessment from another platform on the same page in dominKnow.  Is this possible? If so, how can I do it?  
0

Can we make shapes blink?

 1431 0 1
Posted   2 years ago
  ●   Edited   2 years ago
In one of the page interactions in the course, we were trying to add a shape that would keep on blinking until clicked. We were not able to find any such option. is it possible in DominKnow? If yes, please guide us with that.