Skip to content

Commit

Permalink
Merge pull request #1191 from openeuropa/EWPP-2506-fixes
Browse files Browse the repository at this point in the history 
EWPP-2506: Add classes to identify the last item per column.
  • Loading branch information
@22Alexandra
22Alexandra authored Oct 31, 2022
2 parents 140e795 + 29b36cd commit 8d58126
Show file tree
Hide file tree
Showing 13 changed files with 296 additions and 318 deletions.
24 changes: 21 additions & 3 deletions templates/compositions/ec-component-content-item-block/content-item-block.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,17 +65,35 @@
{% if vertical %}
{% set items_per_column = _items|length/_type %}
{% for column in _items|batch(items_per_column) %}
<div class="ecl-content-item-block__item ecl-u-mb-s {{ _extra_classes_item }}">
{% set last_item_column_css = "" %}
{% set last_item_css = "" %}
{% if loop.last %}
{% set last_item_css = "last-item" %}
{% endif %}
<div class="ecl-content-item-block__item ecl-u-mb-l {{ _extra_classes_item }} vertical">
{% for _item in column %}
<div class="ecl-content-item-block__item ecl-u-mb-s">
{% if loop.last %}
{% set last_item_column_css = "last-item-column" %}
{% if last_item_css is not empty %}
{% set last_item_column_css = last_item_column_css ~ " " ~ last_item_css %}
{% endif %}
{% endif %}
<div class="ecl-content-item-block__item ecl-u-mb-l {{ last_item_column_css }}">
{{ _item }}
</div>
{% endfor %}
</div>
{% endfor %}
{% else %}
{% for _item in _items %}
<div class="ecl-content-item-block__item ecl-u-mb-s {{ _extra_classes_item }}">
{% set last_item_column_css = "" %}
{% if loop.index > _items|length - _type %}
{% set last_item_column_css = "last-item-column" %}
{% endif %}
{% if loop.last %}
{% set last_item_column_css = last_item_column_css ~ " last-item" %}
{% endif %}
<div class="ecl-content-item-block__item ecl-u-mb-l {{ _extra_classes_item }} {{ last_item_column_css }}">
{{ _item }}
</div>
{% endfor %}
Expand Down
5 changes: 5 additions & 0 deletions templates/patterns/list_item/list_item.ui_patterns.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,3 +163,8 @@ list_item:
label: "Divider"
description: "Optional divider below the item."
preview: true
lists_variant:
type: "string"
label: "Lists variant"
description: "An optional parameter for the layout of the lists (vertical or horizontal). It defaults to horizontal."
preview: "vertical"
4 changes: 2 additions & 2 deletions templates/patterns/list_item/pattern-list-item.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -153,9 +153,9 @@
}]) %}
{% endif %}
{% endfor %}
{# Always use the horizontal variant of ECL Description list component for this pattern. #}
{# Use the horizontal variant of ECL Description list component by default. #}
{% set _lists = _lists|merge([{
variant: "horizontal",
variant: lists_variant|default("horizontal"),
items: items,
}]) %}
{% endfor %}
Expand Down
3 changes: 2 additions & 1 deletion templates/patterns/tag/pattern-tag.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
'type': tag_type,
'path': url,
'label': label,
}
},
'extra_classes': extra_classes
} %}
{% endif %}
5 changes: 5 additions & 0 deletions templates/patterns/tag/tag.ui_patterns.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,8 @@ tag:
label: "Label"
description: "Tag label"
preview: "Tag 1"
extra_classes:
type: 'text'
label: 'Extra classes string'
description: 'Extra classes string'
preview: ''
170 changes: 79 additions & 91 deletions tests/src/Kernel/CallForProposalsRenderTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,6 @@
use Drupal\node\Entity\Node;
use Drupal\node\NodeInterface;
use Drupal\Tests\oe_theme\PatternAssertions\ListItemAssert;
use Drupal\Tests\oe_theme\PatternAssertions\FieldListAssert;
use Drupal\Tests\oe_theme\PatternAssertions\PatternAssertState;
use Drupal\Tests\user\Traits\UserCreationTrait;
use Symfony\Component\DomCrawler\Crawler;

Expand Down Expand Up @@ -114,26 +112,24 @@ public function testTeaser(): void {
],
'image' => NULL,
'lists' => [
new PatternAssertState(new FieldListAssert(), [
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '14 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Single-stage',
], [
'label' => 'Deadline date',
'body' => '21 February 2020',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '14 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Single-stage',
], [
'label' => 'Deadline date',
'body' => '21 February 2020',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
]),
],
],
];
$assert->assertPattern($expected_values, $html);
Expand All @@ -160,26 +156,24 @@ public function testTeaser(): void {
$build = $this->nodeViewBuilder->view($node, 'teaser');
$html = $this->renderRoot($build);
$expected_values['lists'] = [
new PatternAssertState(new FieldListAssert(), [
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '14 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Two-stage',
], [
'label' => 'Deadline dates',
'body' => "21 February 2020\n | 22 February 2020",
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '14 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Two-stage',
], [
'label' => 'Deadline dates',
'body' => "21 February 2020\n | 22 February 2020",
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
]),
],
];
$assert->assertPattern($expected_values, $html);

Expand All @@ -203,26 +197,24 @@ public function testTeaser(): void {
],
];
$expected_values['lists'] = [
new PatternAssertState(new FieldListAssert(), [
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '14 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Multiple cut-off',
], [
'label' => 'Deadline date',
'body' => '17 February 2020',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '14 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Multiple cut-off',
], [
'label' => 'Deadline date',
'body' => '17 February 2020',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
]),
],
];
$assert->assertPattern($expected_values, $html);

Expand All @@ -245,26 +237,24 @@ public function testTeaser(): void {
'variant' => 'medium',
];
$expected_values['lists'] = [
new PatternAssertState(new FieldListAssert(), [
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '24 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Single-stage',
], [
'label' => 'Deadline date',
'body' => '21 February 2020',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Opening date',
'body' => '24 February 2020',
], [
'label' => 'Deadline model',
'body' => 'Single-stage',
], [
'label' => 'Deadline date',
'body' => '21 February 2020',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
]),
],
];
$assert->assertPattern($expected_values, $html);

Expand All @@ -284,20 +274,18 @@ public function testTeaser(): void {
$html = $this->renderRoot($build);
$expected_values['badges'][0] = [];
$expected_values['lists'] = [
new PatternAssertState(new FieldListAssert(), [
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Deadline model',
'body' => 'Permanent',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
'items' => [
[
'label' => 'Reference',
'body' => 'Call for proposals reference',
], [
'label' => 'Deadline model',
'body' => 'Permanent',
], [
'label' => 'Funding programme',
'body' => 'Arab Common Market',
],
]),
],
];
$assert->assertPattern($expected_values, $html);
}
Expand Down
Loading

0 comments on commit 8d58126

Please sign in to comment.