{namespace ttaddr=FriendsOfTYPO3\TtAddress\ViewHelpers}

<f:section name="address">
    <f:if condition="{address.address}">
        <div class="address" itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
            <address>
                <span itemprop="streetAddress">{address.address}</span><br>
                <span itemprop="postalCode">{address.zip}</span>&nbsp;<span
                    itemprop="addressLocality">{address.city}</span><br>
                <span itemprop="addressCountry">{address.country}</span>
            </address>
        </div>
    </f:if>
</f:section>

<f:section name="position">
    <f:if condition="{address.position}">
        <p class="jobTitle" itemprop="jobTitle"><em>{address.position}</em></p>
    </f:if>
</f:section>

<f:section name="contact">
    <ul class="list-unstyled">
        <f:if condition="{address.phone}">
            <li>
                <i class="fas fa-phone"></i>
                {f:translate(key:'label.telephone')}: <a href="tel:{address.cleanedPhone}">
                <span itemprop="telephone">{address.phone}</span>
            </a>
            </li>
        </f:if>

        <f:if condition="{address.mobile}">
            <li>
                <i class="fas fa-mobile-alt"></i>
                {f:translate(key:'label.mobile')}: <a href="tel:{address.cleanedMobile}">
                <span itemprop="telephone">{address.mobile}</span>
            </a>
            </li>
        </f:if>

        <f:if condition="{address.fax}">
            <li>
                <i class="fas fa-fax"></i>
                {f:translate(key:'label.fax')}: <span itemprop="faxNumber">{address.fax}</span>
            </li>
        </f:if>

        <f:if condition="{address.email}">
            <li>
                <i class="fas fa-envelope"></i>
                {f:translate(key:'label.email')}:
                <span><f:link.email email="{address.email}" /></span>
            </li>
        </f:if>

        <f:if condition="{address.www}">
            <meta itemprop="url" content="{f:uri.typolink(parameter:address.www)}"/>
            <li>
                <i class="fas fa-link"></i>
                {f:translate(key:'label.www')}:
                <f:link.typolink parameter="{address.www}">{address.wwwSimplified}</f:link.typolink>
            </li>
        </f:if>
        <f:if condition="{address.birthday}">
            <meta itemprop="birthDate" content="{address.birthday -> f:format.date(format:'%Y-%m-%d')}">
            <li>
                <i class="fas fa-birthday-cake"></i>
                {f:translate(key:'label.birthday')}: {address.birthday -> f:format.date(format:'%d.%m.%Y')}
            </li>
        </f:if>
    </ul>
</f:section>

<f:section name="social">
    <f:if condition="{address.twitter} || {address.facebook} || {address.linkedin} || {address.linkedincompany} || {address.whatsapp} || {address.bluesky} || {address.youtubechannel}">
        <ul class="list-inline">
            <f:if condition="{address.twitter}">
                <li class="list-inline-item">
                    <i class="fab fa-x-twitter" aria-hidden title="{f:translate(key:'label.twitter')}"></i>
                    <span class="sr-only">{f:translate(key:'label.twitter')}:</span>
                    <a href="https://twitter.com/{address.twitter}" target="_blank">{address.twitter}</a>
                    <meta itemprop="sameAs" content="https://twitter.com/{address.twitter}"/>
                </li>
            </f:if>
            <f:if condition="{address.facebook}">
                <li class="list-inline-item">
                    <i class="fab fa-facebook" aria-hidden title="{f:translate(key:'label.facebook')}"></i>
                    <span class="sr-only">{f:translate(key:'label.facebook')}:</span>
                    <a href="https://www.facebook.com/{address.facebook}" target="_blank">{address.facebook}</a>
                    <meta itemprop="sameAs" content="https://www.facebook.com/{address.facebook}"/>
                </li>
            </f:if>
            <f:if condition="{address.linkedin}">
                <li class="list-inline-item">
                    <i class="fab fa-linkedin" aria-hidden title="{f:translate(key:'label.linkedin')}"></i>
                    <span class="sr-only">{f:translate(key:'label.linkedin')}:</span>
                    <a href="https://www.linkedin.com/in/{address.linkedin}" target="_blank">{address.linkedin}</a>
                    <meta itemprop="sameAs" content="https://www.linkedin.com/in/{address.linkedin}"/>
                </li>
            </f:if>
            <f:if condition="{address.linkedincompany}">
                <li class="list-inline-item">
                    <i class="fab fa-linkedin" aria-hidden title="{f:translate(key:'label.linkedin')}"></i>
                    <span class="sr-only">{f:translate(key:'label.linkedin')}:</span>
                    <a href="https://www.linkedin.com/company/{address.linkedincompany}" target="_blank">{address.linkedincompany}</a>
                    <meta itemprop="sameAs" content="https://www.linkedin.com/company/{address.linkedincompany}"/>
                </li>
            </f:if>
            <f:if condition="{address.whatsapp}">
                <li class="list-inline-item">
                    <i class="fab fa-whatsapp" aria-hidden title="{f:translate(key:'label.whatsapp')}"></i>
                    <span class="sr-only">{f:translate(key:'label.whatsapp')}:</span>
                    <a href="https://wa.me/{address.whatsapp}">{address.whatsapp}</a>
                    <meta itemprop="sameAs" content="https://wa.me/{address.whatsapp}"/>
                </li>
            </f:if>
            <f:if condition="{address.bluesky}">
                <li class="list-inline-item">
                    <i class="fab fa-bluesky" aria-hidden title="{f:translate(key:'label.bluesky')}"></i>
                    <span class="sr-only">{f:translate(key:'label.bluesky')}:</span>
                    <a href="https://bsky.app/profile/{address.bluesky}" target="_blank">{address.bluesky}</a>
                    <meta itemprop="sameAs" content="https://bsky.app/profile/{address.bluesky}"/>
                </li>
            </f:if>
            <f:if condition="{address.youtubechannel}">
                <li class="list-inline-item">
                    <i class="fab fa-youtube" aria-hidden title="{f:translate(key:'label.youtubechannel')}"></i>
                    <span class="sr-only">{f:translate(key:'label.youtubechannel')}:</span>
                    <a href="https://www.youtube.com/{address.youtubechannel}" target="_blank">{address.youtubechannel}</a>
                    <meta itemprop="sameAs" content="https://www.youtube.com/{address.youtubechannel}"/>
                </li>
            </f:if>
        </ul>
    </f:if>
</f:section>