search

focusconsulting / housing-insights

Bringing open data to affordable housing decision makers in Washington DC. A D3/Javascript based website to visualize data related to affordable housing in Washington DC. Data processing with Python.
http://housinginsights.org
MIT License
59 stars 110 forks source link

Jcatania/560 welcome modal bootstrap #575

Closed jamiecatania closed 6 years ago

jamiecatania commented 6 years ago

@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 commented 6 years ago

@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:

image

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 commented 6 years ago

@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 commented 6 years ago

@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 commented 6 years ago

@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 commented 6 years ago

@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 commented 6 years ago

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 notifications@github.com 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 https://github.com/codefordc/housing-insights/pull/575#issuecomment-331209928, or mute the thread https://github.com/notifications/unsubscribe-auth/ATpPrJHKqMoYniE4m7268bJbDr8Oh2dNks5sko5QgaJpZM4PenE1 .