Put the image name in the alt attribute in the thumbnail on the met…

…adata page. (#8290)

This commit adds the `<img>` in the `alt` attribute when there is a name, otherwise a default string is used.

The image name used to be the caption underneath the thumbnail, but is now removed

Extra: the `max-height` is increased in order to have the full width of the image.

web-ui/src/main/resources/catalog/views/default/less/gn_result_default.less

@@ -147,7 +147,7 @@
     .img-thumbnail {
       padding: 0;
       border: none;
-      max-height: 300px;
+      max-height: 500px;
       min-height: 150px;
       max-width: 100%;
     }

web-ui/src/main/resources/catalog/views/default/templates/recordView/thumbnails.html

@@ -1,13 +1,22 @@
 <ul class="gn-thumbnails" data-ng-if="mdView.current.record.overview.length > 0">
   <li data-ng-repeat="img in mdView.current.record.overview">
     <img
+      data-ng-if="img.name"
       data-gn-img-modal="img"
       class="img-thumbnail"
-      alt="{{'overview' | translate}}"
+      alt="{{img.name}}"
       title="{{img.name}}"
       data-ng-src="{{mdView.current.record.draft === 'y'? img.url + (img.url.indexOf('?') > 0 ? '&' : '?') + 'approved=false' : img.url}}"
       onerror="this.onerror=null; this.parentElement.style.display='none';"
     />
-    <p class="text-center" data-ng-if="img.name != ''">{{img.name}}</p>
+    <img
+      data-ng-if="!img.name"
+      data-gn-img-modal="img"
+      class="img-thumbnail"
+      alt="{{'overview' | translate}}"
+      title="{{'overview' | translate}}"
+      data-ng-src="{{mdView.current.record.draft === 'y'? img.url + (img.url.indexOf('?') > 0 ? '&' : '?') + 'approved=false' : img.url}}"
+      onerror="this.onerror=null; this.parentElement.style.display='none';"
+    />
   </li>
 </ul>