@openeuropa/bcl-theme-default 0.4230.202512021730 → 0.4360.202601141610

package/templates/bcl-listing/listing.html.twig

@@ -14,7 +14,7 @@
   - attributes (drupal attrs)
 #}
 
-{% set _title = title|default('') %}
+{%- set _title = title|default('') %}
 {% set _title_tag = title_tag|default('h2') %}
 {% set _title_link = title_link|default({}) %}
 {% set _title_attributes = title_attributes ?: create_attribute() %}
@@ -24,7 +24,7 @@
 {% set _alignment = alignment|default('') %}
 {% set _image_size = image_size|default('') %}
 
-{% set _classes = ['bcl-listing', 'bcl-listing--' ~ _variant] %}
+{%- set _classes = ['bcl-listing', 'bcl-listing--' ~ _variant] %}
 {% set _cards = [] %}
 {% set _card_layout = {
   type: 'grid',
@@ -33,16 +33,16 @@
   attributes: create_attribute(),
 } %}
 
-{% if attributes is empty %}
-  {% set attributes = create_attribute() %}
+{%- if attributes is empty %}
+  {%- set attributes = create_attribute() %}
 {% endif %}
 
-{% set attributes = attributes.addClass(_classes) %}
+{%- set attributes = attributes.addClass(_classes) -%}
 
 <div {{ attributes }}>
 
-{% if _title is not empty %}
-  {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+{%- if _title is not empty %}
+  {%- include '@oe-bcl/bcl-heading/heading.html.twig' with {
     title: _title,
     title_tag: _title_tag,
     title_link: _title_link,
@@ -50,37 +50,37 @@
   } only %}
 {% endif %}
 
-{% if _items is not empty %}
-  {% for _card in _items %}
-    {% set  _alignment_class = '' %}
-    {% set _image_classes = _card.image.classes ?: '' %}
-    {% set _start_col_classes = 'bcl-card-start-col mb-3 mb-lg-0' %}
-    {% set _end_col_classes = 'col-12 col-md' %}
-    {% if _image_size is not empty %}
-      {% set _start_col_classes = _start_col_classes ~ ' bcl-size-' ~ _image_size %}
-    {% endif %}
-    {% if 'd-none' in _image_classes %}
-      {% set _start_col_classes = _start_col_classes ~ ' d-none d-md-block' %}
-    {% endif %}
-    {% if _alignment is not empty %}
-      {% set _alignment_class = ' align-self-' ~ _alignment %}
-    {% endif %}
-    {% set _card_classes = [] %}
-    {% set _card_attributes = card.attributes ? card.attributes : create_attribute() %}
-    {% set _card_title_attributes = card.title_attributes ? card.title_attributes : create_attribute() %}
-    {% set _card = _card|merge({
-      title_attributes: _card_title_attributes.addClass(['fs-5'])
+{%- if _items is not empty %}
+  {%- for _card in _items %}
+    {%- set  _alignment_class = '' %}
+    {%- set _image_classes = _card.image.classes ?: '' %}
+    {%- set _start_col_classes = 'bcl-card-start-col mb-3 mb-lg-0' %}
+    {%- set _end_col_classes = 'col-12 col-md' %}
+    {%- if _image_size is not empty %}
+      {%- set _start_col_classes = _start_col_classes ~ ' bcl-size-' ~ _image_size %}
+    {%- endif %}
+    {%- if 'd-none' in _image_classes %}
+      {%- set _start_col_classes = _start_col_classes ~ ' d-none d-md-block' %}
+    {%- endif %}
+    {%- if _alignment is not empty %}
+      {%- set _alignment_class = ' align-self-' ~ _alignment %}
+    {%- endif %}
+    {%- set _card_classes = [] %}
+    {%- set _card_attributes = card.attributes ? card.attributes : create_attribute() %}
+    {%- set _card_title_attributes = card.title_attributes ? card.title_attributes : create_attribute() %}
+    {%- set _card = _card|merge({
+      title_attributes: _card_title_attributes.addClass(['h5'])
     }) %}
 
-    {% if _variant == 'default-1-col' or _variant == 'default-2-col' or _variant == 'default-3-col'  %}
-      {% set _card_classes = [
+    {%- if _variant == 'default-1-col' or _variant == 'default-2-col' or _variant == 'default-3-col' %}
+      {%- set _card_classes = [
         'listing-item',
         'border-bottom',
         'border-md-0',
         'border-0',
       ] %}
-      {% set _card_attributes = _card_attributes.addClass(_card_classes) %}
-      {% set _card = _card|merge({
+      {%- set _card_attributes = _card_attributes.addClass(_card_classes) %}
+      {%- set _card = _card|merge({
         horizontal: true,
         extra_classes_body: 'p-0 pb-md-0 pb-3',
         attributes: _card_attributes,
@@ -89,108 +89,108 @@
           right_col_classes: _end_col_classes ~ _alignment_class,
         }
       }) %}
-    
-      {% if _variant == 'default-2-col' %}
-        {% set _card_layout = _card_layout|merge({
+
+      {%- if _variant == 'default-2-col' %}
+        {%- set _card_layout = _card_layout|merge({
           responsive_columns: 2,
         }) %}
-      {% elseif _variant == 'default-3-col' %}
-        {% set _card_layout = _card_layout|merge({
+      {%- elseif _variant == 'default-3-col' %}
+        {%- set _card_layout = _card_layout|merge({
           attributes: _card_layout.attributes.addClass(['row-cols-md-2']),
           responsive_columns: 3,
           responsiveness: 'xl',
         }) %}
-      {% endif %}
-    {% endif %}
+      {%- endif %}
+    {%- endif %}
 
-    {% if _variant == 'highlight-1-col' %}
-      {% set _card_classes = [
+    {%- if _variant == 'highlight-1-col' %}
+      {%- set _card_classes = [
         'listing-item--highlight',
         'border-0',
         'bg-lighter'
       ] %}
-     {% set _card_attributes = _card_attributes.addClass(_card_classes) %}
-     {% set _card = _card|merge({
+     {%- set _card_attributes = _card_attributes.addClass(_card_classes) %}
+     {%- set _card = _card|merge({
          wrapper_class: 'col',
          attributes: _card_attributes,
       }) %}
-      {% if _card.image is defined and _card.image is not empty %}
-        {% set _card = _card|merge({
+      {%- if _card.image is defined and _card.image is not empty %}
+        {%- set _card = _card|merge({
           extra_classes_body: "pt-0",
         }) %}
-      {% endif %}
-      {% set _card_layout = _card_layout|merge({
+      {%- endif %}
+      {%- set _card_layout = _card_layout|merge({
         cols_extra_classes: 'mt-4-5',
       }) %}
-      {% if _card.image is not empty %}
-        {% set _image_classes = _card.image.classes ?: '' %}
-        {% if not _alignment == 'center' %}
-          {% set _image_classes = _image_classes ? _image_classes ~ ' mb-3' : 'mb-3' %}
-        {% endif %}
-        {% set _card = _card|merge({image: _card.image|merge({
+      {%- if _card.image is not empty %}
+        {%- set _image_classes = _card.image.classes ?: '' %}
+        {%- if not _alignment == 'center' %}
+          {%- set _image_classes = _image_classes ? _image_classes ~ ' mb-3' : 'mb-3' %}
+        {%- endif %}
+        {%- set _card = _card|merge({image: _card.image|merge({
           classes: _image_classes,
         })}) %}
-      {% endif %}
+      {%- endif %}
 
-    {% endif %}
+    {%- endif %}
 
-    {% if _variant == 'highlight-2-col' or variant == 'highlight-3-col' %}
-      {% set _card_classes  = [
+    {%- if _variant == 'highlight-2-col' or variant == 'highlight-3-col' %}
+      {%- set _card_classes  = [
         'listing-item--highlight',
         'border-0',
         'bg-lighter',
         'h-100',
         'rounded-2'
       ] %}
-      {% set _card_attributes = _card_attributes.addClass(_card_classes) %}
-      {% set _card = _card|merge({
+      {%- set _card_attributes = _card_attributes.addClass(_card_classes) %}
+      {%- set _card = _card|merge({
         wrapper_class: 'col',
         attributes: _card_attributes,
       }) %}
-      {% if _card.image is defined and _card.image is not empty %}
-        {% set _card = _card|merge({
+      {%- if _card.image is defined and _card.image is not empty %}
+        {%- set _card = _card|merge({
           extra_classes_body: 'pt-0',
         }) %}
-      {% endif %}
-      {% if _card.image is not empty %}
-        {% set _image_classes = _card.image.classes ?: '' %}
-        {% if not _alignment == 'center' %}
-          {% set _image_classes = _image_classes ? _image_classes ~ ' mb-3' : 'mb-3' %}
-        {% endif %}
-        {% set _card = _card|merge({image: _card.image|merge({
+      {%- endif %}
+      {%- if _card.image is not empty %}
+        {%- set _image_classes = _card.image.classes ?: '' %}
+        {%- if not _alignment == 'center' %}
+          {%- set _image_classes = _image_classes ? _image_classes ~ ' mb-3' : 'mb-3' %}
+        {%- endif %}
+        {%- set _card = _card|merge({image: _card.image|merge({
           classes: _image_classes,
         })}) %}
-      {% endif %}
-      {% set _card_layout = _card_layout|merge({ gutter: '4' }) %}
-      {% if variant == 'highlight-2-col' %}
-        {% set _card_layout = _card_layout|merge({ responsive_columns: 2 }) %}
-      {% else %}
-        {% set _card_layout = _card_layout|merge({ responsive_columns: 3 }) %}
-      {% endif %}
-    {% endif %}
-
-    {% if _card.image is empty and _card.date is empty %}
-      {% set _card = _card|merge({
+      {%- endif %}
+      {%- set _card_layout = _card_layout|merge({ gutter: '4' }) %}
+      {%- if variant == 'highlight-2-col' %}
+        {%- set _card_layout = _card_layout|merge({ responsive_columns: 2 }) %}
+      {%- else %}
+        {%- set _card_layout = _card_layout|merge({ responsive_columns: 3 }) %}
+      {%- endif %}
+    {%- endif %}
+
+    {%- if _card.image is empty and _card.date is empty %}
+      {%- set _card = _card|merge({
         horizontal: false,
       }) %}
-    {% endif %}
+    {%- endif %}
 
-    {% set _cards = _cards|merge([_card]) %}
-  {% endfor %}
+    {%- set _cards = _cards|merge([_card]) %}
+  {%- endfor %}
 {% endif %}
 
-  {% include "@oe-bcl/bcl-card-layout/card-layout.html.twig" with _card_layout|merge({ items: _cards }) only %}
+  {%- include "@oe-bcl/bcl-card-layout/card-layout.html.twig" with _card_layout|merge({ items: _cards }) only %}
 
-{% if _link is not empty %}
-  {% set _link_attributes = _link.attributes ? _link.attributes : create_attribute() %}
-  {% set _link_attributes = _link_attributes.addClass(['mt-3-5', 'd-inline-block']) %}
-  {% include '@oe-bcl/bcl-link/link.html.twig' with _link|merge({
+{%- if _link is not empty %}
+  {%- set _link_attributes = _link.attributes ? _link.attributes : create_attribute() %}
+  {%- set _link_attributes = _link_attributes.addClass(['mt-3-5', 'd-inline-block']) %}
+  {%- include '@oe-bcl/bcl-link/link.html.twig' with _link|merge({
     attributes: _link_attributes,
     icon: _link.icon|merge({
       name: 'chevron-right',
       size: 'xs',
     }),
   }) only %}
-{% endif %}
+{% endif -%}
 </div>
-
+{#--#}

package/templates/bcl-mega-menu/mega-menu-items.html.twig

@@ -2,31 +2,31 @@
 {% set _items = items ?? [] %}
 {% set _icon_path = icon_path ?? '' %}
 {% set _level = level ?? 1 %}
-{% set _see_all = see_all ?? null %}
+{% set _see_all = see_all ?? null -%}
 
 <ul class="bcl-mega-menu__items __level-{{ _level }}">
-  {% for _item in _items %}
-    {% set _li_attributes = _item.li_attributes ?? create_attribute() %}
-    {% if _item.items is defined and _item.items is not empty %}
-      {# This is a parent item. #}
+  {%- for _item in _items %}
+    {%- set _li_attributes = _item.li_attributes ?? create_attribute() %}
+    {%- if _item.items is defined and _item.items is not empty %}
+      {#- This is a parent item. -#}
       <li{{ _li_attributes.addClass('__parent') }}>
-        {% include '@oe-bcl/bcl-mega-menu/mega-menu-submenu.html.twig' with _item|merge({
+        {%- include '@oe-bcl/bcl-mega-menu/mega-menu-submenu.html.twig' with _item|merge({
           icon_path: _icon_path,
           level: _level + 1,
-        }) only %}
+        }) only -%}
       </li>
-    {% else %}
-      {# This is a leaf item. #}
+    {%- else %}
+      {#- This is a leaf item. -#}
       <li{{ _li_attributes.addClass('__leaf') }}>
-        {% if _item.path is empty %}
-          {# This is a nolink item. #}
+        {%- if _item.path is empty %}
+          {#- This is a nolink item. -#}
           <span{{ _item.attributes ?? '' }}>{{ _item.label }}</span>
-        {% else %}
-          {# This is a link. #}
-          {% include '@oe-bcl/bcl-link/link.html.twig' with _item only %}
-        {% endif %}
+        {%- else %}
+          {#- This is a link. #}
+          {%- include '@oe-bcl/bcl-link/link.html.twig' with _item only %}
+        {%- endif -%}
       </li>
-    {% endif %}
-  {% endfor %}
+    {%- endif %}
+  {%- endfor -%}
 </ul>
-
+{#--#}

package/templates/bcl-mega-menu/mega-menu-submenu.html.twig

@@ -4,10 +4,10 @@
 {% set _level = level ?? 2 %}
 {% set _see_all = see_all ?? null %}
 
-{% set _trigger_id = _trigger.id|default('mm-trigger-' ~ random(10000)) %}
+{%- set _trigger_id = _trigger.id|default('mm-trigger-' ~ random(10000)) %}
 {% set _panel_id = 'mm-panel-' ~ _trigger_id %}
 
-{% set _trigger_attributes = _trigger.attributes ?? create_attribute() %}
+{%- set _trigger_attributes = _trigger.attributes ?? create_attribute() %}
 {% set _trigger = _trigger|merge({
   attributes: _trigger_attributes
     .setAttribute('id', _trigger_id)
@@ -19,26 +19,24 @@
 }) %}
 {% include '@oe-bcl/bcl-button/button.html.twig' with _trigger only %}
 
-{# Add an optional "See all" link as last item. #}
+{%- set _see_all_link = null %}
+{# Prepare an optional "See all" link rendered outside the list. #}
 {% if _see_all is not empty %}
-  {# Wrap the label for an ellipsis. #}
-  {% set _see_all_label %}
+  {%- set _see_all_label -%}
     <span>{{- _see_all.label -}}</span>
-  {% endset %}
-  {% set _see_all_attr = (_see_all.attributes is defined ? _see_all.attributes : create_attribute()) %}
-  {% set _see_all = _see_all|merge({
+  {%- endset %}
+  {%- set _see_all_attr = (_see_all.attributes is defined ? _see_all.attributes : create_attribute()) %}
+  {%- set _see_all_link = _see_all|merge({
     label: _see_all_label,
     icon: {
+      size: 'xs',
       name: 'arrow-right',
       path: _icon_path,
     },
-    li_attributes: create_attribute()
-      .addClass('__see_all'),
     attributes: _see_all_attr
       .addClass(['see-all-button'])
       .setAttribute('aria-label', 'See all items in ‘' ~ _trigger.label ~ '’')
   }) %}
-  {% set _items = _items|merge([_see_all]) %}
 {% endif %}
 {% set submenu_attributes = create_attribute()
   .setAttribute('id', _panel_id)
@@ -46,17 +44,24 @@
   .setAttribute('role', 'group')
   .setAttribute('aria-labelledby', _trigger_id)
   .addClass('bcl-mega-menu__submenu', '__level-' ~ _level)
-%}
+-%}
 <div{{ submenu_attributes }}>
-  {% if _trigger %}
-  <div class="__header">
-      <p class="__label">{{ _trigger.label }}</p>
+  {%- if _trigger -%}
+  <div class="__header">{# -#}
+      <p class="__label">{{ _trigger.label }}</p>{# -#}
+  </div>
+  {%- endif %}
+  <div class="__submenu_body">
+    {%- include '@oe-bcl/bcl-mega-menu/mega-menu-items.html.twig' with {
+      items: _items,
+      icon_path: _icon_path,
+      level: _level,
+    } only -%}
+    {%- if _see_all_link -%}
+      <div class="__see_all">
+        {% include '@oe-bcl/bcl-link/link.html.twig' with _see_all_link only %}
+      </div>
+    {%- endif -%}
   </div>
-  {% endif %}
-  {% include '@oe-bcl/bcl-mega-menu/mega-menu-items.html.twig' with {
-    items: _items,
-    icon_path: _icon_path,
-    level: _level,
-  } only %}
 </div>
-
+{#--#}

package/templates/bcl-mega-menu/mega-menu.html.twig

@@ -17,7 +17,7 @@
   - icon_path (string) (default: '')
 #}
 
-{% set _id = id|default('dropdown-' ~ random(1000)) %}
+{%- set _id = id|default('dropdown-' ~ random(1000)) %}
 {% set _link = link ?? false %}
 {% set _trigger = trigger|default({}) %}
 {% set _content_block = content_block|default('') %}
@@ -28,16 +28,16 @@
 {% set _icon_path = icon_path|default('') %}
 {% set _menu_id = 'mega-menu-' ~ _id %}
 
-{% if attributes is empty %}
-  {% set attributes = create_attribute() %}
+{%- if attributes is empty %}
+  {%- set attributes = create_attribute() %}
 {% endif %}
 
-{% set _classes = ['bcl-mega-menu'] %}
+{%- set _classes = ['bcl-mega-menu'] %}
 
-{% set attributes = attributes.addClass(_classes) %}
+{%- set attributes = attributes.addClass(_classes) %}
 
-{% if _trigger.attributes is empty %}
-  {% set _trigger = _trigger|merge({
+{%- if _trigger.attributes is empty %}
+  {%- set _trigger = _trigger|merge({
     attributes: create_attribute()
   }) %}
 {% endif %}
@@ -49,19 +49,19 @@
                       .setAttribute('data-bs-toggle', 'dropdown')
                       .setAttribute('data-bs-auto-close', 'outside')
                       .setAttribute('id', _id)
-}) %}
+}) -%}
 
 <div {{ attributes }}>
-  {% include '@oe-bcl/bcl-button/button.html.twig' with _trigger|merge({
+  {%- include '@oe-bcl/bcl-button/button.html.twig' with _trigger|merge({
     variant: 'link',
     clean_class: true,
   }) only %}
-  {# Mega menu panel. #}
-  <nav id="{{ _menu_id }}" class="bcl-mega-menu__container dropdown-menu" aria-labelledby="{{ _id }}" aria-label="Main mega menu">
+  {#- Mega menu panel. -#}
+  <nav id="{{ _menu_id }}" class="bcl-mega-menu__container dropdown-menu" aria-labelledby="{{ _id }}" aria-label="Main mega menu">{# -#}
     <div class="container">
-      {# Mobile back button. #}
+      {#- Mobile back button. -#}
       <div class="container d-lg-none bcl-mega-menu__back-button-block">
-        {% include '@oe-bcl/bcl-button/button.html.twig' with {
+        {%- include '@oe-bcl/bcl-button/button.html.twig' with {
           label: _back_button_label,
           icon_position: "before",
           variant: 'link',
@@ -70,20 +70,20 @@
             name: "arrow-left",
           },
           attributes: create_attribute().addClass(['back-button']).setAttribute('aria-label', 'Back to main menu')
-        } only %}
+        } only -%}
       </div>
-      {# Info/summary and submenu columns. #}
-      <div class="position-relative">
+      {#- Info/summary and submenu columns. -#}
+      <div class="position-relative">{# -#}
         <div class="row">
-          {# Content / summary column. #}
-          {% if content_block is defined %}
-            <div class="col-md-12 col-xl-3 position-relative bcl-mega-menu__info">
+          {#- Content / summary column. #}
+          {%- if content_block is defined -%}
+            <div class="col-md-12 col-xl-3 position-relative bcl-mega-menu__info">{# -#}
               <div class="content-block">
                 {%- block content_block -%}
                   {{ _content_block }}
                 {%- endblock -%}
                 {% if _content_link.path is not empty %}
-                  {% set _content_link = _content_link|merge({
+                  {%- set _content_link = _content_link|merge({
                     icon: _content_link.icon|default({})|merge({
                       path: _icon_path
                     }),
@@ -91,22 +91,24 @@
                       ? _content_link.attributes
                       : create_attribute()
                     ).addClass('content-link')
-                  }) %}
+                  }) -%}
                   <p class="m-0">{% include '@oe-bcl/bcl-link/link.html.twig' with _content_link only %}</p>
-                {% endif %}
-              </div>
-              <div class="shadow-container">
-                <span class="shadow-bg"></span>
-              </div>
+                {%- endif -%}
+              </div>{# -#}
+              <div class="shadow-container">{# -#}
+                <span class="shadow-bg"></span>{# -#}
+              </div>{# -#}
             </div>
-          {% endif %}
-          {# Submenu column. #}
+          {%- endif %}
+          {#- Submenu column. -#}
           <div class="col-md-12 col-lg-4 col-xl-3 bcl-mega-menu__menu">
-            {% include '@oe-bcl/bcl-mega-menu/mega-menu-items.html.twig' %}
-          </div>
-        </div>
-      </div>
-    </div>
-  </nav>
+            <div class="__submenu_body">
+              {% include '@oe-bcl/bcl-mega-menu/mega-menu-items.html.twig' %}
+            </div>{# -#}
+          </div>{# -#}
+        </div>{# -#}
+      </div>{# -#}
+    </div>{# -#}
+  </nav>{# -#}
 </div>
-
+{#--#}

package/templates/bcl-modal/modal.html.twig

@@ -24,7 +24,7 @@
     - footer
 #}
 
-{% set _size =  size|default('') %}
+{%- set _size =  size|default('') %}
 {% set _id = id|default('modal-' ~ random(10000)) %}
 {% set _fullscreen_responsive =  fullscreen_responsive|default('') %}
 {% set _static_backdrop = static_backdrop ?? false %}
@@ -38,13 +38,13 @@
 {% set _footer = footer|default('') %}
 {% set _footer_attributes = footer_attributes ?: create_attribute() %}
 
-{% set _classes = ['modal', 'fade'] %}
+{%- set _classes = ['modal', 'fade'] %}
 
-{% if attributes is empty %}
-  {% set attributes = create_attribute() %}
+{%- if attributes is empty %}
+  {%- set attributes = create_attribute() %}
 {% endif %}
 
-{% set attributes = attributes
+{%- set attributes = attributes
                     .setAttribute('id', _id)
                     .setAttribute('tabindex', '-1')
                     .setAttribute('aria-hidden', 'true')
@@ -52,41 +52,41 @@
                     .addClass(_classes)
 %}
 
-{% if _static_backdrop %}
-  {% set attributes = attributes.setAttribute('data-bs-backdrop', 'static') %}
-{% endif %}
+{%- if _static_backdrop %}
+  {%- set attributes = attributes.setAttribute('data-bs-backdrop', 'static') %}
+{% endif -%}
 
 <div
   {{ attributes }}
->
+>{# -#}
   <div class="modal-dialog
   {{- _size ? ' modal-' ~ size -}}
   {{- _fullscreen_responsive ? ' modal-fullscreen-' ~ _fullscreen_responsive ~ '-down' -}}
   {{- _vertically_centered ? ' modal-dialog-centered' -}}
   {{- _scrollable ? ' modal-dialog-scrollable' -}}"
-  >
+  >{# -#}
     <div class="modal-content">
-      {% if header is not empty %}
+      {%- if header is not empty -%}
       <div
         {{- _header_attributes.addClass(['modal-header']) -}}
       >
         {%- block header _header -%}
       </div>
-      {% endif %}
+      {%- endif %}
       {%- block messages _messages -%}
       <div
           {{- _body_attributes.addClass(['modal-body']) -}}
       >
         {%- block body _body -%}
       </div>
-      {% if footer is not empty %}
+      {%- if footer is not empty -%}
       <div
           {{- _footer_attributes.addClass(['modal-footer']) -}}
       >
         {%- block footer _footer -%}
       </div>
-      {% endif %}
-    </div>
-  </div>
+      {%- endif -%}
+    </div>{# -#}
+  </div>{# -#}
 </div>
-
+{#--#}