From ff300a5175c94492ec7638844596151aa47e4d7a Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Mon, 18 Mar 2019 17:19:00 +0000
Subject: [PATCH] Bug 22455: (follow-up) Use CSS to set a max-width for images
 - OPAC

This patch adds some CSS and markup to OPAC templates so that custom
cover images have a maximum width of 140px (to match the width of
generated local cover image thumbnails). This prevents oversized images
from displaying inconsistently compared to images from other services.

To test, apply the patch and regenerate the OPAC CSS. Post an oversized
image which corresponds to a record in your OPAC which can be added to a
user's checkouts and to a list.

View the following pages to confirm that the image displays well:

 - OPAC search results
 - Bibliographic detail page
 - Shelf browser
 - List contents
 - Recent comments
 - "Your summary"

https://bugs.koha-community.org/show_bug.cgi?id=22445
---
 koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss              | 6 ++++++
 koha-tmpl/opac-tmpl/bootstrap/en/includes/shelfbrowser.inc   | 4 +++-
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt      | 6 +++---
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-results.tt     | 4 ++--
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-shelves.tt     | 9 +++++++++
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-showreviews.tt | 2 +-
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt        | 2 +-
 7 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
index 0b26283..3f7c078 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
@@ -1171,6 +1171,12 @@ ul {
     }
 }
 
+.custom_cover_image {
+    img {
+        max-width: 140px;
+    }
+}
+
 .required {
     color: #C00;
 }
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/shelfbrowser.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/shelfbrowser.inc
index a89edbd..1ed61e5 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/shelfbrowser.inc
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/shelfbrowser.inc
@@ -62,7 +62,9 @@
                                     [% END %]
                                 [% END %]
                                 [% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]
-                                    <img alt="Cover image" src="[% item.biblio_object.custom_cover_image_url | url %]" />
+                                    <span class="custom_cover_image">
+                                        <img alt="Cover image" src="[% item.biblio_object.custom_cover_image_url | url %]" />
+                                    </span>
                                 [% END %]
 
                             </a>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
index 459b06c..6a94efa 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
@@ -99,9 +99,9 @@
                     [% END %]
                     [% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]
                          [% IF ( OPACURLOpenInNewWindow ) %]
-                            <a href="[% biblio.custom_cover_image_url | url %]" target="_blank" rel="noreferrer"><img alt="Cover image" src="[% biblio.custom_cover_image_url | url %]" /></a>
+                            <a class="custom_cover_image" href="[% biblio.custom_cover_image_url | url %]" target="_blank" rel="noreferrer"><img alt="Cover image" src="[% biblio.custom_cover_image_url | url %]" /></a>
                         [% ELSE %]
-                            <a href="[% biblio.custom_cover_image_url | url %]"><img alt="Cover image" src="[% biblio.custom_cover_image_url | url %]" /></a>
+                            <a class="custom_cover_image" href="[% biblio.custom_cover_image_url | url %]"><img alt="Cover image" src="[% biblio.custom_cover_image_url | url %]" /></a>
                         [% END %]
                     [% END %]
                     </div><!-- / #bookcover -->
@@ -974,7 +974,7 @@
                                         </a></div>
                                     [% END %]
                                 [% ELSE %]
-                                    <div id="addcomment"><a href="/cgi-bin/koha/opac-user.pl">Log in to your account</a> to post a comment.</div>
+                                    <div id="addcomment"><a class="login-link loginModal-trigger" role="button" data-toggle="modal" href="/cgi-bin/koha/opac-user.pl">Log in to your account</a> to post a comment.</div>
                                 [% END # / IF loggedinusername %]
                             </div> <!-- / #comments -->
                         [% END # / IF reviewson %]
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-results.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-results.tt
index e922076..6e8ae44 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-results.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-results.tt
@@ -312,9 +312,9 @@
 
                                                     [% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]
                                                          [% IF ( OPACURLOpenInNewWindow ) %]
-                                                            <a href="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]" target="_blank" rel="noreferrer"><img alt="Cover image" src="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]" /></a>
+                                                            <a class="custom_cover_image" href="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]" target="_blank" rel="noreferrer"><img alt="Cover image" src="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]" /></a>
                                                         [% ELSE %]
-                                                            <a href="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]"><img alt="Cover image" src="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]" /></a>
+                                                            <a class="custom_cover_image" href="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]"><img alt="Cover image" src="[% SEARCH_RESULT.biblio_object.custom_cover_image_url | url %]" /></a>
                                                         [% END %]
                                                     [% END %]
 
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-shelves.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-shelves.tt
index e0f6ccc..0d0eb94 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-shelves.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-shelves.tt
@@ -360,6 +360,15 @@
                                                         [% END %]
 
                                                         [% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]
+                                                            [% IF ( itemsloo.BiblioDefaultViewmarc ) %]
+                                                                <a class="custom_cover_image" href="/cgi-bin/koha/opac-MARCdetail.pl?biblionumber=[% itemsloo.biblionumber |url %]">
+                                                            [% ELSE %]
+                                                                [% IF ( itemsloo.BiblioDefaultViewisbd ) %]
+                                                                    <a class="custom_cover_image" href="/cgi-bin/koha/opac-ISBDdetail.pl?biblionumber=[% itemsloo.biblionumber |url %]">
+                                                                [% ELSE %]
+                                                                    <a class="custom_cover_image" href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% itemsloo.biblionumber |url %]">
+                                                                [% END %]
+                                                            [% END %]
                                                             <img alt="Cover image" src="[% itemsloo.biblio_object.custom_cover_image_url | url %]" /></a>
                                                         [% END %]
 
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-showreviews.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-showreviews.tt
index 21b6d0a..b25e0a4 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-showreviews.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-showreviews.tt
@@ -150,7 +150,7 @@
                                         [% END %]
 
                                         [% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]
-                                            <a href="[% review.biblio_object.custom_cover_image_url | url %]"><img alt="Cover image" src="[% review.biblio_object.custom_cover_image_url | url %]" /></a>
+                                            <a class="custom_cover_image" href="[% review.biblio_object.custom_cover_image_url | url %]"><img alt="Cover image" src="[% review.biblio_object.custom_cover_image_url | url %]" /></a>
                                         [% END %]
 
                                     </td>
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 1cf99b5..31ac438 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
@@ -243,7 +243,7 @@
                                                     [% END %]
 
                                                     [% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]
-                                                        <a href="[% ISSUE.biblio_object.custom_cover_image_url | url %]"><img alt="Cover image" src="[% ISSUE.biblio_object.custom_cover_image_url | url %]" /></a>
+                                                        <a class="custom_cover_image" href="[% ISSUE.biblio_object.custom_cover_image_url | url %]"><img alt="Cover image" src="[% ISSUE.biblio_object.custom_cover_image_url | url %]" /></a>
                                                     [% END %]
 
                                                     [% IF ( SyndeticsEnabled && SyndeticsCoverImages ) %]
-- 
2.1.4