stack/src/components/items/gallery-slide-item/gallery-slide-item.twig line 1

Open in your IDE?
  1. {%- set class_name = [
  2.   "i-gallery-slide",
  3.   "u-posr",
  4. ]|join(' ')|trim -%}
  6. {%- set attrs = [
  7.   'class="' ~ class_name ~ '"',
  8. ] -%}
  10. {%- set attrs = attrs|join(' ')|trim -%}
  12. {% if props.size == "large" %}
  13.   {%- set tag = "button" -%}
  15. {% else %}
  16.   {%- set tag =  "a" -%}
  17. {% endif %}
  19. {% set img = props.size == "large" ? props.large_img : props.img %}
  21. {%- set item_class_name = [
  22.   "i-gallery-slide__link",
  23.   "d-block",
  24. ]|join(' ')|trim -%}
  26. {%- set item_attrs = [
  27.   'class="' ~ item_class_name ~ '"',
  28. ] -%}
  30. {%- if tag == "button" %}
  31.   {%- set item_attrs = item_attrs|merge(['type="button"']) -%}
  32. {%- endif -%}
  34. {%- if tag == "a" %}
  35.   {%- set item_attrs = item_attrs|merge(['data-fancybox="' ~ props.img.data_fancybox ~ '"']) -%}
  36. {%- endif -%}
  38. {% if tag == "a" and props.img.href %}
  39.   {%- set item_attrs = item_attrs|merge(['href="' ~ props.img.href ~ '"']) -%}
  40. {% endif %}
  42. {% if tag == "a" and not props.img.href %}
  43.   {%- set item_attrs = item_attrs|merge(['href="' ~ base_path ~ "images/content/placeholder.png" ~ '"']) -%}
  44. {% endif %}
  47. {%- set item_attrs = item_attrs|join(' ')|trim -%}
  49. {% set img_props = {
  50.   objectfit: "contain",
  51.   alt: props.img.alt|default(props.title),
  52.   is_placeholder: false,
  53.   ratio:"1-1",
  54.   native_lazyload: true,
  55. } %}
  57. <div {{ attrs|raw }}>
  58.   <div class="i-gallery-slide__image">
  60.     <{{tag}} {{ item_attrs|raw }}>
  61.       {% if img %}
  62.         {% include "@Components/img/img.twig" with {props: img|merge(img_props)} %}
  63.       {% else %}
  64.         {% include "@Components/img/img.twig" with {props: img_props|merge({
  65.           src: base_path ~ "images/content/placeholder.png",
  66.         })} %}
  67.       {% endif %}
  68.     </{{tag}}>
  70.     {% if props.tag and props.size == "large" %}
  71.       {% include "@Components/items/tag-item/tag-item.twig" with {props: {
  72.         title: props.tag.title,
  73.         size: "sm-base",
  74.         variant: "product",
  75.         extra_class: "i-gallery-slide__tag u-posa"
  76.       }} %}
  77.     {% endif %}
  78.   </div>
  79. </div>