Window: better layout for images

2 files changed, 10 insertions, 1 deletions

diff --git a/ishtar_common/templates/ishtar/blocks/window_image.html b/ishtar_common/templates/ishtar/blocks/window_image.html
index 62623e89d..66e6a9e2f 100644
--- a/ishtar_common/templates/ishtar/blocks/window_image.html
+++ b/ishtar_common/templates/ishtar/blocks/window_image.html
@@ -25,7 +25,7 @@
 <div id="lightgallery-{{window_id}}">
     {% if item.main_image %}{% with image=item.main_image %}
     <a data-sub-html="#lightgallery-{{window_id}}-caption-0"
-       href="{{image.image.url}}">
+       href="{{image.image.url}}" class="window-main-image">
         <img class='card-img-top' src="{{BASE_URL}}{{image.thumbnail.url}}">
     </a>
     {% endwith %}{% endif %}
diff --git a/scss/custom.scss b/scss/custom.scss
index 5b5bb0a9d..c074656fc 100644
--- a/scss/custom.scss
+++ b/scss/custom.scss
@@ -554,12 +554,21 @@ ul.compact{
     width: 200px;
 }
 
+.window-main-image {
+    height:300px;
+    display: block;
+}
+
 .thumb-image{
     height: 200px;
+}
+
+.window-main-image, .thumb-image{
     position: relative;
     overflow: hidden;
 }
 
+.window-main-image img,
 .thumb-image img{
     display: inline-block;
     max-width: 100%;