From 77f0fbcce9a8e8693cdece2c4efb41966fd169c0 Mon Sep 17 00:00:00 2001
From: Lorenz Padberg <lorenz.padberg@iterativ.ch>
Date: Thu, 25 Apr 2024 15:51:08 +0200
Subject: [PATCH] Make Module teaser apear the same way as before... (important
 for images with fixed height)

---
 client/src/components/ui/WagtailImage.vue | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/client/src/components/ui/WagtailImage.vue b/client/src/components/ui/WagtailImage.vue
index d434cbe4..b039703f 100644
--- a/client/src/components/ui/WagtailImage.vue
+++ b/client/src/components/ui/WagtailImage.vue
@@ -14,7 +14,6 @@
       :style="placeholderStyle"
       v-show="!loaded"
     ></div>
-
   </div>
 </template>
 
@@ -91,7 +90,6 @@ const isHighDensity = () => {
   );
 };
 
-
 onMounted(updateDimensions);
 </script>
 
@@ -99,18 +97,18 @@ onMounted(updateDimensions);
 @import 'styles/helpers';
 
 .wagtail-image {
-    overflow: hidden;
+  overflow: hidden;
+  height: 100%;
 
   &__image {
     width: 100%;
-    //height: 100%;
-    height: auto; /* Keep the image's aspect ratio intact */
-
+    height: 100%;
+    object-fit: cover;
+    object-position: center;
   }
 
   &__placeholder {
     background-color: $color-silver-light;
-
   }
 }
 </style>