From 40cef822bb3324c0b0853d647fb8a7c649b82da6 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Tue, 12 Sep 2023 14:52:30 +0000 Subject: [PATCH] Bug 34730: Add responsive behavior to more tables in the OPAC This patch adds responsiveness to several DataTables which were not updated in 32341. The patch removes the CSS-based responsive styling which was previously used for these tables. This patch also adds some additional configuration to the tables on the user home page so that the title column is always prioritized when DataTables collapses columns in narrow views. To test, apply the patch and rebuild the OPAC CSS. Ideally this should be tested with a user who has checkouts, overdues, holds, tags, and a checkout history. - Log in to the OPAC and test the user summary page. Check that each table adjusts well to narrow browser widths. In each case the column containing the title should never be hidden no matter how narrow the window: - Checkouts - Relatives' checkouts (requires that the user is a guarantor for a patron with checkouts and that the guarantee's account is set up to show checkouts to the guarantor). - Overdues - Holds - Article requests The new places the responsive DataTables extension is being used: - Checkout history - Suggestions - Tags (in the table of user-submitted tags) - Most popular Again, in each case the table should be responsive and the title column should be prioritized so that it doesn't get hidden at narrow page widths. Signed-off-by: Lucas Gass Signed-off-by: Katrin Fischer Signed-off-by: Tomas Cohen Arazi (cherry picked from commit 266194321453d096a1fd1a9f80195dfb77ad5258) Signed-off-by: Fridolin Somers (cherry picked from commit ff1b7f74d666682fded9d6c923489ffc91201311) Signed-off-by: Matt Blenkinsop --- .../bootstrap/css/src/_responsive.scss | 29 ------------------- .../en/modules/opac-readingrecord.tt | 2 +- .../bootstrap/en/modules/opac-suggestions.tt | 17 +++++++++-- .../bootstrap/en/modules/opac-tags.tt | 17 +++++++++-- .../bootstrap/en/modules/opac-topissues.tt | 16 ++++++++-- .../bootstrap/en/modules/opac-user.tt | 10 +++---- 6 files changed, 47 insertions(+), 44 deletions(-) diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss index 9cb6cf3bcf..3e01384ab8 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss @@ -200,40 +200,11 @@ margin: .5em 0 0 .5em; } - .table-bordered { - border: 0; - } - .table { - width: 100%; - - th, - thead { - display: none; - } - - td { - border: 0; - display: block; - padding: .4em .3em; - } - p { margin-bottom: 2px; } } - - tr { - display: block; - - td:first-child { - border-top: 0; - } - - td:last-child { - border-bottom: 0; - } - } } .cart-actions { diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt index 0d2fabffc6..ba301339d9 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt @@ -118,7 +118,7 @@ Type - Title + Title Author Item type Call number diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt index 00bc8922e3..d423f7e282 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt @@ -401,12 +401,13 @@ [% IF ( loggedinusername ) %] [% END %] - Summary + Summary Suggested on Note [% IF Koha.Preference( 'OPACViewOthersSuggestions' ) == 1 %]Suggested for[% END %] [% IF Koha.Preference( 'OpacSuggestionManagedBy' ) %]Managed by[% END %] Status + @@ -475,6 +476,7 @@ [% ELSE %] [% AuthorisedValues.GetByCode( 'SUGGEST_STATUS', suggestion.STATUS, 1 ) | html %] [% END %] [% IF ( suggestion.reason ) %]([% suggestion.reason | html %])[% END %] + [% END # / FOREACH suggestions %] @@ -565,7 +567,9 @@ "order": [[ 1, "asc" ]], "autoWidth": false, "columnDefs": [ - [% IF ( loggedinusername ) %]{ "targets": [ 0 ], "sortable": false, "searchable": false }[% END %] + [% IF ( loggedinusername ) %]{ "targets": [ 0 ], "sortable": false, "searchable": false }[% END %], + { "className": 'dtr-control', "orderable": false, "targets": -1 }, + { responsivePriority: 1, targets: 1 } ], "columns": [ [% IF ( loggedinusername ) %]null,[% END %] @@ -574,8 +578,15 @@ null, [% IF Koha.Preference( 'OPACViewOthersSuggestions' ) == 1 %]null,[% END %] [% IF Koha.Preference( 'OpacSuggestionManagedBy' ) %]null,[% END %] + null, null - ] + ], + "responsive": { + details: { + type: 'column', + target: -1 + } + }, })); [% IF ( loggedinusername ) %]$("span.clearall").html(""+_("Clear all")+"<\/a>"); $("span.checkall").html(""+_("Select all")+"<\/a>"); diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt index 60319529e6..87e4d00045 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-tags.tt @@ -139,8 +139,9 @@   Term - Title + Title Date added + @@ -175,6 +176,7 @@ Date added: [% MY_TAG.date_created | $KohaDates %] + [% END %] [% END %] @@ -215,10 +217,19 @@ $("#mytagst").dataTable($.extend(true, {}, dataTablesDefaults, { "sorting": [[ 2, "asc" ]], + "autoWidth": false, "columnDefs": [ { "targets": [ 0 ], "sortable": false, "searchable": false }, - { "sType": "anti-the", "aTargets" : [ "anti-the" ] } - ] + { "sType": "anti-the", "aTargets" : [ "anti-the" ] }, + { "className": 'dtr-control', "orderable": false, "targets": -1 }, + { responsivePriority: 1, targets: 2 } + ], + "responsive": { + details: { + type: 'column', + target: -1 + } + }, })); }); diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-topissues.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-topissues.tt index 6c4b668be8..602633a9c6 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-topissues.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-topissues.tt @@ -87,13 +87,14 @@ - Title + Title Item type Collection Checkouts [% IF Koha.Preference( 'opacuserlogin' ) == 1 %]   [% END %] + @@ -132,6 +133,7 @@ [% END %] [% END %] + [% END %] @@ -151,11 +153,19 @@