Bug 22445: (follow-up) Use CSS to set a max-width for images - Staff client

This patch adds some CSS and markup to staff client 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.

This patch also adds a missing </a> to fix display problems.

To test, apply the patch and regenerate the staff client CSS. Post an
oversized image which corresponds to a record in your catalog.

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

 - Catalog search results
 - Bibliographic detail page

Sponsored-by: Orex Digital
Signed-off-by: Hayley Mapley <hayleymapley@catalyst.net.nz>
Signed-off-by: Hugo Agud <hagud@orex.es>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Signed-off-by: Michal Denar <black23@gmail.com>
Signed-off-by: Kyle Hall <kyle@bywatersolutions.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
This commit is contained in:
Owen Leonard 2019-03-18 17:44:30 +00:00 committed by Martin Renvoize
parent 538ca0fb4c
commit 8c858f50a8
Signed by: martin.renvoize
GPG key ID: 422B469130441A0F
3 changed files with 8 additions and 2 deletions

View file

@ -2094,6 +2094,12 @@ li {
text-align: center;
}
.custom_cover_image {
img {
max-width: 140px;
}
}
.searchhighlightblob {
font-size: 75%;
font-style: italic;

View file

@ -155,7 +155,7 @@
[% END %]
[% IF Koha.Preference('CustomCoverImages') && Koha.Preference('CustomCoverImagesURL') %]
<a href="[% biblio.custom_cover_image_url | url %]"><img alt="Cover image" src="[% biblio.custom_cover_image_url | url %]" />
<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 %]

View file

@ -418,7 +418,7 @@
[% END %]
[% IF Koha.Preference('CustomCoverImages') && Koha.Preference('CustomCoverImagesURL') %]
<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 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 %]" />
[% END %]
</td>
[% END # /IF( AmazonCoverImages || LocalCoverImages || AdlibrisEnabled || IntranetCoce )%]