@openeuropa/bcl-twig-templates 1.1.1 → 1.2.0

package/package.json

@@ -2,77 +2,77 @@
   "name": "@openeuropa/bcl-twig-templates",
   "author": "European Commission",
   "license": "EUPL-1.2",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "OE Bcl Twig Templates",
   "publishConfig": {
     "access": "public"
   },
   "devDependencies": {
-    "@openeuropa/bcl-accordion": "^1.1.1",
-    "@openeuropa/bcl-alert": "^1.1.1",
-    "@openeuropa/bcl-badge": "^1.1.1",
-    "@openeuropa/bcl-banner": "^1.1.1",
-    "@openeuropa/bcl-base-templates": "^1.1.1",
-    "@openeuropa/bcl-blockquote": "^1.1.1",
-    "@openeuropa/bcl-breadcrumb": "^1.1.1",
-    "@openeuropa/bcl-button": "^1.1.1",
-    "@openeuropa/bcl-button-group": "^1.1.1",
-    "@openeuropa/bcl-card": "^1.1.1",
-    "@openeuropa/bcl-card-layout": "^1.1.1",
-    "@openeuropa/bcl-carousel": "^1.1.1",
-    "@openeuropa/bcl-contact-form": "^1.1.1",
-    "@openeuropa/bcl-content-banner": "^1.1.1",
-    "@openeuropa/bcl-date-block": "^1.1.1",
-    "@openeuropa/bcl-description-list": "^1.1.1",
-    "@openeuropa/bcl-dropdown": "^1.1.1",
-    "@openeuropa/bcl-event": "^1.1.1",
-    "@openeuropa/bcl-fact-figures": "^1.1.1",
-    "@openeuropa/bcl-featured-media": "^1.1.1",
-    "@openeuropa/bcl-file": "^1.1.1",
-    "@openeuropa/bcl-footer": "^1.1.1",
-    "@openeuropa/bcl-form": "^1.1.1",
-    "@openeuropa/bcl-form-input": "^1.1.1",
-    "@openeuropa/bcl-gallery": "^1.1.1",
-    "@openeuropa/bcl-glossary": "^1.1.1",
-    "@openeuropa/bcl-group": "^1.1.1",
-    "@openeuropa/bcl-header": "^1.1.1",
-    "@openeuropa/bcl-heading": "^1.1.1",
-    "@openeuropa/bcl-icon": "^1.1.1",
-    "@openeuropa/bcl-inpage-navigation": "^1.1.1",
-    "@openeuropa/bcl-landing-page": "^1.1.1",
-    "@openeuropa/bcl-language-list": "^1.1.1",
-    "@openeuropa/bcl-language-switcher": "^1.1.1",
-    "@openeuropa/bcl-link": "^1.1.1",
-    "@openeuropa/bcl-links-block": "^1.1.1",
-    "@openeuropa/bcl-list-group": "^1.1.1",
-    "@openeuropa/bcl-listing": "^1.1.1",
-    "@openeuropa/bcl-modal": "^1.1.1",
-    "@openeuropa/bcl-multilingual": "^1.1.1",
-    "@openeuropa/bcl-navbar": "^1.1.1",
-    "@openeuropa/bcl-navigation": "^1.1.1",
-    "@openeuropa/bcl-news": "^1.1.1",
-    "@openeuropa/bcl-offcanvas": "^1.1.1",
-    "@openeuropa/bcl-page": "^1.1.1",
-    "@openeuropa/bcl-pagination": "^1.1.1",
-    "@openeuropa/bcl-person": "^1.1.1",
-    "@openeuropa/bcl-placeholder": "^1.1.1",
-    "@openeuropa/bcl-progress": "^1.1.1",
-    "@openeuropa/bcl-project": "^1.1.1",
-    "@openeuropa/bcl-project-status": "^1.1.1",
-    "@openeuropa/bcl-recent-activities": "^1.1.1",
-    "@openeuropa/bcl-search": "^1.1.1",
-    "@openeuropa/bcl-search-form": "^1.1.1",
-    "@openeuropa/bcl-select": "^1.1.1",
-    "@openeuropa/bcl-spinner": "^1.1.1",
-    "@openeuropa/bcl-subscription": "^1.1.1",
-    "@openeuropa/bcl-subscription-block": "^1.1.1",
-    "@openeuropa/bcl-table": "^1.1.1",
-    "@openeuropa/bcl-textarea": "^1.1.1",
-    "@openeuropa/bcl-timeline": "^1.1.1",
-    "@openeuropa/bcl-toast": "^1.1.1",
-    "@openeuropa/bcl-user": "^1.1.1",
+    "@openeuropa/bcl-accordion": "^1.2.0",
+    "@openeuropa/bcl-alert": "^1.2.0",
+    "@openeuropa/bcl-badge": "^1.2.0",
+    "@openeuropa/bcl-banner": "^1.2.0",
+    "@openeuropa/bcl-base-templates": "^1.2.0",
+    "@openeuropa/bcl-blockquote": "^1.2.0",
+    "@openeuropa/bcl-breadcrumb": "^1.2.0",
+    "@openeuropa/bcl-button": "^1.2.0",
+    "@openeuropa/bcl-button-group": "^1.2.0",
+    "@openeuropa/bcl-card": "^1.2.0",
+    "@openeuropa/bcl-card-layout": "^1.2.0",
+    "@openeuropa/bcl-carousel": "^1.2.0",
+    "@openeuropa/bcl-contact-form": "^1.2.0",
+    "@openeuropa/bcl-content-banner": "^1.2.0",
+    "@openeuropa/bcl-date-block": "^1.2.0",
+    "@openeuropa/bcl-description-list": "^1.2.0",
+    "@openeuropa/bcl-dropdown": "^1.2.0",
+    "@openeuropa/bcl-event": "^1.2.0",
+    "@openeuropa/bcl-fact-figures": "^1.2.0",
+    "@openeuropa/bcl-featured-media": "^1.2.0",
+    "@openeuropa/bcl-file": "^1.2.0",
+    "@openeuropa/bcl-footer": "^1.2.0",
+    "@openeuropa/bcl-form": "^1.2.0",
+    "@openeuropa/bcl-form-input": "^1.2.0",
+    "@openeuropa/bcl-gallery": "^1.2.0",
+    "@openeuropa/bcl-glossary": "^1.2.0",
+    "@openeuropa/bcl-group": "^1.2.0",
+    "@openeuropa/bcl-header": "^1.2.0",
+    "@openeuropa/bcl-heading": "^1.2.0",
+    "@openeuropa/bcl-icon": "^1.2.0",
+    "@openeuropa/bcl-inpage-navigation": "^1.2.0",
+    "@openeuropa/bcl-landing-page": "^1.2.0",
+    "@openeuropa/bcl-language-list": "^1.2.0",
+    "@openeuropa/bcl-language-switcher": "^1.2.0",
+    "@openeuropa/bcl-link": "^1.2.0",
+    "@openeuropa/bcl-links-block": "^1.2.0",
+    "@openeuropa/bcl-list-group": "^1.2.0",
+    "@openeuropa/bcl-listing": "^1.2.0",
+    "@openeuropa/bcl-modal": "^1.2.0",
+    "@openeuropa/bcl-multilingual": "^1.2.0",
+    "@openeuropa/bcl-navbar": "^1.2.0",
+    "@openeuropa/bcl-navigation": "^1.2.0",
+    "@openeuropa/bcl-news": "^1.2.0",
+    "@openeuropa/bcl-offcanvas": "^1.2.0",
+    "@openeuropa/bcl-page": "^1.2.0",
+    "@openeuropa/bcl-pagination": "^1.2.0",
+    "@openeuropa/bcl-person": "^1.2.0",
+    "@openeuropa/bcl-placeholder": "^1.2.0",
+    "@openeuropa/bcl-progress": "^1.2.0",
+    "@openeuropa/bcl-project": "^1.2.0",
+    "@openeuropa/bcl-project-status": "^1.2.0",
+    "@openeuropa/bcl-recent-activities": "^1.2.0",
+    "@openeuropa/bcl-search": "^1.2.0",
+    "@openeuropa/bcl-search-form": "^1.2.0",
+    "@openeuropa/bcl-select": "^1.2.0",
+    "@openeuropa/bcl-spinner": "^1.2.0",
+    "@openeuropa/bcl-subscription": "^1.2.0",
+    "@openeuropa/bcl-subscription-block": "^1.2.0",
+    "@openeuropa/bcl-table": "^1.2.0",
+    "@openeuropa/bcl-textarea": "^1.2.0",
+    "@openeuropa/bcl-timeline": "^1.2.0",
+    "@openeuropa/bcl-toast": "^1.2.0",
+    "@openeuropa/bcl-user": "^1.2.0",
     "copyfiles": "2.4.1",
-    "rimraf": "5.0.0"
+    "rimraf": "5.0.1"
   },
   "scripts": {
     "clean": "rimraf templates",
@@ -93,5 +93,5 @@
     "design-system",
     "twig"
   ],
-  "gitHead": "556ad7ce96c849c539c6722a4da68e1ae2822514"
+  "gitHead": "e8750bd56d83523370a6a1f32f3cc5c0b14bdfca"
 }

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

@@ -31,7 +31,7 @@
 {% if _outline %}
   {% set _classes = _classes|merge(['badge-outline-' ~ _background]) %}
 {% else %}
-  {% set _classes = _classes|merge(['bg-' ~ _background]) %}
+  {% set _classes = _classes|merge(['text-bg-' ~ _background]) %}
 {% endif %}
 
 {% if attributes is empty %}

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

@@ -82,7 +82,7 @@
   {% set _classes = _classes|merge(['text-' ~ _text_color]) %}
 {% endif %}
 {% if _variant is not empty %}
-  {% set _classes = _classes|merge(['bg-' ~ _variant]) %}
+  {% set _classes = _classes|merge(['text-bg-' ~ _variant]) %}
 {% endif %}
 {% if _border_variant is not empty %}
   {% set _classes = _classes|merge(['border-' ~ _border_variant]) %}

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

@@ -135,7 +135,7 @@
             <div class="{{ _item.caption_classes }}">
           {% endif %}
           {% if _item.caption_title is not empty %}
-            <p class="fs-5">{{ _item.caption_title }}</p>
+            <div class="fs-5">{{ _item.caption_title }}</div>
           {% endif %}
             {{- _item.caption -}}
           {% if _item.caption_classes is defined and _item.caption_classes is not empty %}

package/templates/bcl-date-block/date-block.html.twig

@@ -45,12 +45,12 @@
   <span class="d-flex flex-column pt-2">
     <span class="d-flex flex-column align-item-center justify-content-center bg-white border border-bottom-0 w-100 h-100 fs-5 text-uppercase">
       <span class="d-block">{{- _day ~ ' ' ~ _month ~ ((_end_day or _end_month) ? ' - ' ) -}}</span>
-      {%- if _end_day is not empty -%}
+      {%- if _end_day is not empty %}
         {{- _end_day -}}
-      {% endif %}
-      {% if _end_month is not empty %}
-        {{- _end_month -}}
-      {%- endif -%}
+      {% endif -%}
+      {%- if _end_month is not empty %}
+        {{- ' ' ~ _end_month -}}
+      {% endif -%}
     </span>
     <span class="bg-lighter border w-100 rounded-bottom py-1">
       {{- _year -}}

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

@@ -12,8 +12,12 @@
   - poster_image: (string) (default: '')
   - content: (string) (default: '')
   - wrapper_classes: (default: '')
+  - force_wrapper (boolean) (default: false) - always render wrapper element
   - content_classes: (string) (default: '')
   - read_more (object) (default: {})
+  - description_title (string) (default: '')
+  - description_title_tag (string) (default: 'h3')
+  - description_title_attributes (drupal attrs)
   - description (string) (default: '')
   - ratio: (string) (default: '16x9')
     - options ['1x1', '4x3', '16x9', '21x9']
@@ -40,6 +44,7 @@
 {% set _title_tag = title_tag|default('h2') %}
 {% set _title_link = title_link|default({}) %}
 {% set _title_attributes = title_attributes ?: create_attribute() %}
+{% set _force_wrapper = force_wrapper ?? false %}
 {% set _with_text = with_text ?? false %}
 {% set _alignment = alignment|default('right') %}
 {% set _image = image|default('') %}
@@ -48,6 +53,9 @@
 {% set _wrapper_classes = wrapper_classes|default('') %}
 {% set _content_classes = content_classes|default('') %}
 {% set _read_more = read_more|default({}) %}
+{% set _description_title = description_title|default('') %}
+{% set _description_title_tag = description_title_tag|default('h3') %}
+{% set _description_title_attributes = description_title_attributes ?: create_attribute() %}
 {% set _description = description|default('') %}
 {% set _ratio = ratio|default('16x9') %}
 {% set _sources = sources|default([]) %}
@@ -65,10 +73,6 @@
   {% 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 _image is not empty %}
@@ -80,8 +84,10 @@
   {% endif %}
 {% endif %}
 
-{% if _with_text %}
+{% if _with_text or _force_wrapper %}
 <div class="{{ _classes }}">
+{% endif %}
+{% if _with_text %}
   <div class="row">
 {% endif %}
 
@@ -96,6 +102,13 @@
 
 {% if _with_text %}
   <div class="{{ _col_classes }} order-{{ _alignment == "right" ? '1' : '2' }}">
+    {%- if _description_title is not empty -%}
+      {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+        title: _description_title,
+        title_tag: _description_title_tag,
+        attributes: _description_title_attributes,
+      } only %}
+    {%- endif -%}
     {{- _description|default('') -}}
 
     {% if _read_more is not empty %}
@@ -151,6 +164,8 @@
 {% if _with_text %}
     </div>
   </div>
+{% endif %}
+{% if _with_text or _force_wrapper %}
 </div>
 {% endif %}
 

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

@@ -123,7 +123,7 @@
 {% endif %}
 {% if _antispam is not empty %}
   <div class="mt-4 mb-2">
-    <div class="bg-light">
+    <div class="text-bg-light">
       {{ _antispam }}
     </div>
   </div>

package/templates/bcl-gallery/gallery-item.html.twig

@@ -48,7 +48,7 @@ Parameters:
   {% if _item.caption is not empty or item.caption_title is not empty %}
     <div class="bcl-gallery__item-caption">
     {% if _item.caption_title is not empty %}
-      <p class="fs-5">{{ _item.caption_title }}</p>
+      <div class="fs-5">{{ _item.caption_title }}</div>
     {% endif %}
     {% if _item.caption is not empty %}
       <div class="bcl-gallery__item-description">

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

@@ -78,11 +78,11 @@
   {{ attributes }}
 >
   {%- if _icon_position == 'before' and _icon_markup is defined -%}
-    {{ _icon_markup|raw }}
+    {{ _icon_markup }}
   {%- endif -%}
   {{- _label -}}
   {%- if _icon_position == 'after' and _icon_markup is defined -%}
-    {{ _icon_markup|raw }}
+    {{ _icon_markup }}
   {%- endif -%}
 </a>
 

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

@@ -23,7 +23,7 @@
 {% endif %}
 
 {% if _variant is not empty %}
-  {% set _classes = _classes|merge(['bg-' ~ _variant]) %}
+  {% set _classes = _classes|merge(['text-bg-' ~ _variant]) %}
 {% endif %}
 
 {% if attributes is empty %}

package/templates/bcl-subscription-block/subscription-block.html.twig

@@ -11,7 +11,7 @@
 {% set _content = content|default('') %}
 {% set _button = button|default({}) %}
 
-{% set _classes = ['bcl-subscription-block', 'bg-light', 'px-4-5', 'pt-4', 'pb-4-5'] %}
+{% set _classes = ['bcl-subscription-block', 'text-bg-light', 'px-4-5', 'pt-4', 'pb-4-5'] %}
 
 {% if attributes is empty %}
   {% set attributes = create_attribute() %}