@openeuropa/bcl-theme-default 0.22.0 → 0.25.0

package/templates/bcl-description-list/description-list.html.twig

@@ -2,142 +2,184 @@
 
 {#
   Parameters:
-  - title: (string) (default: "")
-  - title_tag: (string) (default: "h2")
+  - title: (string) (default: '')
+  - title_tag: (string) (default: 'h2')
+  - title_link: (link object) (default: {})
   - title_attributes (drupal attrs)
-  - "items" (array) (default: []): format: [
+  - bordered (boolean) (default: '')
+  - items (array) (default: []): format: [
       {
-        "term" (object or array of object) -format: {
+        term (object or array of object) -format: {
           icon: {} - icon object,
-          label: ""
+          label: ''
         }
-        "definition" (block or array of string)
+        definition (block or array of string)
       },
       ...
     ]
-  - "variant" (string) (default: '') 
-    - option: ["horizontal"]
+  - variant (string) (default: '') 
+    - option: ['horizontal']
 #}
 
-{# Parameters #}
-
 {% set _title = title|default('') %}
 {% set _title_tag = title_tag|default('h2') %}
+{% set _title_link = title_link|default({}) %}
+{% set _bordered = bordered|default(false) %}
+{% set _title_link = title_link|default({}) %}
 {% set _title_attributes = title_attributes ?: create_attribute() %}
 {% set _items = items|default([]) %}
 {% set _variant = variant|default('') %}
 
+{% set _classes = ['bcl-description-list'] %}
+
 {% if attributes is empty %}
   {% set attributes = create_attribute() %}
 {% endif %}
 
+{% set _item_classes = '' %}
+
 {% if _variant == 'horizontal' %}
-  {% set attributes = attributes.addClass(["d-md-grid", "grid-3-9"]) %}
+  {% set _item_classes = 'd-md-grid grid-3-9' %}
+  {% if _bordered %}
+    {% set _item_classes = _item_classes ~ ' mb-2-5 pb-2-5' %}
+  {% else %}
+    {% set _item_classes = _item_classes ~ ' mb-3' %}
+  {% endif %}
+{% else %}
+  {% set _item_classes = 'mb-3' %}
+  {% if _bordered %}
+    {% set _item_classes = 'mb-2-5' %}
+    {% set _item_classes = _item_classes ~ ' pb-2-5' %}
+  {% endif %}
+{% endif %}
+
+{% if _bordered %}
+  {% set _item_classes = _item_classes ~ ' border-bottom' %}
 {% endif %}
 
 {% if _title is not empty %}
   {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
     title: _title,
     title_tag: _title_tag,
+    title_link: _title_link,
     attributes: _title_attributes,
   } only %}
 {% endif %}
 
-<dl
+{% set attributes = attributes.addClass(_classes) %}
+
+<div
   {{ attributes }}
 >
   {% for _item in _items %}
-    {% if _item.term is not empty %}
-      {% if _item.term is iterable %}
-        {% if _variant == 'horizontal' %}
-          <div>
-        {% endif %}
-        {% for _term in _item.term %}
-          <dt
-          {% if _variant == 'horizontal' and _term.icon is not empty %}
-            class="d-flex"
-          {% endif %}
-          >
-            {%- if _term.icon is not empty -%}
-              {% set _icon_classes = ["me-2"] %}
-              {% if _variant == 'horizontal' %}
-                {% set _icon_classes = _icon_classes|merge(["mt-1"]) %}
-              {% endif %}
-              {% include '@oe-bcl/bcl-icon/icon.html.twig' with _term.icon|merge({
-                attributes: create_attribute().addClass(_icon_classes)
-              }) only %}
-              <p class="mb-0 d-inline-block">{{ _term.label }}</p>
-            {%- elseif _term.color is not empty -%}
-              <div class="d-flex align-items-center">
-                <span class="p-2 me-2 d-inline-block rounded-1 {{ _term.color }}"></span>{{- _term.label -}}
-              </div>
-            {%- else -%}
-              {{- _term.label -}}
-            {%- endif -%}
-          </dt>
-        {% endfor %}
+  {% if loop.last and _variant != 'horizontal' %}
+    {% set _item_classes = '' %}
+  {% endif %}
+  {% if _item.term is not empty %}
+  <dl
+  {% if _item_classes is not empty %}
+    class="{{ _item_classes }}"
+  {% endif %}
+  >
+    {% if _item.term is iterable %}
+    <dt>
+    {% for _term in _item.term %}
+      {%- if _item.term|length > 1 -%}
+      <div
+      {% if _variant == 'horizontal' and _term.icon is not empty %}
+        class="d-flex"
+      {% endif %}
+      >
+      {%- endif -%}
+      {%- if _term.icon is not empty -%}
+        {% set _icon_classes = ["me-2"] %}
         {% if _variant == 'horizontal' %}
-          </div>
+          {% set _icon_classes = _icon_classes|merge(["mt-1"]) %}
         {% endif %}
-      {% else %}
-        <dt
-          {% if _variant == 'horizontal' and _item.term.icon is not empty %}
-            class="d-flex"
-          {% endif %}
-        >
-          {%- if _item.term.icon is not empty -%}
-            {% set _icon_classes = ["me-2"] %}
-            {% if _variant == 'horizontal' %}
-              {% set _icon_classes = _icon_classes|merge(["mt-1"]) %}
-            {% endif %}
-            {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _item.term.icon|merge({
-              attributes: create_attribute().addClass(_icon_classes)
-            }) only -%}
-            <p class="mb-0 d-inline-block">{{ _item.term.label }}</p>
-          {%- elseif _item.term.color is not empty -%}
-            <div class="d-flex align-items-center">
-              <span class="p-2 me-2 d-inline-block rounded-1 {{ _item.term.color }}"></span>{{- _item.term.label -}}
-            </div>
-          {%- else -%}
-            {{- _item.term.label -}}
-          {%- endif -%}
-        </dt>
+        {% include '@oe-bcl/bcl-icon/icon.html.twig' with _term.icon|merge({
+          attributes: create_attribute().addClass(_icon_classes)
+        }) only %}
+        <p class="mb-0 d-inline-block">{{ _term.label }}</p>
+      {%- elseif _term.color is not empty -%}
+        <div class="d-flex align-items-center">
+          <span class="p-2 me-2 d-inline-block rounded-1 {{ _term.color }}"></span>{{- _term.label -}}
+        </div>
+      {%- else -%}
+        {{- _term.label -}}
+      {%- endif -%}
+      {% if _item.term|length > 1 %}
+      </div>
+      {% endif %}
+    {% endfor %}
+    </dt>
+    {% else %}
+    <dt
+      {% if _variant == 'horizontal' and _item.term.icon is not empty %}
+        class="d-flex"
       {% endif %}
+    >
+    {%- if _item.term.icon is not empty -%}
+      {% set _icon_classes = ["me-2"] %}
+      {% if _variant == 'horizontal' %}
+        {% set _icon_classes = _icon_classes|merge(["mt-1"]) %}
+      {% endif %}
+      {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _item.term.icon|merge({
+        attributes: create_attribute().addClass(_icon_classes)
+      }) only -%}
+      <p class="mb-0 d-inline-block">{{ _item.term.label }}</p>
+    {%- elseif _item.term.color is not empty -%}
+      <div class="d-flex align-items-center">
+        <span class="p-2 me-2 d-inline-block rounded-1 {{ _item.term.color }}"></span>{{- _item.term.label -}}
+      </div>
+    {%- else -%}
+      {{- _item.term.label -}}
+    {%- endif -%}
+    </dt>
     {% endif %}
-    {% if _item.definition is not empty %}
-      {% if _item.definition is iterable %}
-        {% if _variant == 'horizontal' %}
-          <dd>
+  {% endif %}
+  {% if _item.definition is not empty %}
+    {% if _item.definition is iterable %}
+      {% if _variant == 'horizontal' %}
+      <dd
+        {% if _bordered %}
+          class="mb-0"
         {% endif %}
-        {% for _definition in _item.definition %}
-          {% if _variant == 'horizontal' %}<div>{% else %}<dd>{% endif %}
-            {%- if _definition.button is defined -%}
-              {% include '@oe-bcl/bcl-button/button.html.twig' with _definition.button only %}
-            {%- elseif _definition.link is defined %}
-              {% include '@oe-bcl/bcl-link/link.html.twig' with _definition.link only -%}
+      >
+      {% endif %}
+      {% for _definition in _item.definition %}
+        {% if _variant == 'horizontal' %}<div>{% else %}<dd>{% endif %}
+          {%- if _definition.button is defined -%}
+            {% include '@oe-bcl/bcl-button/button.html.twig' with _definition.button only %}
+          {%- elseif _definition.link is defined %}
+            {% include '@oe-bcl/bcl-link/link.html.twig' with _definition.link only -%}
+          {%- else -%}
+            {%- if _definition.icon is defined -%}
+              {%- set _icon_classes = ["me-2"] -%}
+              {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _definition.icon|merge({
+                attributes: create_attribute().addClass(_icon_classes)
+              }) only -%}
+              <p class="mb-0 d-inline-block">{{ _definition.label }}</p>
             {%- else -%}
-              {%- if _definition.icon is defined -%}
-                {%- set _icon_classes = ["me-2"] -%}
-                {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _definition.icon|merge({
-                  attributes: create_attribute().addClass(_icon_classes)
-                }) only -%}
-               <p class="mb-0 d-inline-block">{{ _definition.label }}</p>
-              {%- else -%}
-                {{- _definition.label -}}
-              {%- endif -%}
+              {{- _definition.label -}}
             {%- endif -%}
-          {% if _variant == 'horizontal' %}</div>{% else %}</dd>{% endif %}
-        {% endfor %}
-        {% if _variant == 'horizontal' %}
-          </dd>
-        {% endif %}
-      {% else %}
-        <dd>
-          {%- block definition _item.definition -%}
-        </dd>
+          {%- endif -%}
+        {% if _variant == 'horizontal' %}</div>{% else %}</dd>{% endif %}
+      {% endfor %}
+      {% if _variant == 'horizontal' %}
+      </dd>
+      {% endif %}
+    {% else %}
+    <dd
+      {% if _bordered %}
+        class="mb-0"
       {% endif %}
+    >
+      {%- block definition _item.definition -%}
+    </dd>
     {% endif %}
+  </dl>
+  {% endif %}
   {% endfor %}
-</dl>
+</div>
 
 {% endspaceless %}

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

@@ -1,7 +1,7 @@
 {% spaceless %}
 
 {# Parameters:
-  - id (string) (default: '')
+  - id (string) (default: 'dropdown-' random(1000))
   - trigger (object of Button or Link component)
   - link (boolean) (default: false)
   - direction (string) (default: '')
@@ -32,6 +32,7 @@
         - button (boolean) - set to button
       }
     ]
+  - attributes (drupal attrs)
 #}
 
 {% set _id = id|default('dropdown-' ~ random(1000)) %}
@@ -42,6 +43,7 @@
 {% set _dark = dark|default(false) %}
 {% set _remove_wrapper = remove_wrapper|default(false) %}
 {% set _items = items|default([]) %}
+
 {% set _class = 'dropdown' %}
 {% set _dropdown_classes = ['dropdown-menu'] %}
 

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

@@ -7,7 +7,7 @@
 {% block content %}
   {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with details_list only %}
 
-  <h3 id="item-1" class="fw-bold my-4">Description</h3>
+  <h2 id="item-1" class="my-4">Description</h2>
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sit amet eleifend tortor. In facilisis eros vitae turpis ullamcorper,
   a euismod dolor lacinia. Nam facilisis ipsum et sollicitudin imperdiet. Curabitur a efficitur ante. Phasellus non felis laoreet,
   posuere ante ut, rhoncus tortor. Proin sed erat vel nisl luctus vulputate. Nunc tristique ultricies turpis, eu dictum enim ultrices vel.
@@ -18,7 +18,7 @@
   a euismod dolor lacinia. Nam facilisis ipsum et sollicitudin imperdiet.
   </p>
 
-  <h3 id="item-2" class="fw-bold my-4">Related documents</h3>
+  <h2 id="item-2" class="my-4">Related documents</h2>
   {% include '@oe-bcl/bcl-file/file.html.twig' with files[0] only %}
   {% include '@oe-bcl/bcl-file/file.html.twig' with files[1] only %}
 {% endblock %}

package/templates/bcl-fact-figures/fact-figures.html.twig

@@ -2,33 +2,34 @@
 
 {#
   Parameters:
-  - "title" (string) (default: '')
-  - "title_tag" (string) (default: 'h2')
-  - "variant" (string) (default: '') options:
+  - title (string) (default: '')
+  - title_tag (string) (default: 'h2')
+  - title_link: (link object) (default: {})
+  - title_attributes (drupal attrs)
+  - variant (string) (default: '') options:
     [ default, block ]
-  - "display_icons" (boolean) (default: true)
-  - "items" (array) (default: []):
-    - "icon" (associate array) (default: { size: 'm' })
-    - "subtitle" (string) (default: '')
-    - "title" (string) (default: '')
-    - "description" (string) (default:'')
-  - "grid_columns" (int) (default: 1)
-  - "responsiveness" (string) (default: 'md')
-  - "responsive_columns" (integer) (default: 3)
-  - "gutter" (int) (default: 4)
-  - "equal_height" (boolean) (default: false)
-  - "cols_extra_classes" (string) (default: '')
-  - "icon_path" (string) (default: '')
-  - "link_more" (object of type link) (default {})
+  - display_icons (boolean) (default: true)
+  - items (array) (default: []):
+    - icon (associate array) (default: { size: 'm' })
+    - subtitle (string) (default: '')
+    - title (string) (default: '')
+    - description (string) (default:'')
+  - grid_columns (int) (default: 1)
+  - responsiveness (string) (default: 'md')
+  - responsive_columns (integer) (default: 3)
+  - gutter (int) (default: 4)
+  - equal_height (boolean) (default: false)
+  - cols_extra_classes (string) (default: '')
+  - icon_path (string) (default: '')
+  - link_more (object of type link) (default {})
 #}
 
-{# Parameters #}
-
 {% set _title = title|default('') %}
 {% set _title_tag = title_tag|default('h2') %}
-{% set _title_attributes = title_attributes ?: create_attribute().addClass(['fw-bold']) %}
+{% set _title_link = title_link|default({}) %}
+{% set _title_attributes = title_attributes ?: create_attribute() %}
 {% set _variant = variant|default('default') %}
-{% set _css_classes = ['bcl-fact-figures', 'bcl-fact-figures--' ~ _variant] %}
+{% set _classes = ['bcl-fact-figures', 'bcl-fact-figures--' ~ _variant] %}
 {% set _display_icons = display_icons ?? true %}
 {% set _items = items|default([]) %}
 {% set _grid_columns = grid_columns|default(1) %}
@@ -65,13 +66,14 @@
   {% set attributes = create_attribute() %}
 {% endif %}
 
-{% set attributes = attributes.addClass(_css_classes) %}
+{% set attributes = attributes.addClass(_classes) %}
 
 <div {{ attributes }}>
 {% if _title is not empty %}
   {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
     title: _title,
     title_tag: _title_tag,
+    title_link: _title_link,
     attributes: _title_attributes,
   } only %}
 {% endif %}
@@ -85,23 +87,25 @@
       {% for _item in _items %}
       <div class="{{ _cols_classes }}">
       {% if _item.icon is defined and _item.icon is not empty and _display_icons %}
+        {% set _icon_attributes = _item.icon.attributes ?: create_attribute() %}
         {% set _item = _item|merge({
           icon: _item.icon|merge({
             path: _icon_path,
             size: 'l',
+            attributes: _icon_attributes.addClass('mb-2'),
           })
         }) %}
         {% include '@oe-bcl/bcl-icon/icon.html.twig' with _item.icon only %}
       {% endif %}
       {% if _item.title is defined and _item.title is not empty %}
-        <h4 class="text-capitalize fw-bold mt-2">
+        <div class="fs-4 fw-medium">
           {{- _item.title -}}
-        </h4>
+        </div>
       {% endif %}
       {% if _item.subtitle is defined and _item.subtitle is not empty %}
-        <h5 class="fw-bold">
+        <div class="fs-5 fw-medium">
           {{- _item.subtitle -}}
-        </h5>
+        </div>
       {% endif %}
       {% if _item.description is defined and _item.description is not empty %}
         <p>

package/templates/bcl-featured-media/featured-media.html.twig

@@ -2,8 +2,10 @@
 
 {# Parameters:
   - with_text (boolean) (default: false)
-  - title: (string) (default: '')
-  - title_tag: (string) (default: 'h2')
+  - title (string) (default: '')
+  - title_tag (string) (default: 'h2')
+  - title_link: (link object) (default: {})
+  - title_attributes: (drupal attrs)
   - image: (string) (default: "")
   - poster_image: (string) (default: "")
   - content: (string) (default: "")
@@ -34,6 +36,8 @@
 
 {% set _title = title|default('') %}
 {% set _title_tag = title_tag|default('h2') %}
+{% set _title_link = title_link|default({}) %}
+{% set _title_attributes = title_attributes ?: create_attribute() %}
 {% set _with_text = with_text|default(false) %}
 {% set _wrapper_classes = 'bcl-featured-item' %}
 {% set _description = description|default('') %}
@@ -57,19 +61,27 @@
   {% set attributes = create_attribute() %}
 {% endif %}
 
+{% if _with_text %}
+  {% set _title_attributes = _title_attributes.addClass(['fw-bold', 'mb-4']) %}
+{% endif %}
+
 {% set attributes = attributes.addClass(["rounded", "overflow-hidden"]) %}
 
 {% if _with_text %}
 <div class="{{ _wrapper_classes }}">
-
-{% if _title is not empty %}
-  {% set _title_classes = 'fw-bold mb-4' %}
-  <{{ _title_tag }} class="{{ _title_classes }}">
-    {{- _title -}}
-  </{{ _title_tag }}>
+  <div class="row">
 {% endif %}
 
-  <div class="row">
+{%- if _title is not empty -%}
+  {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+    title: _title,
+    title_tag: _title_tag,
+    title_link: _title_link,
+    attributes: _title_attributes,
+  } only %}
+{%- endif -%}
+
+{% if _with_text %}
     <div class="{{ _col_classes }} order-{{ _alignment == "right" ? '1' : '2' }}">
       {{- _description|default('') -}}
 

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

@@ -4,14 +4,16 @@
   Parameters:
   - title (string) (default: '')
   - title_tag (string) (default: 'h2')
+  - title_link: (link object) (default: {})
   - title_attributes (drupal attrs)
   - item_title (string) (default: '')
   - icon (icon Object) (default: {})
+  - icon_inline (boolean) (deafult: true)
   - text (string) (default: '')
   - content (string) (default: '')
   - image (object) (default: {}) - format: {
-    path:"",
-    alt: "",
+    path: '',
+    alt: '',
   }
   - badges (array of badges Object) (default: [])
   - meta (string) (default: '')
@@ -20,24 +22,27 @@
     - options: ['default', 'card']
   - download (link Object) (default: {})
   - translation (object) (default: {}) format: {
-    id: "",
+    id: '',
     label: {}, - link Object
     items: [
       {
-        extension: "",
-        language: "",
-        size: "",
+        extension: '',
+        language: '',
+        size: '',
         download: {}, - link Object
       },
   }
   - icon_path (string) (default: '')
+  - attributes (drupal attrs)
 #}
 
 {# Internal properties #}
 
 {% set _icon = icon|default({}) %}
+{% set _icon_inline = icon_inline|default(true) %}
 {% set _title = title|default('') %}
 {% set _title_tag = title_tag|default('h2') %}
+{% set _title_link = title_link|default({}) %}
 {% set _title_attributes = title_attributes ?: create_attribute() %}
 {% set _item_title = item_title|default('') %}
 {% set _text = text|default('') %}
@@ -51,7 +56,14 @@
 {% set _translation = translation|default({}) %}
 {% set _icon_path = icon_path|default({}) %}
 
-{% set _container_classes = 'w-100 d-md-flex' %}
+{% set _classes = ['bcl-file'] %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(_classes) %}
+
 {% if _icon is not empty %}
   {% set _container_classes = _container_classes ~ ' ms-2-5' %}
   {% set _icon = _icon|merge({
@@ -59,65 +71,62 @@
   }) %}
 {% endif %}
 
-{% if attributes is empty %}
-  {% set attributes = create_attribute() %}
-{% endif %}
-
 {% if _title is not empty %}
   {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
     title: _title,
     title_tag: _title_tag,
+    title_link: _title_link,
     attributes: _title_attributes,
   } only %}
 {% endif %}
 
-{% if _variant == 'card' %}
-  {% set attributes = attributes.addClass(['border', 'rounded-bottom']) %}
-  {% set _image = _image|merge({
-    position: "top",
-    classes: "mb-3",
-    rounded: 0,
-  }) %}
-  {% include '@oe-bcl/bcl-card/card.html.twig' with {
-    horizontal: true,
-    horizontal_grid: {
-      left_col_classes: "col-12 col-md-4 order-md-2",
-      right_col_classes: "col-12 col-md-8",
-    },
-    badges: _badges,
-    title: {
-      content: _item_title,
-    },
-    text: {
-      content: _text,
-      classes: "mb-2",
-    },
-    content: _content,
-    image: _image,
-    extra_classes_body: "p-0",
-    attributes: create_attribute().addClass(['rounded-0', 'rounded-top', 'p-4', 'border-bottom-0'])
-  } only %}
-{% else %}
-  {% set attributes = attributes.addClass(['border', 'rounded']) %}
-{% endif %}
+{% set attributes = attributes.addClass(['border', 'rounded']) %}
+
+{% set _container_classes = 'd-md-flex flex-grow-1' %}
 
 <div
   {{ attributes }}
 >
-  <div class="px-3-5 py-3">
-    <div class="d-flex">
+  {% if _variant == 'card' %}
+    <div class="border-bottom px-3-5 py-3 d-md-flex">
+      <div class="pe-2 pb-2">
       {% if _icon is not empty %}
         {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _icon|merge({
           path: _icon_path,
         }) only -%}
       {% endif %}
+      </div>
+      <div>
+        {% if _item_title is not empty %}
+          <p class="fw-medium mb-2 fs-5">{{ _item_title }}</p>
+        {% endif %}
+        {% if _text is not empty %}
+          <p class="mb-3">{{ _text }}</p>
+        {% endif %}
+        {% if _content is not empty %}
+          {{ _content }}
+        {% endif %}
+      </div>
+    </div>
+  {% endif %}
+  <div class="px-3-5 py-3">
+    <div class="d-flex">
+      {% if _icon is not empty and _variant == 'default' %}
+        <div class="pe-2 pb-2">
+        {% if _icon is not empty %}
+          {%- include '@oe-bcl/bcl-icon/icon.html.twig' with _icon|merge({
+            path: _icon_path,
+          }) only -%}
+        {% endif %}
+        </div>
+      {% endif %}
       <div class="{{ _container_classes }}">
         <div class="flex-grow-1">
           {% if _item_title is not empty and _variant == 'default' %}
-            <p class="fw-bold m-0">{{ _item_title }}</p>
+            <p class="fw-medium m-0 fs-5">{{ _item_title }}</p>
           {% endif %}
           {% if _language is not empty or _meta is not empty %}
-          <small class="fw-bold m-0">
+          <small class="fw-medium m-0">
             {%- if _language is not empty -%}
               {{- _language -}}
             {%- endif -%}
@@ -137,8 +146,9 @@
             path: _icon_path,
           },
           attributes: create_attribute()
-                      .setAttribute('download', _download.url)
-                      .addClass(['standalone', 'align-self-center', 'd-inline-block', 'mt-1', 'mt-md-0'])
+                      .setAttribute('download', true)
+                      .setAttribute('target', '_blank')
+                      .addClass(['standalone', 'align-self-center', 'd-inline-block', 'mt-1', 'mt-md-0', 'flex-shrink-0'])
         }) %}
         {% include '@oe-bcl/bcl-link/link.html.twig' with _download only %}
       </div>
@@ -196,7 +206,8 @@
                 path: _icon_path,
               },
               attributes: create_attribute()
-                          .setAttribute("download", _item.download.url)
+                          .setAttribute('download', true)
+                          .setAttribute('target', '_blank')
                           .addClass(['d-block', 'standalone', 'mt-1'])
             }) only %}
             </div>