hero-teaser

// src/components/patterns/teasers/hero-teaser/hero-teaser.twig

{{ attach_library("circle_dot/pattern-hero-teaser") }}
<article class="HeroTeaser">
	{# Teaser link (stretched to cover entire teaser) #}
	{% if url %}
		<a href="{{ url }}" class="HeroTeaser-link">
			<span class="u-hiddenVisually">{{ heading }}</span>
		</a>
	{% endif %}

	{% if figure %}
		{{ figure }}
	{% elseif image %}
		{{ image }}
	{% endif %}

	<div class="HeroTeaser-content">
		<div class="HeroTeaser-text">
			{% if kicker %}
				<span class="HeroTeaser-kicker">{{ kicker }}</span>
			{% endif %}

			<h2 class="HeroTeaser-heading">{{ heading }}</h2>

			{% if lead_text %}
				<p class="HeroTeaser-lead">{{ lead_text }}</p>
			{% endif %}

			{% if article_infos %}
				<div class="HeroTeaser-meta">
					{{ article_infos }}
				</div>
			{% endif %}
		</div>

		{% if cta_button %}
			<div class="HeroTeaser-cta">
				{{ cta_button }}
			</div>
		{% endif %}
	</div>
</article>