openeuropa / bootstrap-component-library

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

[bcl-gallery] Several issues found #473

Closed vengador closed 1 year ago

vengador commented 2 years ago

While I was working on a paragraph integration with Media gallery pattern I have found several things that I think could be issues:

  1. I think Items parameters are wrong. By example:

    • caption_classes: is not used
    • thumbnails: should be thumbnail and it can't be an string because it shouldn't be rendered properly. I have had to use a render array from Drupal instead.
    • media: if an string is passed, it is not rendered properly. I have had to use a render array from Drupal instead.
  2. Because we can't put an string as thumbnail/media, video detection is not working properly in several places across the twig template. Also, for carousel items, is correct media type detection done for caption/image here? For caption you try to detect iframe/video tag and for image iframe/img.

  3. Media gallery works properly for 10 items but if you add 11 or more items, you will see that styling for 11th and other items are wrong.

Please, let me know if I would need to clarify some of this points more or if you need more info about them.

tibi2303 commented 2 years ago

Good day, thanks for pointing out this issues, we are working on them but please can you clarify number 2?

vengador commented 2 years ago

About point 2, for every item I have tried to send one string (image or video code) as it is suggested in comments for thumbnail/media parameters and they are rendered as simple strings. Those parameters are properly rendered only if they are send as render arrays from Drupal. In Twig of bcl-gallery we have some code to detect if media is a video or not, and in case it is a video show triangle icon but those pieces of code are not working properly when parameters are render arrays.

tibi2303 commented 2 years ago

Thanks, I pushed now the fix, feel free to have a look and add comments if needed