FLUID-5532: responsive UIO: Fix the current UIO on mobile

Description

To have the current UIO work with mobile devices.

See designs:
https://wiki.fluidproject.org/pages/viewpage.action?pageId=137658573

Comments

• Cindy Li commented 2014-11-10T10:48:37.741-0500

  After going thru the usability and styling issues encountered at fixing the current UIO on mobile in the community meeting on Nov 5, 2014, the decision is, rather than continuing tweaking the desktop version of UIO, create and implement a mobile-first UIO design.

• Justin Obara commented 2017-04-04T14:07:36.210-0400

  Because many of our sites are made with Foundation, it may be useful to make our media queries based off of their sizes. (i.e small === any size, medium === 640px/40em or wider, large === 1024px/64em or wider)

  http://foundation.zurb.com/sites/docs/media-queries.html

• Cindy Li commented 2017-04-20T10:13:03.912-0400

  The pull request has been merged into the project repo master branch at f8d92a56023a3ae6c1c2a20773f7ac44e1514d31

  This pull request implements an intermediate solution that adjuster panels for mobile version require horizontal scrolling to view all of their contents, instead of implementing "<" button to go to the previous panel and ">" button to go to the next panel.

• Cindy Li commented 2017-04-20T10:38:30.322-0400

  The IRC discussion about two issues with this intermediate solution:

  1. Use the intermediate solution of scrolling the panels until we can implement the arrows/snapping;
  2. Then the issue of what to do with the snapping panels when the content gets too big to fit.

• Justin Obara commented 2017-04-25T13:05:37.984-0400

  The arrows/snapping will be handled in FLUID-5534