@openeuropa/bcl-theme-default 0.21.0 → 0.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/css/oe-bcl-default.css +379 -365
  2. package/css/oe-bcl-default.css.map +1 -1
  3. package/css/oe-bcl-default.min.css +1 -1
  4. package/css/oe-bcl-default.min.css.map +1 -1
  5. package/js/oe-bcl-default.bundle.js +3 -3
  6. package/js/oe-bcl-default.bundle.js.map +1 -1
  7. package/js/oe-bcl-default.bundle.min.js +1 -1
  8. package/js/oe-bcl-default.bundle.min.js.map +1 -1
  9. package/js/oe-bcl-default.esm.js +3 -3
  10. package/js/oe-bcl-default.esm.js.map +1 -1
  11. package/js/oe-bcl-default.esm.min.js +1 -1
  12. package/js/oe-bcl-default.esm.min.js.map +1 -1
  13. package/js/oe-bcl-default.umd.js +3 -3
  14. package/js/oe-bcl-default.umd.js.map +1 -1
  15. package/js/oe-bcl-default.umd.min.js +1 -1
  16. package/js/oe-bcl-default.umd.min.js.map +1 -1
  17. package/package.json +5 -5
  18. package/src/js/gallery/gallery.js +3 -3
  19. package/src/scss/_gallery.scss +7 -0
  20. package/src/scss/base/_colors.scss +17 -6
  21. package/src/scss/base/_utilities.scss +9 -0
  22. package/templates/bcl-alert/alert.html.twig +9 -1
  23. package/templates/bcl-banner/banner.html.twig +16 -9
  24. package/templates/bcl-description-list/description-list.html.twig +7 -4
  25. package/templates/bcl-fact-figures/fact-figures.html.twig +6 -2
  26. package/templates/bcl-file/file.html.twig +8 -5
  27. package/templates/bcl-form/form.html.twig +7 -4
  28. package/templates/bcl-gallery/gallery.html.twig +9 -6
  29. package/templates/bcl-heading/heading.html.twig +42 -0
  30. package/templates/bcl-links-block/links-block.html.twig +8 -2
  31. package/templates/bcl-listing/listing.html.twig +7 -4
  32. package/templates/bcl-project/project-lists.html.twig +67 -0
  33. package/templates/bcl-project/project.html.twig +53 -70
  34. package/templates/bcl-project-status/project-contributions.html.twig +56 -0
  35. package/templates/bcl-project-status/project-status.html.twig +14 -44
  36. package/templates/bcl-timeline/timeline.html.twig +7 -4
@@ -5,96 +5,79 @@
5
5
  {% endblock %}
6
6
 
7
7
  {% block content %}
8
-
9
- {% if project_status.main_title is not empty %}
10
- <h3
11
- class="fw-bold mb-4"
12
- {% if project_status.main_title_id is not empty %}
13
- id="{{ project_status.main_title_id }}"
14
- {% endif %}
15
- >{{- project_status.main_title -}}</h3>
8
+ {% if project_status_title is not empty %}
9
+ {% set _project_title_attributes = create_attribute().addClass(['fw-bold', 'mb-4']) %}
10
+ {% if project_status_id is not empty %}
11
+ {% set _project_title_attributes = _project_title_attributes.setAttribute('id', project_status_id) %}
12
+ {% endif %}
13
+ {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
14
+ title: project_status_title,
15
+ title_tag: 'h3',
16
+ attributes: _project_title_attributes,
17
+ } only %}
16
18
  {% endif %}
17
- {% include '@oe-bcl/bcl-project-status/project-status.html.twig' with project_status %}
18
-
19
- {% if status_lists.main_title is not empty %}
20
- <h3
21
- class="fw-bold my-4"
22
- {% if status_lists.main_title_id is not empty %}
23
- id="{{ status_lists.main_title_id }}"
24
- {% endif %}
25
- >{{- status_lists.main_title -}}</h3>
19
+ {% if project_status is not empty %}
20
+ {% include '@oe-bcl/bcl-project-status/project-status.html.twig' with project_status %}
26
21
  {% endif %}
27
- {% if status_lists.listing is defined and status_lists.listing is not empty %}
28
- {% for lists in status_lists.listing %}
29
- {% if lists.title is not empty %}
30
- <h4 class="fw-bold mb-3">{{ lists.title }}</h4>
31
- {% endif %}
32
- {% for list in lists.content %}
33
- {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with list only %}
34
- {% endfor %}
35
- {% endfor %}
22
+ {% if project_contributions is not empty %}
23
+ {% include '@oe-bcl/bcl-project-status/project-contributions.html.twig' with project_contributions %}
36
24
  {% endif %}
37
25
 
38
- {% if first_paragraphs is defined and first_paragraphs is not empty %}
39
- {% for paragraph in first_paragraphs %}
40
- <h3
41
- class="fw-bold mb-4 pt-3"
42
- id="{{ paragraph.title_id }}"
43
- >
44
- {{- paragraph.title -}}
45
- </h3>
26
+ {% if status_lists is not empty %}
27
+ {% include '@oe-bcl/bcl-project/project-lists.html.twig' with status_lists only %}
28
+ {% endif %}
46
29
 
47
- {{- paragraph.content -}}
30
+ {% if first_paragraphs is defined and first_paragraphs is not empty %}
31
+ {% for _paragraph in first_paragraphs %}
32
+ {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
33
+ title: _paragraph.title,
34
+ title_tag: 'h3',
35
+ attributes: create_attribute().addClass(['fw-bold', 'mb-4', 'pt-3'])
36
+ .setAttribute('id', _paragraph.title_id),
37
+ } only %}
38
+ {{- _paragraph.content -}}
48
39
  {% endfor %}
49
40
  {% endif %}
50
41
 
51
- {% if content_lists.main_title is not empty %}
52
- <h3
53
- class="fw-bold my-4"
54
- {% if content_lists.main_title_id is not empty %}
55
- id="{{ content_lists.main_title_id }}"
56
- {% endif %}
57
- >{{- content_lists.main_title -}}</h3>
42
+ {% if featured_lists is not empty %}
43
+ {% include '@oe-bcl/bcl-project/project-lists.html.twig' with featured_lists only %}
58
44
  {% endif %}
59
- {% if content_lists.listing is defined and content_lists.listing is not empty %}
60
- {% for lists in content_lists.listing %}
61
- {% if lists.title is not empty %}
62
- <h4 class="fw-bold mb-3">{{ lists.title }}</h4>
63
- {% endif %}
64
- {% for list in lists.content %}
65
- {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with list only %}
66
- {% endfor %}
67
- {% endfor %}
45
+
46
+ {% if content_lists is not empty %}
47
+ {% include '@oe-bcl/bcl-project/project-lists.html.twig' with content_lists only %}
68
48
  {% endif %}
69
49
 
70
50
  {% if second_paragraphs is defined and second_paragraphs is not empty %}
71
- {% for paragraph in second_paragraphs %}
72
- <h3
73
- class="fw-bold mb-4 pt-2"
74
- id="{{ paragraph.title_id }}"
75
- >
76
- {{- paragraph.title -}}
77
- </h3>
78
- {{- paragraph.content -}}
51
+ {% for _paragraph in second_paragraphs %}
52
+ {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
53
+ title: _paragraph.title,
54
+ title_tag: 'h3',
55
+ attributes: create_attribute().addClass(['fw-bold', 'mb-4', 'pt-3'])
56
+ .setAttribute('id', _paragraph.title_id),
57
+ } only %}
58
+ {{- _paragraph.content -}}
79
59
  {% endfor %}
80
60
  {% endif %}
81
61
 
82
62
  {% if gallery.main_title is not empty %}
83
- <h3
84
- class="fw-bold my-4"
85
- {% if gallery.main_title_id is not empty %}
86
- id="{{ gallery.main_title_id }}"
87
- {% endif %}
88
- >{{- gallery.main_title -}}</h3>
63
+ {% set _gallery_title_attributes = create_attribute().addClass(['fw-bold', 'my-4']) %}
64
+ {% if gallery.main_title_id is not empty %}
65
+ {% set _gallery_title_attributes = _gallery_title_attributes.setAttribute('id', gallery.main_title_id) %}
66
+ {% endif %}
67
+ {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
68
+ title: gallery.main_title,
69
+ title_tag: 'h3',
70
+ attributes: _gallery_title_attributes,
71
+ } only %}
89
72
  {% endif %}
90
- {% if gallery.listing is defined and gallery.listing is not empty %}
73
+ {% if gallery.items is defined and gallery.items is not empty %}
91
74
  <div class="mt-3">
92
- {% for showcase in gallery.listing %}
75
+ {% for _showcase in gallery.items %}
93
76
  <div class="mb-2-5 pb-4">
94
- {% if showcase.carousel %}
95
- {% include '@oe-bcl/bcl-carousel/carousel.html.twig' with showcase only %}
77
+ {% if _showcase.carousel %}
78
+ {% include '@oe-bcl/bcl-carousel/carousel.html.twig' with _showcase only %}
96
79
  {% else %}
97
- {% include '@oe-bcl/bcl-featured-media/featured-media.html.twig' with showcase only %}
80
+ {% include '@oe-bcl/bcl-featured-media/featured-media.html.twig' with _showcase only %}
98
81
  {% endif %}
99
82
  </div>
100
83
  {% endfor %}
@@ -0,0 +1,56 @@
1
+ {% spaceless %}
2
+
3
+ {# Parameters:
4
+ - corporate_contributions (string) (default: '') // value every 5 percent
5
+ - legend (boolean or object (default: false)
6
+ - chart (boolean) (default: false)
7
+
8
+ Blocks -
9
+ project_status_contrib_chart
10
+ project_status_contrib_legend
11
+ #}
12
+
13
+ {% set _corporate_contributions = corporate_contributions|default('') %}
14
+ {% set _legend = legend|default(false) %}
15
+ {% set _chart = chart|default(false) %}
16
+
17
+ {% if attributes is empty %}
18
+ {% set attributes = create_attribute() %}
19
+ {% endif %}
20
+
21
+ {% set attributes = attributes.addClass([
22
+ 'bcl-project-contributions',
23
+ 'border-bottom',
24
+ 'pb-4',
25
+ 'mb-4'
26
+ ]) %}
27
+
28
+ <div {{ attributes }}>
29
+ <div class="row">
30
+
31
+ {% if _chart is not empty %}
32
+ <div class="bcl-project-contributions-chart col-5 col-md-3">
33
+ {% block project_status_contrib_chart %}
34
+ <div class="circular-progress" data-percentage="{{ _corporate_contributions }}">
35
+ <span class="circular-progress-left">
36
+ <span class="circular-progress-bar"></span>
37
+ </span>
38
+ <span class="circular-progress-right">
39
+ <span class="circular-progress-bar"></span>
40
+ </span>
41
+ </div>
42
+ {% endblock %}
43
+ </div>
44
+ {% endif %}
45
+
46
+ {% if _legend is not empty %}
47
+ <div class="bcl-project-contributions-legend col-7 col-md-9 align-self-center">
48
+ {% block project_status_contrib_legend %}
49
+ {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with _legend only %}
50
+ {% endblock %}
51
+ </div>
52
+ {% endif %}
53
+ </div>
54
+ </div>
55
+
56
+ {% endspaceless %}
@@ -1,9 +1,6 @@
1
1
  {% spaceless %}
2
2
 
3
3
  {# Parameters:
4
- - title_id (string) (default: "")
5
- - title (string) (default: "")
6
- - title_tag (string) (default: "h3")
7
4
  - status (string) (default: 'planned')
8
5
  - start_date (string) (default: '')
9
6
  - start_label (string) (default: '')
@@ -12,16 +9,9 @@
12
9
  - label (string) (default: '')
13
10
  - badge (string) (default: ''),
14
11
  - progress (string) (default: '')
15
- - corporate_contribution (string) (default: '') // value every 5 percent
16
- - chart_legend (object) (default: {})
17
-
18
- Blocks - chart
19
12
  #}
20
13
 
21
- {% set _title_id = title_id|default('') %}
22
- {% set _title = title|default('') %}
23
14
  {% set _label = label|default('') %}
24
- {% set _title_tag = title_tag|default('h3') %}
25
15
  {% set _status = status|default('planned') %}
26
16
  {% set _charts = charts|default('') %}
27
17
  {% set _badge = badge|default('') %}
@@ -30,8 +20,17 @@
30
20
  {% set _start_label = start_label|default('') %}
31
21
  {% set _end_label = end_label|default('') %}
32
22
  {% set _progress = progress|default('') %}
33
- {% set _corporate_contribution = corporate_contribution|default('') %}
34
- {% set _chart_legend = chart_legend|default({}) %}
23
+
24
+ {% if attributes is empty %}
25
+ {% set attributes = create_attribute() %}
26
+ {% endif %}
27
+
28
+ {% set attributes = attributes.addClass([
29
+ 'bcl-project-status',
30
+ 'border-bottom',
31
+ 'pb-4',
32
+ 'mb-4'
33
+ ]) %}
35
34
 
36
35
  {% set _bgs = {
37
36
  ongoing: 'info',
@@ -40,17 +39,7 @@
40
39
  } %}
41
40
  {% set _bg = _bgs[_status]|default('secondary') %}
42
41
 
43
-
44
- <{{ _title_tag }}
45
- class="fw-bold mb-4"
46
- {% if title_id is not empty %}
47
- id="{{ title_id }}"
48
- {% endif %}
49
- >
50
- {{- title -}}
51
- </{{ _title_tag }}>
52
-
53
- <div class="border-bottom pb-4 mb-4">
42
+ <div {{ attributes }}>
54
43
  <div class="row">
55
44
  <div class="col-12 col-md-3">
56
45
  {% if _label is not empty %}
@@ -103,26 +92,7 @@
103
92
  </div>
104
93
  </div>
105
94
  </div>
106
- {% if _corporate_contribution is not empty and _chart_legend is not empty %}
107
- <div class="border-bottom pb-4 mb-4">
108
- {% block chart %}
109
- <div class="row">
110
- <div class="col-5 col-md-3">
111
- <div class="circular-progress" data-percentage="{{ _corporate_contribution }}">
112
- <span class="circular-progress-left">
113
- <span class="circular-progress-bar"></span>
114
- </span>
115
- <span class="circular-progress-right">
116
- <span class="circular-progress-bar"></span>
117
- </span>
118
- </div>
119
- </div>
120
- <div class="col-7 col-md-9 align-self-center">
121
- {% include '@oe-bcl/bcl-description-list/description-list.html.twig' with _chart_legend only %}
122
- </div>
123
- </div>
124
- {% endblock %}
125
- </div>
126
- {% endif %}
95
+
96
+
127
97
 
128
98
  {% endspaceless %}
@@ -10,6 +10,7 @@ Parameters:
10
10
  - "to": (integer) (default: items.length) Item index after which to resume displaying timeline items
11
11
  - title: (string) (default: "")
12
12
  - title_tag: (string) (default: "h2")
13
+ - title_attributes (drupal attrs)
13
14
  - "items" (array) (default: []):
14
15
  - "id": (string) (default: '')
15
16
  - "label": (string) (default: '')
@@ -23,6 +24,7 @@ Parameters:
23
24
  {% set _id = id|default(random(1000)) %}
24
25
  {% set _title = title|default('') %}
25
26
  {% set _title_tag = title_tag|default('h2') %}
27
+ {% set _title_attributes = title_attributes ?: create_attribute() %}
26
28
  {% set _items = items|default([]) %}
27
29
  {% set _icon_path = icon_path|default('') %}
28
30
  {% set _toggle_collapsed = toggle_collapsed|default('') %}
@@ -57,10 +59,11 @@ Parameters:
57
59
  {% endif %}
58
60
 
59
61
  {% if _title is not empty %}
60
- {% set _title_classes = 'fw-bold mb-4' %}
61
- <{{ _title_tag }} class="{{ _title_classes }}">
62
- {{- _title -}}
63
- </{{ _title_tag }}>
62
+ {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
63
+ title: _title,
64
+ title_tag: _title_tag,
65
+ attributes: _title_attributes,
66
+ } only %}
64
67
  {% endif %}
65
68
 
66
69
  {# Print the result #}