{namespace media=Neos\Media\ViewHelpers}
{namespace neos=Neos\Neos\ViewHelpers}
{namespace vh=Newland\NeosViewHelpers\ViewHelpers}

<f:if condition="{link}">
    <f:then>
        <f:if condition="{neos:rendering.inBackend()}">
            <f:then>
                <div class="c-icon-teaser {color}">
                    <f:render section="icon-teaser-content" arguments="{_all}" />
                </div>
            </f:then>
            <f:else>
                <a href="{link}"
                    class="c-icon-teaser {color}"
                    {f:if(condition: openLinkInNewWindow, then: 'target="_blank" rel="noopener noreferrer"')}>

                    <f:render section="icon-teaser-content" arguments="{_all}" />
                </a>
            </f:else>
        </f:if>
    </f:then>
    <f:else>
        <div class="c-icon-teaser {color}">
            <f:render section="icon-teaser-content" arguments="{_all}" />
        </div>
    </f:else>
</f:if>

<f:section name="icon-teaser-content">
    <div class="c-icon-teaser__content">
        <f:if condition="{icon}">
            <div class="c-icon-teaser__icon">
                {vh:media.inline(image: icon) -> f:format.raw()}
            </div>
        </f:if>

        <f:if condition="{neos:rendering.inBackend()} || {title -> vh:string.notEmpty()}">
            {neos:contentElement.editable(property: 'title', tag: 'h3', class: 'c-icon-teaser__headline')}
        </f:if>

        <f:if condition="{neos:rendering.inBackend()} || {text -> vh:string.notEmpty()}">
            {neos:contentElement.editable(property: 'text', tag: 'p', class: 'c-icon-teaser__text')}
        </f:if>

        <div class="c-icon-teaser__arrow-wrapper">
            <svg class="c-icon-teaser__arrow c-icon c-icon--block" focusable="false">
                <use xlink:href="#icon-arrow-right" />
            </svg>
        </div>
    </div>
</f:section>