From b1ae2ad4a03a5242c642b525fb6aea9b6abf331d Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Wed, 28 Jul 2021 19:27:34 +0000 Subject: [PATCH] Bug 14783: (follow-up) Move pickup library form into modal This patch attemps to simplify the list of holds by moving the form for changing a hold's pickup library into a modal dialog. This patch also makes minor tweaks to the CSS for the "X" close button shown in modal in windows. Instances where modal markup used "x" have been updated to use the Bootstrap 4 standard "×" To test, apply the patch and rebuild the OPAC SCSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client) - Turn on the OPACAllowUserToChangeBranch system preference. - Log in to the OPAC as a user with holds. - In the view of your holds, confirm that each hold which can be modified shows a "Change" link. - Clicking the link should show a modal window with the title of the item on hold shown in the header. - Confirm that changing the pickup location works correctly. Signed-off-by: Barbara Johnson --- .../opac-tmpl/bootstrap/css/src/_common.scss | 28 ++++++------ .../bootstrap/en/includes/holds-table.inc | 43 ++++++++++++++----- .../bootstrap/en/modules/opac-user.tt | 6 +++ koha-tmpl/opac-tmpl/bootstrap/js/global.js | 2 +- 4 files changed, 54 insertions(+), 25 deletions(-) diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss index 3820c104d7..adfcd8269d 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss @@ -943,35 +943,35 @@ ul { /* Redefine a new style for Bootstrap's class "close" since we use that already */ /* Use × */ -.modal-header .closebtn { - margin-top: 2px; -} - .closebtn { + background: transparent; + border: 0; color: #000000; + cursor: pointer; float: right; - font-size: 20px; + font-size: 1.5rem; font-weight: bold; - line-height: 20px; - opacity: .2; + line-height: 1; + opacity: .5; + padding: 1rem 1rem; + margin: -1rem -1rem -1rem auto; text-shadow: 0 1px 0 #FFFFFF; &:hover { color: #000000; cursor: pointer; - opacity: .4; + opacity: .7; text-decoration: none; } } -button { - &.closebtn { - background: transparent; - border: 0; - cursor: pointer; - padding: 0; +.ui-widget { + .closebtn { + font-size: 1.5rem; } +} +button { &.remove { &:hover { color: #900; diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/holds-table.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/holds-table.inc index 3ff4b50b77..5694461b46 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/holds-table.inc +++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/holds-table.inc @@ -84,16 +84,39 @@ [% UNLESS( singleBranchMode) %] Pick up location: + [% HOLD.branch.branchname | html %] [% IF ( HOLD.can_change_branch_opac ) %] -
- - - -
- [% ELSE %] - [% HOLD.branch.branchname | html %] + + + [% END %] [% END %] @@ -161,7 +184,7 @@ [% END %]
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt index a3f258e041..acc025771a 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt @@ -1082,6 +1082,12 @@ minDate: 1 }); + $(".change_pickup").on("click", function(){ + var hold_id = $(this).data("hold-id"); + $(this).hide(); + $("#change-pickup-location" + hold_id ).show(); + }); + if ( $('#opac-user-clubs').length ) { $('#opac-user-clubs-tab-link').on('click', function() { $('#opac-user-clubs').text(_("Loading...")); diff --git a/koha-tmpl/opac-tmpl/bootstrap/js/global.js b/koha-tmpl/opac-tmpl/bootstrap/js/global.js index 27f2874502..6602f13364 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/js/global.js +++ b/koha-tmpl/opac-tmpl/bootstrap/js/global.js @@ -84,7 +84,7 @@ function confirmModal(message, title, yes_label, no_label, callback) {
\

\ \
\

\ -- 2.25.1