{% set classes = [
    'experience',
    company.logo ? 'has-logo',
    experience.featured ? 'is-featured',
] %}

<div class="{{ classes|sort|join(' ') }}">
    <div class="inner">
        <h2>{{ company.name }}</h2>

        {% if company.website %}
            <a href="{{ company.website }}" class="experience__website">
                {{ company.website }}
            </a>
        {% endif %}

        <div class="experience__role">
            {% spaceless %}
                {{ experience.role ~ ' from ' ~ experience.start ~ ' to ' ~ experience.end|default('Present') }}
                {% if experience.location %}
                    ({{ experience.location }})
                {% endif %}
            {% endspaceless %}.
        </div>

        <div class="experience__description">
            {{ experience.description|raw }}
        </div>
    </div>{# /.inner #}

    {% if company.logo %}
        <div class="experience__logo">
            <img src="{{ site.images_url }}/assets/images/experience/{{ company.logo }}" alt="{{ company.name }} logo">
        </div>
    {% endif %}
</div>