socialbase-1.1.0/templates/group/group--teaser.html.twig

{#
/**
 * @file
 * Default theme implementation to display a group.
 *
 * Available variables:
 * - group: The group entity with limited access to object properties and
 *   methods. Only "getter" methods (method names starting with "get", "has",
 *   or "is") and a few common methods such as "id" and "label" are available.
 *   Calling other methods (such as group.delete) will result in an exception.
 * - label: The title of the group.
 * - content: All group items. Use {{ content }} to print them all,
 *   or print a subset such as {{ content.field_example }}. Use
 *   {{ content|without('field_example') }} to temporarily suppress the
 *   printing of a given child element.
 * - url: Direct URL of the current group.
 * - attributes: HTML attributes for the containing element.
 *   The attributes.class element may contain one or more of the following
 *   classes:
 *   - group: The current template type (also known as a "theming hook").
 *   - group--[type]: The current group type. For example, if the group is a
 *     "Classroom" it would result in "group--classroom". Note that the machine
 *     name will often be in a short form of the human readable label.
 *   - group--[view_mode]: The View Mode of the group; for example, a
 *     teaser would result in: "group--teaser", and full: "group--full".
 * - title_attributes: Same as attributes, except applied to the main title
 *   tag that appears in the template.
 * - content_attributes: Same as attributes, except applied to the main
 *   content tag that appears in the template.
 * - title_prefix: Additional output populated by modules, intended to be
 *   displayed in front of the main title tag that appears in the template.
 * - title_suffix: Additional output populated by modules, intended to be
 *   displayed after the main title tag that appears in the template.
 * - view_mode: View mode; for example, "teaser" or "full".
 * - page: Flag for the full page state. Will be true if view_mode is 'full'.
 *
 * @see template_preprocess_group()
 *
 * @ingroup themeable
 */
#}

{{ attach_library('socialbase/teaser')}}

{%
  set classes = [
  'card',
  'teaser',
  not content.field_group_image|render ? 'no-image'
]
%}

<div{{ attributes.addClass(classes) }}>

  <div class='teaser__image'>
    {% block card_image %}
      {{ content.field_group_image }}
    {% endblock %}

    {% block card_teaser_type %}
      <a href="{{ url }}" title="{% trans %}Group: &nbsp; {{- label|render|striptags|trim -}}{% endtrans %}" aria-hidden="true">
        <div class="teaser__teaser-type">
          <svg class="teaser__teaser-type-icon">
            <title id="group-{{ group.id.value }}">{% trans %}Group: &nbsp; {{- label|render|striptags|trim -}}{% endtrans %}</title>
            {% if group_type_icon %}
              <use xlink:href="#{{- group_type_icon -}}"></use>
            {% else %}
              <use xlink:href="#icon-group-white"></use>
            {% endif %}
          </svg>
        </div>
      </a>
    {% endblock %}
  </div>

  <div class='teaser__body'>
    <div class="teaser__content">

      {% block card_title %}
        {{ title_prefix }}
        <h4{{ title_attributes }} class="teaser__title">
          {% if closed_group_lock %}
            <svg class="icon-gray icon-small" aria-hidden="true">
              <title>{% trans %}Closed group{% endtrans %}</title>
              <use xlink:href="#icon-lock"></use>
            </svg>
          {% elseif secret_group_shield %}
            <svg class="icon-gray icon-small" aria-hidden="true">
              <title>{% trans %}Secret group{% endtrans %}</title>
              <use xlink:href="#icon-shield"></use>
            </svg>
          {% endif %}
          <a href="{{ url }}" rel="bookmark">{{ label }}</a>
        </h4>
        {{ title_suffix }}
      {% endblock %}

      {% block card_body %}
        <div class="teaser__content-line">
          <svg class="teaser__content-type-icon" aria-hidden="true">
            <title>{% trans %}Type of group{% endtrans %}</title>
            <use xlink:href="#icon-label"></use>
          </svg>
          <span class="teaser__content-text">
            <span class="sr-only">{% trans %}The group type is{% endtrans %}</span>
            {{ group_type }}
          </span>
        </div>
        {% if content.field_group_location|render or content.field_group_address|render %}
          <div class="teaser__content-line">
              <svg class="teaser__content-type-icon" aria-hidden="true">
                <title>{% trans %}Located at{% endtrans %}</title>
                  <use xlink:href="#icon-location"></use>
              </svg>
            <span class="teaser__content-text">
          <span class="sr-only">{% trans %}Located at: {% endtrans %}</span>
          {{ content.field_group_location }}
              {% if content.field_group_location|render is not empty and content.field_group_address|render is not empty %}
                <span class="sr-only">, </span>
                <span aria-hidden="true"> &bullet; </span>
              {% endif %}
              {{ content.field_group_address }}
            </span>
          </div>
        {% endif %}
      {% endblock %}
    </div>

    <div class="card__actionbar">
      {% block card_actionbar %}

        {% if group_members is not empty %}
          <div class="badge teaser__badge">
            <span class="badge__container">
              <svg class="badge__icon" aria-hidden="true">
                <title>{% trans %}Number of group members{% endtrans %}</title>
                <use xlink:href="#icon-group"></use>
              </svg>
              <span class="badge__label">
                {{ group_members }}
                <span class="sr-only"> {% trans %}group members{% endtrans %} </span>
              </span>
            </span>
          </div>
        {% endif %}

        {% if joined %}
          <span class="badge teaser__badge badge-default">
            {% trans with {'context': 'Is a member'} %}You have joined{% endtrans %}
          </span>
        {% endif %}

        <a href="{{ url }}" class="card__link" title="{{ label }}">
          {% trans %}Read more{% endtrans %}
          <span class="visually-hidden">{% trans %}about {{ label }}{% endtrans %} </span>
        </a>

      {% endblock %}
    </div>

  </div>
</div>