Bootstrap Opac: the display of tables on small screens

[Garry Collum]

EG 3.9.0

Currently when viewing tables on small screens in the Bootstrap opac the display is rendered vertically with column definitions that are defined in CSS. This causes some oddities, especially for optional/non-used columns such as courses, or parts in the copies' table, for example. If the columns are not defined in CSS then the data does not display on small screens.

A better solution may be to add some generic CSS classes to display the tables vertically that can be used on any table and have the labels for the columns pulled from the table, not defined in CSS.

[Garry Collum (gcollum)]

A proposed patch is at https://git.evergreen-ils.org/?p=working/Evergreen.git;a=shortlog;h=refs/heads/user/gcollum/lp1984269-Bootstrap-opac-display-of-tables-on-small-screens

Most of the functionality to do this was already in the CSS files, I technically just had to add one line to pull content from an attribute.

The proposed patch uses the copy_table.tt2, and results/table.tt2 (displayed by using "Show More Details") as prototypes. Basically a "mobile-title" attribute, just has to be added to any <td> field of the table. <td mobile-title="[% l('Barcode')"%]>

Probably the best test is to search for a bib that has parts, and compare before and after.

Currently for these two tables there is a portion of CSS that displays Copy #1, Copy #2, etc. when viewing the table on a small screen. But the CSS only defines numbers up to 10. This is also refactored in this patch.

Even though it wasn't necessary, I went ahead and edited the duplicate code in both style.css and mediaQuery.css. We probably need another Lauchpad bug pertaining to cleaning up the CSS.

[Garry Collum (gcollum)]

Also, in the original CSS the headers for the tables are not hidden, the are displayed 8.5 feet above and to the left of the screen, so accessibility issues from using attributes, should not be an issue.

[Garry Collum (gcollum)]

I pulled this into a VM running current master with no issue. Is it possible that it was conflicting with another patch that was added to the test server?

[Terran McCanna (tmccanna)]

Quite possibly - I believe there were quite a lot of patches loaded onto that test server. I'll remove the rebase tag!

[John Amundson (jamundson)]

I tested this by adding parts to only some items on a record. Pre-patch, this would make fields line up incorrectly for items without parts. After the patch, everything lined up as expected.

I have tested this code and consent to signing off on it with my name, John Amundson, and my email address, <email address hidden>.

[Galen Charlton (gmc)]

Pushed down to rel_3_9. Thanks, Garry and John!