LP1950345-Format the Current Hold Groups table in bootstrap opac
authorGarry Collum <gcollum@gmail.com>
Wed, 10 Nov 2021 19:01:44 +0000 (14:01 -0500)
committerJane Sandberg <sandbergja@gmail.com>
Fri, 10 Jun 2022 22:53:07 +0000 (15:53 -0700)
This patch styles the Current Hold Groups table in bootstrap to be consistent
with other tables in the bootstrap catalog.  It fixes overlappling text
in cells.  It also fixes the column headings for small screens.  Previously
the headings on small screens were pulling from the css rules for the
holds history table.

To test:
1. create a couple of hold groups and add a patron to each group.  Make the
groups opac visible.
2. login to the opac as the patron to view the holds groups to which the
patron belongs.  Notice the table style with not margins or padding.
3. make your browser as small as possible to see the incorrect headings.
4. apply the patch.
5. repeat 2 and 3 to view the fix.

Signed-off-by: Garry Collum <gcollum@gmail.com>
Signed-off-by: Gina Monti <gmonti@biblio.org>
Signed-off-by: Jane Sandberg <sandbergja@gmail.com>
Open-ILS/src/templates-bootstrap/opac/css/mediaQuery.css.tt2
Open-ILS/src/templates-bootstrap/opac/myopac/hold_subscriptions.tt2

index 56bea56..e8db387 100644 (file)
@@ -609,10 +609,10 @@ only screen and (max-width: 650px)  {
         border-bottom: none;
     }
         /* Force table to not be like tables anymore */
-        table#acct_checked_main_header thead tr th, table#acct_holds_main_header thead tr th, table#acct_checked_hist_header thead tr th, table#acct_holds_hist_header thead tr th, table#ebook_circs_main_table thead tr th, table#ebook_holds_main_table thead tr th {
+        table#acct_checked_main_header thead tr th, table#acct_holds_main_header thead tr th, table#acct_checked_hist_header thead tr th, table#acct_holds_groups_header thead tr th, table#acct_holds_hist_header thead tr th, table#ebook_circs_main_table thead tr th, table#ebook_holds_main_table thead tr th {
                 display: none;
         }
-        table#acct_checked_main_header tbody tr td, table#acct_holds_main_header tbody tr td, table#acct_checked_hist_header tbody tr td, table#acct_holds_hist_header tbody tr td, table#ebook_circs_main_table tbody tr td, table#ebook_holds_main_table tbody tr td {
+        table#acct_checked_main_header tbody tr td, table#acct_holds_main_header tbody tr td, table#acct_checked_hist_header tbody tr td, table#acct_holds_groups_header tbody tr td, table#acct_holds_hist_header tbody tr td, table#ebook_circs_main_table tbody tr td, table#ebook_holds_main_table tbody tr td {
                 display: block;
         }
 
@@ -627,7 +627,7 @@ only screen and (max-width: 650px)  {
                 [% END -%]
         }*/
 
-        table#acct_checked_main_header, table#acct_holds_main_header, table#acct_checked_hist_header, table#acct_holds_hist_header, table#ebook_circs_main_table, table#ebook_holds_main_table {
+        table#acct_checked_main_header, table#acct_holds_main_header, table#acct_checked_hist_header, table#acct_holds_groups_header, table#acct_holds_hist_header, table#ebook_circs_main_table, table#ebook_holds_main_table {
                 width: 90%;
         }
 
@@ -640,9 +640,10 @@ only screen and (max-width: 650px)  {
            here. */
 
         table#ebook_circs_main_table tr, table#ebook_holds_main_table tr { border-top: 25px solid #fff; }
+        table#acct_holds_groups_header tr{ border-top: 2px solid #bbb; }
         table#acct_holds_hist_header tr{ border-top: 2px solid #bbb; }
 
-        table#acct_checked_main_header td, table#acct_holds_main_header td, table#acct_checked_hist_header td, table#acct_holds_hist_header td, table#ebook_circs_main_table td, table#ebook_holds_main_table td {
+        table#acct_checked_main_header td, table#acct_holds_main_header td, table#acct_checked_hist_header td, table#acct_holds_groups_header td, table#acct_holds_hist_header td, table#ebook_circs_main_table td, table#ebook_holds_main_table td {
                 /* Behave  like a "row" */
                 border: none;
                 border-bottom: 1px solid #eee;
@@ -654,7 +655,7 @@ only screen and (max-width: 650px)  {
                 [% END -%]
         }
 
-         table#acct_checked_main_header td:before, table#acct_holds_main_header td:before, table#acct_checked_hist_header td:before, table#acct_holds_hist_header td:before, table#ebook_circs_main_table td:before, table#ebook_holds_main_table td:before {
+         table#acct_checked_main_header td:before, table#acct_holds_main_header td:before, table#acct_checked_hist_header td:before, table#acct_holds_groups_header td:before, table#acct_holds_hist_header td:before, table#ebook_circs_main_table td:before, table#ebook_holds_main_table td:before {
                 /* Now like a table header */
                 position: absolute;
                 /* Top/left values mimic padding */
@@ -698,6 +699,10 @@ only screen and (max-width: 650px)  {
         table#acct_holds_main_header td:nth-of-type(7):before { content: "[% l('Status') %]"; }
         table#acct_holds_main_header td.hold_notes:before { content: "[% l('Notes') %]"; }
 
+        table#acct_holds_groups_header td:nth-of-type(1):before { content: "[% l('Group Name') %]";}
+        table#acct_holds_groups_header td:nth-of-type(2):before { content: "[% l('Description') %]"; }
+        table#acct_holds_groups_header td:nth-of-type(3):before { content: "[% l('Actions') %]"; }
+
         table#acct_holds_hist_header td:nth-of-type(1):before { content: "[% l('Cover') %]";}
         table#acct_holds_hist_header td:nth-of-type(2):before { content: "[% l('Title') %]"; }
         table#acct_holds_hist_header td:nth-of-type(3):before { content: "[% l('Author') %]"; }
index d5d6c07..2a4b383 100644 (file)
@@ -8,8 +8,8 @@
 %]
 <div id='myopac_holds_div'>
 
+    <h3>[% l("Current Hold Groups") %]</h3>
     <div class="header_middle">
-        <span style="float:left;">[% l("Current Hold Groups") %]</span>
         <span style="float:right;">
             <a class="hide_me" href="#">[% l('Export List') %]</a>
         </span>
             <big><strong>[% l('No subscriptions found.') %]</strong></big>
         </div>
         [% ELSE %]
-        <table id='acct_holds_hist_header' class='table_no_border_space table_no_cell_pad' title="[% l('Hold Groups') %]">
+        <table id='acct_holds_groups_header' class='table table-hover table-bordered miniTable holdgroupsTable' title="[% l('Hold Groups') %]">
             <thead>
                 <tr>
-                    <th><span>[% l('Name') %]</span></th>
+                    <th><span>[% l('Group Name') %]</span></th>
                     <th><span>[% l('Description') %]</span></th>
                     <th><span>[% l('Actions') %]</span></th>
                 </tr>