@openeuropa/bcl-theme-default 0.19.0 → 0.22.0

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

@@ -5,56 +5,91 @@
 {% endblock %}
 
 {% block content %}
-  {% include '@oe-bcl/bcl-project-status/project-status.html.twig' with project_details|merge({ charts: charts }) %}
+  {% if project_status_title is not empty %}
+    {% set _project_title_attributes = create_attribute().addClass(['fw-bold', 'mb-4']) %}
+    {% if project_status_id is not empty %}
+      {% set _project_title_attributes = _project_title_attributes.setAttribute('id', project_status_id) %}
+    {% endif %}
+    {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+      title: project_status_title,
+      title_tag: 'h3',
+      attributes: _project_title_attributes,
+    } only %}
+  {% endif %}
+  {% if project_status is not empty %}
+    {% include '@oe-bcl/bcl-project-status/project-status.html.twig' with project_status %}
+  {% endif %}
+  {% if project_contributions is not empty %}
+    {% include '@oe-bcl/bcl-project-status/project-contributions.html.twig' with project_contributions %}
+  {% endif %}
 
-  <div class="border-bottom mb-4">
-    {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with details_list only %}
+  {% if status_lists is not empty %}
+    {% include '@oe-bcl/bcl-project/project-lists.html.twig' with status_lists only %}
+  {% endif %}
+
+  {% if first_paragraphs is defined and first_paragraphs is not empty %}
+    {% for _paragraph in first_paragraphs %}
+      {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+        title: _paragraph.title,
+        title_tag: 'h3',
+        attributes: create_attribute().addClass(['fw-bold', 'mb-4', 'pt-3'])
+                                      .setAttribute('id', _paragraph.title_id),
+      } only %}
+      {{- _paragraph.content -}}
+    {% endfor %}
+  {% endif %}
+
+  {% if featured_lists is not empty %}
+    {% include '@oe-bcl/bcl-project/project-lists.html.twig' with featured_lists only %}
+  {% endif %}
+
+  {% if content_lists is not empty %}
+    {% include '@oe-bcl/bcl-project/project-lists.html.twig' with content_lists only %}
+  {% endif %}
+
+  {% if second_paragraphs is defined and second_paragraphs is not empty %}
+    {% for _paragraph in second_paragraphs %}
+      {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+        title: _paragraph.title,
+        title_tag: 'h3',
+        attributes: create_attribute().addClass(['fw-bold', 'mb-4', 'pt-3'])
+                                      .setAttribute('id', _paragraph.title_id),
+      } only %}
+      {{- _paragraph.content -}}
+    {% endfor %}
+  {% endif %}
+
+  {% if gallery.main_title is not empty %}
+    {% set _gallery_title_attributes = create_attribute().addClass(['fw-bold', 'my-4']) %}
+    {% if gallery.main_title_id is not empty %}
+      {% set _gallery_title_attributes = _gallery_title_attributes.setAttribute('id', gallery.main_title_id) %}
+    {% endif %}
+    {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+      title: gallery.main_title,
+      title_tag: 'h3',
+      attributes: _gallery_title_attributes,
+    } only %}
+  {% endif %}
+  {% if gallery.items is defined and gallery.items is not empty %}
+  <div class="mt-3">
+    {% for _showcase in gallery.items %}
+      <div class="mb-2-5 pb-4">
+      {% if _showcase.carousel %}
+        {% include '@oe-bcl/bcl-carousel/carousel.html.twig' with _showcase only %}
+      {% else %}
+        {% include '@oe-bcl/bcl-featured-media/featured-media.html.twig' with _showcase only %}
+      {% endif %}
+      </div>
+    {% endfor %}
   </div>
+  {% endif %}
+
+  {% if social_block is not empty %}
+    {% block social_block %}
+      {{ social_buttons }}
+      {% include '@oe-bcl/bcl-button/button.html.twig' with button_social_modal only %}
+      {% include '@oe-bcl/bcl-modal/modal.html.twig' with social_modal only %}
+    {% endblock %}
+  {% endif %}
 
-  {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with coordinator_list only %}
-
-  {% for paragraph in paragraphs %}
-      <h3
-        class="fw-bold mb-4 pt-3"
-        id="{{ paragraph.title_id }}"
-      >
-        {{ paragraph.title }}
-      </h3>
-
-    {{ paragraph.content }}
-  {% endfor %}
-
-  <h3
-    class="fw-bold mb-4 pt-2"
-    id="{{ contributors.main_title_id }}"
-  >
-    {{ contributors.main_title }}
-  </h3>
-
-{% for contributor in contributors.listing %}
-  <h4 class="fw-bold mb-3">{{ contributor.title }}</h4>
-
-  {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with contributor.list only %}
-
-{% endfor %}
-
-{% for achievement in achievements %}
-  <h3
-    class="fw-bold mb-4 pt-2"
-    id="{{ achievement.title_id }}"
-  >
-    {{ achievement.title }}
-  </h3>
-  {{ achievement.content }}
-{% endfor %}
-
-  <h3
-    class="fw-bold mb-4 pt-2"
-    id="{{ gallery.title_id }}"
-  >
-    {{ gallery.title }}
-  </h3>
-
-  {% include '@oe-bcl/bcl-featured-media/featured-media.html.twig' with gallery.featured only %}
-  {% include '@oe-bcl/bcl-carousel/carousel.html.twig' with gallery.carousel only %}
 {% endblock %}

package/templates/bcl-project-status/project-contributions.html.twig

@@ -0,0 +1,56 @@
+{% spaceless %}
+
+{# Parameters:
+  - corporate_contributions (string) (default: '') // value every 5 percent
+  - legend (boolean or object (default: false)
+  - chart (boolean) (default: false)
+
+  Blocks - 
+    project_status_contrib_chart
+    project_status_contrib_legend
+#}
+
+{% set _corporate_contributions = corporate_contributions|default('') %}
+{% set _legend = legend|default(false) %}
+{% set _chart = chart|default(false) %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass([
+  'bcl-project-contributions',
+  'border-bottom',
+  'pb-4',
+  'mb-4'
+]) %}
+
+<div {{ attributes }}>
+  <div class="row">
+
+  {% if _chart is not empty %}
+    <div class="bcl-project-contributions-chart col-5 col-md-3">
+    {% block project_status_contrib_chart %}
+      <div class="circular-progress" data-percentage="{{ _corporate_contributions }}">
+        <span class="circular-progress-left">
+          <span class="circular-progress-bar"></span>
+        </span>
+        <span class="circular-progress-right">
+          <span class="circular-progress-bar"></span>
+        </span>
+      </div>
+    {% endblock %}
+    </div>
+  {% endif %}
+
+  {% if _legend is not empty %}
+    <div class="bcl-project-contributions-legend col-7 col-md-9 align-self-center">
+    {% block project_status_contrib_legend %}
+      {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with _legend only %}
+    {% endblock %}
+    </div>
+  {% endif %}
+  </div> 
+</div>
+
+{% endspaceless %}

package/templates/bcl-project-status/project-status.html.twig

@@ -1,9 +1,6 @@
 {% spaceless %}
 
 {# Parameters:
-  - title_id (string) (default: "")
-  - title (string) (default: "")
-  - title_tag (string) (default: "h3")
   - status (string) (default: 'planned')
   - start_date (string) (default: '')
   - start_label (string) (default: '')
@@ -12,14 +9,9 @@
   - label (string) (default: '')
   - badge (string) (default: ''),
   - progress (string) (default: '')
-
-  Blocks - charts
 #}
 
-{% set _title_id = title_id|default('') %}
-{% set _title = title|default('') %}
 {% set _label = label|default('') %}
-{% set _title_tag = title_tag|default('h3') %}
 {% set _status = status|default('planned') %}
 {% set _charts = charts|default('') %}
 {% set _badge = badge|default('') %}
@@ -29,6 +21,17 @@
 {% set _end_label = end_label|default('') %}
 {% set _progress = progress|default('') %}
 
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass([
+  'bcl-project-status',
+  'border-bottom',
+  'pb-4',
+  'mb-4'
+]) %}
+
 {% set _bgs = {
     ongoing: 'info',
     closed: 'dark',
@@ -36,17 +39,7 @@
   } %}
 {% set _bg = _bgs[_status]|default('secondary') %}
 
-
-<{{ _title_tag }}
-  class="fw-bold mb-4"
-  {% if title_id is not empty %}
-    id="{{ title_id }}"
-  {% endif %}
->
-  {{- title -}}
-</{{ _title_tag }}>
-
-<div class="border-bottom pb-4 mb-4">
+<div {{ attributes }}>
   <div class="row">
     <div class="col-12 col-md-3">
     {% if _label is not empty %}
@@ -100,10 +93,6 @@
   </div>
 </div>
 
-{% if _charts is not empty %}
-<div class="border-bottom pb-4 mb-4">
-  {%- block charts _charts -%}
-</div>
-{% endif %}
+
 
 {% endspaceless %}

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

@@ -4,6 +4,7 @@
   Parameters:
   - "id" (string) (default: '')
   - "label" (string) (default: '')
+  - "label_extra_classes" (string) (default: '')
   - "hidden_label" (boolean) (default: false)
   - "helper_text" (string) (default: '')
   - "helper_text_id" (string) (default: '')
@@ -16,6 +17,7 @@
   - "multiple" (boolean) (default: false)
   - "options": (array of objects with value and label keys) (default: [])
   - "aria_label": (string) (default: '')
+  - "clean_class": (boolean) (default: false) - removes 'form-select' class
 #}
 
 {% set _classes = ['form-select'] %}
@@ -32,11 +34,12 @@
 {% set _helper_text = helper_text|default('') %}
 {% set _helper_text_id = helper_text_id|default('') %}
 {% set _label = label|default('') %}
-{% set _extra_classes = extra_classes|default('') %}
+{% set _label_extra_classes = label_extra_classes|default('') %}
 {% set _clean_class = clean_class|default(false) %}
-{% set _label_class = 'form-label' %}
 {% set _hidden_label = hidden_label|default(false) %}
 
+{% set _label_class = 'form-label' %}
+
 {% if _clean_class %}
   {% set _classes = [] %}
 {% endif %}
@@ -53,6 +56,10 @@
   {% set attributes = create_attribute() %}
 {% endif %}
 
+{% if _label_extra_classes is not empty %}
+  {% set _label_class = _label_class ~ ' ' ~ _label_extra_classes %}
+{% endif %}
+
 {% if _aria_label is not empty %}
   {% set attributes = attributes.setAttribute('aria-label', _aria_label) %}
 {% endif %}
@@ -78,7 +85,7 @@
 {% endif %}
 
 {% if _classes is not empty %}
-{% set attributes = attributes.addClass(_classes) %}
+  {% set attributes = attributes.addClass(_classes) %}
 {% endif %}
 
 {% if _label is not empty %}
@@ -129,6 +136,9 @@
       {% if _option.disabled %}
         disabled
       {% endif %}
+      {% if _option.hidden %}
+        hidden
+      {% endif %}
       >
         {{- _option.label -}}
       </option>

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

@@ -0,0 +1,24 @@
+{# Parameters:
+  - form: (form object) (default: {})
+  - success_alert: (alert object) (default: {})
+  - error_alert: (button Object) (default: {})
+
+  Blocks:
+  - body
+  - messages
+#}
+
+{% set _form = form|default({}) %}
+{% set _success_alert = success_alert|default({}) %}
+{% set _error_alert = error_alert|default({}) %}
+
+{% extends "@oe-bcl/bcl-modal/modal.html.twig" %}
+
+{% block body %}
+  {% include '@oe-bcl/bcl-form/form.html.twig' with _form only %}
+{% endblock %}
+
+{% block messages %}
+  {% include '@oe-bcl/bcl-alert/alert.html.twig' with _success_alert only %}
+  {% include '@oe-bcl/bcl-alert/alert.html.twig' with _error_alert only %}
+{% endblock %}

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

@@ -0,0 +1,10 @@
+{% extends '@oe-bcl/bcl-base-templates/content-type.html.twig' %}
+
+{% block sidebar %}
+  {% include '@oe-bcl/bcl-inpage-navigation/inpage-navigation.html.twig' with sidebar only %}
+{% endblock %}
+
+{% block content_bottom %}
+  {% include '@oe-bcl/bcl-subscription-block/subscription-block.html.twig' with subscription only %}
+  {% include '@oe-bcl/bcl-subscription/subscription-modal.html.twig' with modal only %}
+{% endblock %}

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

@@ -0,0 +1,36 @@
+{% spaceless %}
+
+{# Parameters:
+  - title: (string) (default: '')
+  - content: (string) (default: '')
+  - button: (button Object) (default: {})
+#}
+
+{% set _title = title|default(false) %}
+{% set _content = content|default('') %}
+{% set _button = button|default({}) %}
+{% set _modal = modal|default({}) %}
+
+{% if attributes is empty %}
+  {% set attributes = create_attribute() %}
+{% endif %}
+
+{% set attributes = attributes.addClass(['bg-light', 'px-4-5', 'pt-4', 'pb-4-5']) %}
+
+<div
+  {{ attributes }}
+>
+  {% if _title is not empty %}
+    <div class="fs-2 fw-normal">{{ _title }}</div>
+  {% endif %}
+  {% if _content is not empty %}
+    {{ _content }}
+  {% endif %}
+  {% if _button is not empty %}
+    <div class="pb-2">
+    {% include '@oe-bcl/bcl-button/button.html.twig' with _button only %}
+    </div>
+  {% endif %}
+</div>
+
+{% endspaceless %}

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

@@ -10,12 +10,13 @@ Parameters:
     - "to": (integer) (default: items.length) Item index after which to resume displaying timeline items
   - title: (string) (default: "")
   - title_tag: (string) (default: "h2")
+  - title_attributes (drupal attrs)
   - "items" (array) (default: []):
     - "id": (string) (default: '')
     - "label": (string) (default: '')
     - "title": (string) (default: '')
     - "content": (block) (default: '')
-  - "icons_path" (string) (default: ''): file containing the svg icons
+  - "icon_path" (string) (default: ''): file containing the svg icons
 #}
 
 {# Internal properties #}
@@ -23,8 +24,9 @@ Parameters:
 {% set _id = id|default(random(1000)) %}
 {% set _title = title|default('') %}
 {% set _title_tag = title_tag|default('h2') %}
+{% set _title_attributes = title_attributes ?: create_attribute() %}
 {% set _items = items|default([]) %}
-{% set _icons_path = icons_path|default('') %}
+{% set _icon_path = icon_path|default('') %}
 {% set _toggle_collapsed = toggle_collapsed|default('') %}
 {% set _toggle_expanded = toggle_expanded|default('') %}
 {% set _hide_from = hide.from|default(items|length) %}
@@ -57,10 +59,11 @@ Parameters:
 {% endif %}
 
 {% if _title is not empty %}
-  {% set _title_classes = 'fw-bold mb-4' %}
-  <{{ _title_tag }} class="{{ _title_classes }}">
-    {{- _title -}}
-  </{{ _title_tag }}>
+  {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
+    title: _title,
+    title_tag: _title_tag,
+    attributes: _title_attributes,
+  } only %}
 {% endif %}
 
 {# Print the result #}
@@ -100,7 +103,7 @@ Parameters:
             {% include '@oe-bcl/bcl-icon/icon.html.twig' with {
               name: 'chevron-down',
               size: 'fluid',
-              path: _icons_path,
+              path: _icon_path,
               attributes: create_attribute().addClass('ms-2-5'),
             } only %}
           </button>

package/templates/bcl-user/user-view-compact.html.twig

@@ -4,6 +4,7 @@
   - picture (object) format: {
     - "path" (string) (default: '')
     - "alt" (string) (default: '')
+    - "classes": (string) (default: '')
   }
   - name (object) format: {
     - "text" (string) (default: '')
@@ -12,25 +13,31 @@
   - infos (array of strings) (default: [])
 #}
 
+{% set _picture_classes = "rounded-pill" %}
+
 {% if attributes is empty %}
   {% set attributes = create_attribute() %}
 {% endif %}
 
 {% set attributes = attributes.addClass(["d-flex", "mb-3"]) %}
 
+{% if picture is not empty and picture.classes is not empty %}
+  {% set _picture_classes = _picture_classes ~ ' ' ~ picture.classes %}
+{% endif %}
+
 <div
   {{ attributes }}
 >
   <div class="flex-shrink-0">
     <img
-      class="rounded-pill"
+      class="{{ _picture_classes }}"
       src="{{ picture.path }}"
       alt="{{ picture.alt }}"
     >
   </div>
   <div class="flex-grow-1 ms-3">
     {% if name.link is not empty %}
-      <a href="{{ name.link }}" class="fs-5 text-underline-hover mb-0">{{ name.text }}</a>
+      <a href="{{ name.link }}" class="fs-5 standalone mb-0">{{ name.text }}</a>
     {% else %}
       <p class="fs-5 mb-0 text-primary">{{ name.text }}</p>
     {% endif %}

package/templates/bcl-user/user-view.html.twig

@@ -1,16 +1,6 @@
 {% extends "@oe-bcl/bcl-base-templates/content-type.html.twig" %}
 
 {% block content %}
-  <div class="row">
-    <div class="col-12 col-md-10">
-      {% include '@oe-bcl/bcl-card/card.html.twig' with user only %}
-    </div>
-    <div class="col-12 col-md-2 text-end">
-      <div class="d-grid d-md-block">
-        {% include '@oe-bcl/bcl-button/button.html.twig' with edit_button only %}
-      </div>
-    </div>
-  </div>
   <div class="my-3">
     <h3 class="fw-bold mb-4">Personal information</h3>
     <div class="row">