Mobile functionality for single views

[joshdarby]

Changes

This pull request makes the following changes:

• Adds mobile functionality to the projects view that opens a "pop up" (full width/height of projects list view) and makes the inside content of the single project sticky and scrollable

• Adds desktop functionality to the projects view that makes the inside content of the single project view sticky

• Updates the JS function to fire the project view when a title is clicked. It wasn't working correctly on posts being loaded from LMP since they were dynamically generated

Why

For #125 / 141

Testing/Questions

Features that this PR affects:

• Single project view on desktop
• Single project view on mobile
• Loading posts functionality

Questions that need to be answered before merging:

• [x] Is this PR targeting the correct branch in this repository?
• [x] Does the mobile view work ok?
• [ ] Is there a way to make the "sticky" functionality/content position smoother when scrolling between sticky nav and no sticky nav?

Steps to test this PR:

1. View a page with the projects shortcode and play around on desktop and mobile

[joshdarby]

Would it make sense to not change the position based on show/hide of the sticky nav, but instead position the element such that it's always visible, with and without the sticky nav?

@benlk How were you thinking of doing this?

[benlk]

I would:

• remove this class: https://github.com/INN/umbrella-currentorg/pull/142/files#diff-2de11c6852e04b60882a971c736d8bdfR16-R23
• set the top: rule here to the height of the sticky nav, ~40px: https://github.com/INN/umbrella-currentorg/pull/142/files#diff-3a288e42a00f378492654d7d8ef7e227R144
• add a rule following on that that adds the height of the WP admin bar to the height of the sticky nav, when the admin bar is visible.

[joshdarby]

@benlk If we do the above, doesn't it look kind of weird with all of the white space when the sticky nav is not visible?

[benlk]

If the borders are such that the black outline stays at a fixed height from the top of the page, and from the bottom of the page, I think it's less weird/annoying than if the div keeps shifting when people change scroll direction.

It looks like https://jobs.current.org/jobseeker/search/results/ solves this problem by limiting the search results' height on the page, and then having both the list and the post scroll within that container.

[benlk]

@kaylima any thoughts?