{% macro info(icon, label, value) %}
{% if value %}
<div class="flex row middle vt-5-in">
    <i class="icon min flex row middle center">
        <i class="h6 fa fa-{{icon}} warning"></i>
    </i>
    {% if isDesktop() %}
    <span class="success medium nowrap third_5">{{label}} :</span>
    {% endif %}
    <span class="{{desktop('left-20 ')}} {{mobile('left-7 vt-3')}}">{{value}}</span>
</div>
{% endif %}
{% endmacro %}

{% macro link(icon, label, value) %}
{% if value %}
<div class="flex row middle vt-5-in">
    <i class="icon min flex row middle center">
        <i class="h6 fa fa-{{icon}} warning"></i>
    </i>
    {% if isDesktop() %}
    <span class="success medium nowrap third_5">{{label}} :</span>
    {% endif %}
    <a class="{{desktop('left-20 ')}} {{mobile('left-7 vt-3')}}" href="{{value}}" target="_blank">{{value}}</a>
</div>
{% endif %}
{% endmacro %}

{% macro render(o, alt = false) %}

<article class="struct anim-scroll anim-from-bottom shadow relative bg-gray flex col {{desktop('w100 vt-40 padding-40 radius-20')}} {{mobile('w100 vt-20 padding-20 radius-10')}}">
    <h2 class="h5 semibold success {{desktop('')}} {{mobile('')}}">{{o.name}}</h2>
    <div class="flex row space {{desktop('top-10')}} {{mobile('col left')}}">
        <div class="top-10">
            {{_self.info("map-marker-alt","Ville"|os_trans("Town"),o.town)}}
            {{_self.info("map-pin","Adresse"|os_trans("Address"),o.address)}}
            {{_self.info("phone","Téléphone(s)"|os_trans("Phone(s)"),o.phone ?? os_param("contacts").phone)}}
            {{_self.info("envelope","E-mail",o.email ?? os_param("contacts").email)}}
        </div>
        <div class="flex row middle space {{desktop('top-20 left-40 ')}}{{mobile('top-10')}}">
            {% if o.longitude and o.latitude %}
            <a class="bg-success flex center middle {{desktop('col vt-25-in hz-30-in radius-5')}} {{mobile('row vt-10-in hz-20-in radius-3')}}" href='https://maps.google.com/?q={{o.latitude}},{{o.longitude}}' target='_blank' title="Localiser avec Google Maps">
                <i class="h5 fa fa-map-marker-alt white"></i>
                <span class='bold white {{desktop('top-20')}} {{mobile('left-10')}}'>
                    {{"Localiser"|os_trans("Localise")}}
                </span>
            </a>
            {% endif %}
        </div>
    </div>
</article>
{% endmacro %}