{% extends 'page' %}

{% block title %}{{ page.name }}{% endblock %}

{% block content_wrapper_inner %}
  <div class="md:tw-flex tw--mx-4">
    {% if page.image %}
      <div class="tw-px-4 tw-flex-0 tw-w-32 md:tw-w-48">
        <img class="tw-max-w-full" src="/images/speakers/{{ page.image }}" alt="{{ page.name }}">
      </div>
    {% endif %}

    <div class="tw-px-4 tw-flex-1">
      {% if page.links %}
        <div class="tw-flex">
          {% if page.links.drupalorg %}
            <div class="tw-pl-6 tw-mr-4 tw-bg-no-repeat tw-bg-left" style="background-image: url(/themes/dcb2017/images/drop-1.png)">
              <a href="https://www.drupal.org/u/{{ page.links.drupalorg }}">{{ page.links.drupalorg }}</a>
           </div>
          {% endif %}

          {% if page.links.twitter %}
            <div class="tw-pl-6 tw-mr-4 tw-bg-no-repeat tw-bg-left" style="background-image: url(/themes/dcb2017/images/twitter-1.png)">
              <a href="https://twitter.com/{{ page.links.twitter }}">{{ page.links.twitter }}</a>
            </div>
          {% endif %}
        </div>
      {% endif %}

      <div class="markup">
        {% if page.organisation %}
          <b>Organisation</b>: {{ page.organisation }}
        {% endif %}

        {% block content %}{% endblock %}
      </div>
    </div>
  </div>
{% endblock %}

{% block content_bottom %}
    {% include 'speaker-session' with {
      sessions: data.sessions,
      speaker: page
    } %}
  </aside>
{% endblock %}