TPAC: CSS should be mobile first, and only apply deltas to wider displays

[Dan Scott]

* Evergreen master

Back in the 2.5 days we hacked on mobile responsiveness support by adding a media query for a given screen width and overriding the style accordingly--the assumption being that most people have large screens and thus we should design for desktop/laptops and deal with mobile after. In some cases functionality was sacrificed in the mobile version, sometimes because it was simply overlooked.

Instead, the generally accepted practice is to make everything look and work well on mobile first, which ensure that it will work on every screen size, and only then add frippery within a media query for the larger size of screen.

In practice, for us this really means one small delta to make the generally accepted approach the default mode going forward.

[Tony Bandy (tonyb-y-deactivatedaccount)]

Second this, also if non-searching areas of the TPAC could be considered for mobile development work as well, particularly with regards to the My Account section. We've noticed that in some resolutions, the lists and checkouts are semi-squashed and non-legible.

Thanks,

Tony

[Christopher Burton (cburton)]

https://bugs.launchpad.net/evergreen/+bug/1778972 presents a mobile forward way of viewing the OPAC with full responsiveness including a redesign of My Account to be more straight forward

[Terran McCanna (tmccanna)]

I'm going to go ahead and mark this Won't Fix as the Bootstrap OPAC resolves the key issues. (Note that there are a few small bugs with the Bootstrap OPAC reported elsewhere.)