Jcatania/560 welcome modal bootstrap

[jamiecatania]

@NealHumphrey It didn't actually require much refactoring at all, and buttons appear to be working. Let me know if anything else is needed on this!

[NealHumphrey]

@jamiecatania Unfortunately it doesn't look like the core issue is solved yet. The main problem was that if the screen height was too small, i.e. shorter than the height of the modal, the buttons were locked off-screen with no way to scroll to them:

In the semantic ui modal, calling the 'resize' at the end of the page load would fix this by adding a page scroll bar and letting you scroll the modal while the background was static. Looks like we can't do that here.

Can you look into that aspect of it? On nice high-res screens it's not an issue but on some screens it still will be.

[jamiecatania]

@NealHumphrey - It appears that adding overflow-y: auto to the modal provides the desired scrolling effect at a variety of low resolutions. I've tested in chrome and firefox at resolutions ranging from 480 x 800 all the way up to 2560 x 1440. The scrollbar is showing and allowing access to the buttons in all cases. Also, the scrolling action doesn't appear to effect the map/other elements under the modal.

[NealHumphrey]

@jamiecatania so I was trying to put in a quick-fix hack so that the deploy would be ok on this issue. Turns out I stumbled into a good-enough-for now hack. If you call the 'refresh' function on the semantic ui modal twice in a row, it resolves the scrolling issue. The first refresh moves the modal up the page slightly, and the seocnd one realizes that in it's new location it still doesn't fit so adds the scroll.

I've put this into the current dev and master branches and it's up on the live site. Not perfect b/c there's still a slight delay, but the whole page is still loading so I'm ok with just using this hack to get it usable rather than going down another debugging rabbit hole.

[NealHumphrey]

@jamiecatania Looks like we wrote at the same time. If your css change works I'm happy to use that instead of my hack. Looks like you've updated the PR. I'll test it out, either tomorrow or Monday

[NealHumphrey]

@jamiecatania overflow-y fixed it, so simple! Wonder if that would have worked on the semantic-ui one. Anyways, we're merged in and good to go on this issue. Thanks!

[jamiecatania]

Cool cool, glad it worked!

…

---------------------------------------- Jamie Catania Learning Experience Designer 1436 Henry St, Baltimore, MD 21230 219-242-2687 JamieCatania.net

On Thu, Sep 21, 2017 at 12:26 PM, Neal Humphrey ***@***.***> wrote: @jamiecatania <https://github.com/jamiecatania> overflow-y fixed it, so simple! Wonder if that would have worked on the semantic-ui one. Anyways, we're merged in and good to go on this issue. Thanks! — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#575 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ATpPrJHKqMoYniE4m7268bJbDr8Oh2dNks5sko5QgaJpZM4PenE1> .