LP#1761242 Z39.50 Marc View Usability with Mobile Repsonsiveness

This patch changes the size of the image in the Z39.50 Marc View from large to
medium.  It also incorporates bootstrap's media classes to present the Marc
record and the cover image side by side.  If there is no image the marc record
display floats to the left of the modal. From a suggestion by Jane Sandbert, it
also hides the book cover image on small devices.

To test.
1. Perform a search in z39.50.  An LOC title search for "Cat in the Hat"
   returms results of titles with and without images.
2. View some of the titles in Marc View, noting the large image.
3. Apply the patch.
4. Perform the same search and view the results in Marc View.

Signed-off-by: Garry Collum <gcollum@gmail.com>
Signed-off-by: Janet Schrader <jschrader@cwmars.org>
Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>

diff --git a/Open-ILS/src/templates/staff/cat/z3950/t_marc_html.tt2 b/Open-ILS/src/templates/staff/cat/z3950/t_marc_html.tt2
index a305172..e26db07 100644 (file)
--- a/Open-ILS/src/templates/staff/cat/z3950/t_marc_html.tt2
+++ b/Open-ILS/src/templates/staff/cat/z3950/t_marc_html.tt2
@@ -5,8 +5,14 @@
     <h4 class="modal-title">[% l('View MARC') %]</h4>
   </div>
   <div class="modal-body">
-    <img ng-src="/opac/extras/ac/jacket/large/{{isbn}}"></img>
-    <eg-record-html marc-xml="{{marc_xml}}" />
+    <div class="media">
+      <div class="media-left hidden-xs">
+        <img ng-src="/opac/extras/ac/jacket/medium/{{isbn}}"></img>
+      </div>
+      <div class="media-body">
+        <eg-record-html marc-xml="{{marc_xml}}" />
+      </div>
+    </div>
   </div>
   <div class="modal-footer">
     <button class="btn btn-warning" ng-click="cancel()">[% l('Cancel') %]</button>