lujanfernaud/prevy

<div class="row box group-box mt-2rem" id="group-<%= group.id %>">

  <!-- Image -->
  <div class="box-image box-image--orientation-switch card card-inverse
    text-center col-md-4">

    <div class="intrinsic-ratio-container
      intrinsic-ratio-container--orientation-switch">
      <%= link_to group_path(group), class: "d-block" do %>
        <%= image_tag  group.image_base64,
          data: {
            src:       group.samplified_image_url(:thumb),
            srcset: "#{group.samplified_image_url(:medium)} 510w,
                     #{group.samplified_image_url} 730w",
          },
          class: "lazyload blur-up
            intrinsic-ratio-image img-fluid box-image__img
            box-image__img--orientation-switch" %>
      <% end %>
    </div>

  </div><!-- /.box -->

  <div class="box-text box-text--orientation-switch box-text--accented
    card-body col-md-8 d-flex flex-column justify-content-between">

    <!-- Name -->
    <h3 class="h4 mb-0 pb-2 pb-md-0">
      <%= link_to group.name, group_path(group) %>
      <%= group.organizer_tag(current_user) %>
    </h3>

    <!-- Members -->
    <p class="user-group__link mb-0 pb-2 pb-md-0">
      Members: <%= group.members_count %>
      <%= link_to "(See all)", group_members_path(group) %>
    </p>

    <!-- Links -->
    <div class="flex-row">
      <%= group.links(current_user) %>
    </div>

  </div><!-- /.box -->

</div>