{% extends "node--featured.html.twig" %}

{% block card_title %}

  <div class="teaser__header">

    {{ title_prefix.teaser_tag }}

    {% if visibility_icon and visibility_label %}
      <div class="badge teaser__badge no-padding">
        <span class="badge__container">
          <svg class="badge__icon">
            <title>{% trans %} Type of content {% endtrans %}</title>
            <use xlink:href="#icon-{{ visibility_icon }}"></use>
          </svg>
          <span class="sr-only">{% trans %}The visibility of this content is set to {{ visibility_label }}{% endtrans %} </span>
          <span class="badge__label text-gray">{{ visibility_label|capitalize }}</span>
        </span>
      </div>
    {% endif %}
  </div>

  {{ title_prefix|without('teaser_tag') }}
  <h4{{ title_attributes }} class="teaser__title">
    <a href="{{ url }}" rel="bookmark">{{ label }}</a>
  </h4>
  {{ title_suffix }}

{% endblock %}

{% block card_body %}

  <small class="text-muted teaser__not-icon">
    {% if display_submitted %}
      {% embed "node--teaser__field.html.twig" %}
        {%- block field_icon -%} account_circle {%- endblock -%}
        {%- block svg_title -%}
          <title>{% trans %}Created on{% endtrans %}</title>
        {%- endblock -%}
        {%- block field_value %}
          <div class="teaser__published">
            <span class="sr-only">{% trans %}Created on{% endtrans %}</span>
            <div class="teaser__published-date">{{ date }} <span aria-hidden="true">&bullet;</span></div>
            <span class="sr-only"> {% trans %}by{% endtrans %} </span>
            <div class="teaser__published-author">{{ author }}</div>
          </div>
        {%- endblock -%}
      {% endembed %}
    {% endif %}
  </small>

{% endblock %}

{% block card_actionbar %}

  {% if comment_count %}
    <a href="{{ url }}#section-comments" class="badge teaser__badge"
       title="{% trans %}Total amount of comments{% endtrans %}">
      <span class="badge__container">
        <svg class="badge__icon" aria-hidden="true">
          <title>{% trans %}Total amount of comments{% endtrans %}</title>
          <use xlink:href="#icon-comment"></use>
        </svg>
        <span class="badge__label">{{ comment_count }}</span>
      </span>
    </a>
  {% endif %}

  {% if likes_count is not empty %}
    <div class="badge teaser__badge">
      <span class="badge__container">
        <svg class="badge__icon">
          <title>{% trans %}Total amount of likes{% endtrans %}</title>
          <use xlink:href="#icon-like"></use>
        </svg>
        <span class="badge__label">
          {{ likes_count }}
        </span>
      </span>
    </div>
  {% endif %}

  {% block card_link %}
    {{ parent() }}
  {% endblock %}

{% endblock %}
