group--hero.html.twig in Open Social 8.2

Default theme implementation for profiles.

Available variables:

• content: Items for the content of the profile. Use 'content' to print them all, or print a subset such as 'content.title'. Use the following code to exclude the printing of a given child element:

  {{ content|without('title') }}
  

• attributes: HTML attributes for the wrapper.
• profile: The profile object.
• url: The profile URL.

File

themes/socialbase/templates/group/group--hero.html.twig

{#
/**
 * @file
 *
 * Default theme implementation for profiles.
 *
 * Available variables:
 * - content: Items for the content of the profile.
 *   Use 'content' to print them all, or print a subset such as
 *   'content.title'. Use the following code to exclude the
 *   printing of a given child element:
 *   @code
 *   {{ content|without('title') }}
 *   @endcode
 * - attributes: HTML attributes for the wrapper.
 * - profile: The profile object.
 * - url: The profile URL.
 *
 * @ingroup themeable
 */
#}
{{ attach_library('socialbase/hero')}}

{%
  set cover_classes = [
    'cover',
    group_hero_styled_image_url ? 'cover-img cover-img-gradient',
  ]
%}

<div{{ attributes.addClass(cover_classes) }} {% if group_hero_styled_image_url %} style="background-image: url('{{ group_hero_styled_image_url }}');" {% endif %}>
  <div class="hero__bgimage-overlay"></div>
  {% if group_edit_url %}
    <div class="hero-action-button">
      <a href="{{ group_edit_url }}"  title="Edit group" class="btn btn-default btn-floating">
        <svg class="icon-gray icon-medium">
          <use xlink:href="#icon-edit"></use>
        </svg>
      </a>
    </div>
  {% endif %}
  <div class="cover-wrap">
    <header class="page-title">
      <h1>{{ content.label }}</h1>
      <p>
        {% if closed_group_lock %}
          <span>{% trans %}Closed group{% endtrans %}</span> &bullet;
        {% endif %}
        <span>
          {% trans %}1 member {% plural group_members %} @count members{% endtrans %}
        </span>
      </p>
    </header>
    <footer class="hero-footer">
      <div class="hero-footer__text">
        {% if content.field_group_location|render is not empty and content.field_group_address|render is not empty %}
          <svg class="hero-footer-icon">
            <use xlink:href="#icon-location"></use>
          </svg>
        {% endif %}
        <span class="inline-center">
          {{ content.field_group_location }}
          {% if content.field_group_location|render is not empty and content.field_group_address|render is not empty %} &bullet;{% endif %}
          {{ content.field_group_address }} </span>
      </div>

      {% if group_operations_url %}
        <div class="hero-footer__cta">
          <div class="btn-group">
            {% if joined %}
              <button type="button" autocomplete="off" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-accent btn-lg btn-raised dropdown-toggle">{% trans %}Joined{% endtrans %}<span class="caret"></span></button>
              <ul class="dropdown-menu dropdown-menu-right">
                <li><a href="{{ group_operations_url }}">{% trans %}Leave group{% endtrans %}</a></li>
              </ul>
            {% elseif closed_group %}
              <a href="{{ group_operations_url }}" class="btn btn-accent btn-lg btn-raised dropdown-toggle disabled" title="{{ cta }}">{{ cta }}</a>
            {% else %}
              <a href="{{ group_operations_url }}" class="btn btn-accent btn-lg btn-raised dropdown-toggle" title="Join">{% trans %}Join{% endtrans %}</a>
            {% endif %}
          </div>
        </div>
      {% endif %}
    </footer>
  </div> {# cover-wrap #}
</div> {# cover #}