search

openeuropa / bootstrap-component-library

Openeuropa Bootstrap Component Library
https://oelibrary.netlify.app/
MIT License
14 stars 9 forks source link

OEL-2771 : Gallery : Image fit #564

Closed julien- closed 2 months ago

julien- commented 9 months ago

OE Showcase uses ideal original 4:3 images but it is not reality. Sample : in this page

diff --git a/src/themes/default/src/scss/_gallery.scss b/src/themes/default/src/scss/_gallery.scss
index f4b915a5..7155757f 100644
--- a/src/themes/default/src/scss/_gallery.scss
+++ b/src/themes/default/src/scss/_gallery.scss
@@ -13,6 +13,11 @@
   .bcl-gallery__item {
     position: relative;
     cursor: pointer;
+    height: 100%;
+
+    img {
+      object-fit: cover;
+    }
   }

   .bcl-gallery__item-overlay {

image AFTER uses this image

brummbar commented 2 months ago

The image passed to the gallery should be in format 4:3. From Drupal, formatters can be used to achieve it.