{namespace neos=Neos\Neos\ViewHelpers}
{namespace media=Neos\Media\ViewHelpers}
{namespace theme=Newland\BaseTheme\ViewHelpers}

<div class="o-container o-container--md {marginTop}">
    <figure class="c-image-text">
        <noscript>
            <img src="{neos.media:uri.image(image: image, maximumWidth: 240)}"
                 alt="{image.caption}"
                 loading="lazy" />

        </noscript>
        <img data-src="{neos.media:uri.image(image: image, maximumWidth: 240)}"
             alt="{image.caption}"
             class="lazyload" />

        <figcaption>
            <neos:contentElement.editable property="title" class="c-image-text__name" tag="h3" />
            <neos:contentElement.editable property="subtitle" class="c-image-text__subtitle" tag="p" />
            <neos:contentElement.editable property="text" class="c-text" tag="p" />

            <f:if condition="{neos:rendering.inBackend()}">
                <f:then>
                    <p>Telefon {neos:contentElement.editable(property: 'phone', class: 'c-image-text__phone', tag: 'span')}</p>
                    {neos:contentElement.editable(property: 'email', class: 'c-image-text__email', tag: 'p')}
                </f:then>
                <f:else>
                    <f:if condition="{phone}">
                        <p>Tel. <a class="c-image-text__phone" href="tel:{phone -> theme:format.phoneNumber()}">{phone}</a></p>
                    </f:if>
                    <f:if condition="{email}">
                        <f:link.email email="{email}" class="c-image-text__email" />
                    </f:if>
                </f:else>
            </f:if>

        </figcaption>
    </figure>
</div>