diff --git a/source/_patterns/04-components/multi-type-list/_multi-tab-list-include-content.twig b/source/_patterns/04-components/multi-type-list/_multi-tab-list-include-content.twig
new file mode 100644
index 0000000000000000000000000000000000000000..ba0bfc2b08c2d329d0fef2973482a56d17b2a186
--- /dev/null
+++ b/source/_patterns/04-components/multi-type-list/_multi-tab-list-include-content.twig
@@ -0,0 +1,47 @@
+{% for info in lists[type] %}
+ {% if type == 'Blog' %}
+
+ {% include '@components/teaser/teaser--blog/teaser--blog.twig' with {
+ 'title': info.title,
+ 'url': info.url,
+ 'date': info.date,
+ 'author_name': info.author_name,
+ 'author_link': info.author_link,
+ 'sources': info.sources,
+ 'img_element': info.img_element,
+ 'alt': info.alt,
+ 'tags': info.tags,
+ 'content': info.content
+ } %}
+
+ {% endif%}
+
+ {% if type == 'News' %}
+
+ {% include '@components/teaser/teaser--news/teaser--news.twig' with {
+ 'title': info.title,
+ 'url': info.url,
+ 'date': info.date,
+ 'sources': info.sources,
+ 'img_element': info.img_element,
+ 'alt': info.alt,
+ 'content': info.contnet
+ } %}
+
+ {% endif %}
+
+ {% if type == 'Events' %}
+
+ {% include '@components/teaser/teaser--event/teaser--event.twig' with {
+ 'title': info.title,
+ 'url': info.url,
+ 'date': info.date,
+ 'sources': info.sources,
+ 'img_element': info.img_element,
+ 'alt': info.alt,
+ 'tags': info.tags,
+ 'content': info.content
+ } %}
+
+ {% endif %}
+{% endfor %}
\ No newline at end of file
diff --git a/source/_patterns/04-components/multi-type-list/multi-type-list.twig b/source/_patterns/04-components/multi-type-list/multi-type-list.twig
index 6088a3d20d3f0ec7b6222b1589f8f139686f21de..6ab521d7468523ede7c9a1e1266c6ca2389679da 100644
--- a/source/_patterns/04-components/multi-type-list/multi-type-list.twig
+++ b/source/_patterns/04-components/multi-type-list/multi-type-list.twig
@@ -3,56 +3,37 @@
{% set content_list = content_list|merge([type]) %}
{% endfor %}
-{{ dd(content_list) }}
-
{% embed '@components/tabs/tabs.twig' with {
'content_list': content_list
} %}
{% for type, list in lists %}
-
- {% block content~{{ type }} %}
- {% if type == 'Blog' %}
- {% include '@components/teaser/teaser--blog/teaser--blog.twig' with {
- 'title': content.title,
- 'url': content.url,
- 'date': content.date,
- 'author_name': content.author_name,
- 'author_link': content.author_link,
- 'sources': content.sources,
- 'img_element': content.img_element,
- 'alt': content.alt,
- 'tags': content.tags,
- 'content': content.content
- } %}
- {% endif%}
-
- {% if type == 'News' %}
- {% include '@components/teaser/teaser--news/teaser--news.twig' with {
- 'title': content.title,
- 'url': content.url,
- 'date': content.date,
- 'sources': content.sources,
- 'img_element': content.img_element,
- 'alt': content.alt,
- 'content': content.content
- } %}
- {% endif %}
-
- {% if type == 'Events' %}
- {% include '@components/teaser/teaser--event/teaser--event.twig' with {
- 'title': content.title,
- 'url': content.url,
- 'date': content.date,
- 'sources': content.sources,
- 'img_element': content.img_element,
- 'alt': content.alt,
- 'tags': content.tags,
- 'content': content.content
- } %}
+ {% for info in list %}
+
+ {% if loop.parent.loop.index == 1 %}
+ {% block content_area_1 %}
+ {% include '@components/multi-type-list/_multi-tab-list-include-content.twig' with {
+ 'type': type,
+ 'lists': lists
+ } %}
+ {% endblock %}
+ {% elseif loop.parent.loop.index == 2 %}
+ {% block content_area_2 %}
+ {% include '@components/multi-type-list/_multi-tab-list-include-content.twig' with {
+ 'type': type,
+ 'lists': lists
+ } %}
+ {% endblock %}
+ {% elseif loop.parent.loop.index == 3 %}
+ {% block content_area_3 %}
+ {% include '@components/multi-type-list/_multi-tab-list-include-content.twig' with {
+ 'type': type,
+ 'lists': lists
+ } %}
+ {% endblock %}
{% endif %}
- {% endblock %}
+ {% endfor %}
{% endfor %}
diff --git a/source/_patterns/04-components/multi-type-list/multi-type-list.yml b/source/_patterns/04-components/multi-type-list/multi-type-list.yml
index aa41b0483f9f4a8e0115ba79f9dcffd7cf1f0e91..6b16e08ee3845012e3510d768b12d82e5bb91c0e 100644
--- a/source/_patterns/04-components/multi-type-list/multi-type-list.yml
+++ b/source/_patterns/04-components/multi-type-list/multi-type-list.yml
@@ -251,8 +251,3 @@ lists:
alt: 'Alternative text for blog teaser photo'
content: |-
<p>This is the summary, which can contain <abbr title="Hyper Text Markup Language">HTML</abbr> markup. It should be 600 characters or less.Ea sit vide commodo ancillae, pro eu quidam ancillae offendit. Odio ferri officiis an his, sit id causae partiendo accusamus, has discere expetendis ne. Per at wisi homero voluptaria, vis vidit ornatus vituperatoribus no. Labores maiestatis mei ad, cum cu exerci appareat.</p>
-
-content_list:
- - blogs
- - events
- - news
\ No newline at end of file
diff --git a/source/_patterns/04-components/tabs/tabs.twig b/source/_patterns/04-components/tabs/tabs.twig
index 20c4027ce49be9fcbfb131a9f7159b0e552348dd..b53e73c554e35d5c6df414a72fdef7ab66d35293 100644
--- a/source/_patterns/04-components/tabs/tabs.twig
+++ b/source/_patterns/04-components/tabs/tabs.twig
@@ -2,6 +2,8 @@
button button--large {{ modifier_classes }}
{%- endset %}
+{% block something %}
+{% endblock %}
<div class="uw-tabs">
<div class="uw-tab" role="tablist" aria-label="Multi-tab-list">
@@ -14,9 +16,27 @@
<h2 class="hide-js"> {{ type }}</h2>
<div id="{{ type }}" class="uw-tabcontent" role="tabpanel" tabindex="0" aria-labelledby="tab-{{ loop.index }}" {% if loop.index > 1 %} hidden {% endif %} >
- {% block content-{{ type }} %}
- Content content content
+ {% if loop.index == 1 %}
+ {% block content_area_1 %}
+ Content area 1
{% endblock %}
+ {% elseif loop.index == 2 %}
+ {% block content_area_2 %}
+ Content area 2
+ {% endblock %}
+ {% elseif loop.index == 3 %}
+ {% block content_area_3 %}
+ Content area 3
+ {% endblock %}
+ {% elseif loop.index == 4 %}
+ {% block content_area_4 %}
+ Content area 4
+ {% endblock %}
+ {% elseif loop.index == 5 %}
+ {% block content_area_5 %}
+ Content area 5
+ {% endblock %}
+ {% endif %}
</div>
{% endfor %}