Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UHF-9738: news article content type #945

Merged
merged 2 commits into from
Apr 11, 2024
Merged

UHF-9738: news article content type #945

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
792c54b
UHF-9738: Change hero to use reusable component, add news article tem…
teroelonen Apr 9, 2024
aa4dcc6
UHF-9738: Move the news article templates to away from hdbt
teroelonen Apr 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
86 changes: 86 additions & 0 deletions templates/component/hero.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
{#
{% embed '@hdbt/component/hero.twig' with {
design: content.field_hero_design[0]['#markup'],
title: content.field_hero_title,
description: content.field_hero_desc,
image: content.field_hero_image,
} %}
{% endembed %}
#}

{% if design == "background-image" %}
{% set design_class = "hero--with-image-bottom" %}
{% elseif design == "diagonal" %}
{% set design_class = "hero--diagonal" %}
{% elseif design == "with-image-bottom" %}
{% set design_class = "hero--with-image-bottom" %}
{% elseif design == "with-image-left" %}
{% set design_class = "hero--with-image-left" %}
{% elseif design == "with-image-right" %}
{% set design_class = "hero--with-image-right" %}
{% elseif design == "without-image-center" %}
{% set design_class = "hero--without-image-left" %}
{% elseif design == "without-image-left" %}
{% set design_class = "hero--without-image-left" %}
{% elseif design == "with-search" %}
{% set design_class = "hero--with-search" %}
{% endif %}


{% set hero_wrapper_attributes = {
'class': [
'hero',
design_class ? design_class,
]
} %}

<div{{ create_attribute(hero_wrapper_attributes) }}>
{% embed "@hdbt/misc/container.twig" with {container_element: 'hero'} %}
{% block container_content %}
<div class="hero__text-content">
{# Hyphenate the visible title, but share to screen readers unhyphenated version as for example NVDA reads hyphenated text poorly #}
<h1 class="hero__title hyphenate" aria-labelledby="page_title">{{ title }}</h1>
<span class="is-hidden" id="page_title">{{ title }}</span>

{% if design == "with-search"%}
{% include "@hdbt/component/helfi-search-form.twig" with {
label: 'What are you looking for?'|t({}, {'context': 'Header and hero search label'}),
search_id: 'hero',
} %}
{% endif %}

{% if description|render|striptags|trim is not empty %}
{% if
design == "without-image-left" or
design == "without-image-center" or
design == "with-image-right" or
design == "with-image-left" or
design == "with-image-bottom" or
design == "diagonal"
%}
<div class="hero__description user-edited-content">
{{ description }}
</div>
{% endif %}
{% endif %}
</div>
<span class="hero__arrow" aria-hidden="true"></span>
{% endblock %}
{% endembed %}

{% if
design == "with-image-right" or
design == "with-image-left" or
design == "with-image-bottom" or
design == "diagonal" or
design == "with-search"
%}
{% if image|render %}
<div class="hero__image-container">
{% include '@hdbt/misc/koro.twig' with {koro: koro, flip: true } %}
{{ image }}
</div>
{% endif %}
{% endif %}
{% include '@hdbt/misc/koro.twig' with {koro: koro, flip: false } %}
</div>
36 changes: 36 additions & 0 deletions templates/misc/news-footer.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
{# Links and links title #}
{% if content.field_news_item_links_link|render %}
<div class="content-links">

{% if content.field_news_item_links_title|render %}
<div class="content-links__title">
{{ content.field_news_item_links_title }}
</div>
{% endif %}

<ul class="content-links__links">
{% for key in content.field_news_item_links_link['#items']|keys %}
<li class="content-links__links__link">{{ content.field_news_item_links_link[key] }}</li>
{% endfor %}
</ul>
</div>
{% endif %}

{# Social media share links #}
{{ drupal_block('helfi_platform_config_social_sharing_block') }}

{# Tags #}
{% include "@hdbt/misc/news-tags.twig" with
{
tags: content.field_news_item_tags,
neighbourhoods: content.field_news_neighbourhoods,
groups: content.field_news_groups,
}
%}

{# Radioactivity #}
{% if content.field_radioactivity|render %}
<section class="content-radioactive">
{{ content.field_radioactivity }}
</section>
{% endif %}
37 changes: 1 addition & 36 deletions templates/module/helfi-news-item/node--news-item.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,42 +58,7 @@
{{ content.field_content }}
{% endif %}

{# Links and links title #}
{% if content.field_news_item_links_link|render %}
<div class="content-links">

{% if content.field_news_item_links_title|render %}
<div class="content-links__title">
{{ content.field_news_item_links_title }}
</div>
{% endif %}

<ul class="content-links__links">
{% for key in content.field_news_item_links_link['#items']|keys %}
<li class="content-links__links__link">{{ content.field_news_item_links_link[key] }}</li>
{% endfor %}
</ul>
</div>
{% endif %}

{# Social media share links #}
{{ drupal_block('helfi_platform_config_social_sharing_block') }}

{# Tags #}
{% include "@hdbt/misc/news-tags.twig" with
{
tags: content.field_news_item_tags,
neighbourhoods: content.field_news_neighbourhoods,
groups: content.field_news_groups,
}
%}

{# Radioactivity #}
{% if content.field_radioactivity|render %}
<section class="content-radioactive">
{{ content.field_radioactivity }}
</section>
{% endif %}
{% include '@hdbt/misc/news-footer.twig' %}

{% endblock main_content %}

Expand Down
82 changes: 7 additions & 75 deletions templates/paragraphs/paragraph--hero.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,80 +1,12 @@
{% set design = content.field_hero_design[0]['#markup'] %}
{% set description = content.field_hero_desc %}

{% if design == "background-image" %}
{% set design_class = "hero--with-image-bottom" %}
{% elseif design == "diagonal" %}
{% set design_class = "hero--diagonal" %}
{% elseif design == "with-image-bottom" %}
{% set design_class = "hero--with-image-bottom" %}
{% elseif design == "with-image-left" %}
{% set design_class = "hero--with-image-left" %}
{% elseif design == "with-image-right" %}
{% set design_class = "hero--with-image-right" %}
{% elseif design == "without-image-center" %}
{% set design_class = "hero--without-image-left" %}
{% elseif design == "without-image-left" %}
{% set design_class = "hero--without-image-left" %}
{% elseif design == "with-search" %}
{% set design_class = "hero--with-search" %}
{% endif %}

{%
set classes = [
'hero',
design_class ? design_class,
]
%}

{% block paragraph %}
<div{{ attributes.addClass(classes) }}>
{% embed "@hdbt/misc/container.twig" with {container_element: 'hero'} %}
{% block container_content %}
<div class="hero__text-content">
{# Hyphenate the visible title, but share to screen readers unhyphenated version as for example NVDA reads hyphenated text poorly #}
<h1 class="hero__title hyphenate" aria-labelledby="page_title">{{ content.field_hero_title }}</h1>
<span class="is-hidden" id="page_title">{{ content.field_hero_title }}</span>

{% if design == "with-search"%}
{% include "@hdbt/component/helfi-search-form.twig" with {
label: 'What are you looking for?'|t({}, {'context': 'Header and hero search label'}),
search_id: 'hero',
} %}
{% endif %}

{% if description[0]['#text'] is not empty %}
{% if
design == "without-image-left" or
design == "without-image-center" or
design == "with-image-right" or
design == "with-image-left" or
design == "with-image-bottom" or
design == "diagonal"
%}
<div class="hero__description user-edited-content">
{{ description }}
</div>
{% endif %}
{% endif %}
</div>
<span class="hero__arrow" aria-hidden="true"></span>
{% endblock %}
{% endembed %}

{% if
design == "with-image-right" or
design == "with-image-left" or
design == "with-image-bottom" or
design == "diagonal" or
design == "with-search"
%}
{% if content.field_hero_image|render %}
<div class="hero__image-container">
{% include '@hdbt/misc/koro.twig' with {koro: koro, flip: true } %}
{{ content.field_hero_image }}
</div>
{% endif %}
{% endif %}
{% include '@hdbt/misc/koro.twig' with {koro: koro, flip: false } %}
</div>
{% embed '@hdbt/component/hero.twig' with {
design: content.field_hero_design[0]['#markup'],
title: content.field_hero_title,
description: content.field_hero_desc,
image: content.field_hero_image,
} %}
{% endembed %}
{% endblock paragraph %}
Loading