{{!-- 
    Represents a single related content teaser tile
    
    Related JS module(s): relatedContentModule.js
--}}
<div class="ld-layout-item__wrapper" {{~#if isAnimated}}data-aos="fade-up"{{/if}}>
    <div data-id="{{teaserId}}" class="teaser">
        
        {{!-- Teaser Image --}}
        {{~#if teaserImageName}}
            <div class="image-wrapper {{#if isVideoTeaser}}image-wrapper--video{{/if}}">
                {{~#if linkUrl}}<a href="{{linkUrl}}">{{/if}}
                <img src="{{teaserImageName}}_16x9w320.{{teaserImageExt}}"
                     srcset="{{teaserImageName}}_16x9w320.{{teaserImageExt}} 320w,{{teaserImageName}}_16x9w640.{{teaserImageExt}} 640w,{{teaserImageName}}_16x9w960.{{teaserImageExt}} 960w,{{teaserImageName}}_16x9w1920.{{teaserImageExt}} 1920w"
                     sizes="(min-width:1280px) 395px, (min-width:960px) 31vw, (min-width:640px) 47.5vw, 95vw"
                     title="Image Title"
                     alt="Image Alt Text">
                {{#if isVideoTeaser}}<span class="image-wrapper__media-icon"></span>{{/if}}
                {{~#if linkUrl}}</a>{{/if}}
            </div>
        {{/if}}

        {{!-- Teaser info text and links --}}
        <div class="teaser__content-wrapper">
            {{~#if teaserTitle}}
                <h3>
                    {{~#if linkUrl}}
                        {{!-- If no link is defined for the teaser, only the text will be displayed --}}
                        <a {{#unless disabled}} href="{{#if linkUrl}}{{linkUrl}}{{else}}#123{{/if}}" {{/unless~}}
                                                class="textlink">
                            {{~#if linkText}}{{linkText}}{{/if~}}</a>
                    {{else}}
                        {{linkText}}
                    {{/if}}
                </h3>
            {{/if}}
            <div class="teaser__text-wrapper">
                {{~#if summaryText}}
                    <p>{{summaryText}}</p>
                {{/if}}
                {{~#if linkUrl}}
                        {{!-- If no link is defined for the teaser, only the text will be displayed --}}
                    <a {{#unless disabled}} href="{{#if linkUrl}}{{linkUrl}}{{else}}#123{{/if}}" {{/unless~}}
                                            class="textlink">
                        {{~#if linkText}}{{linkText}}{{/if~}}</a>
                {{/if}}
            </div>
        </div>
    </div>
</div>