lujanfernaud/prevy

<div class="container-fluid bg-light">
  <div class="container latest-topics-container topics-container mb-2rem pb-1">

    <div class="row mt-2">
      <div class="col-md-12 mb-2">

        <h2 class="text-center pb-2">
          Latest Topics
        </h2>

        <div class="box topics-box mt-2rem box p-2">

          <div class="row p-3">
            <div class="col-md-12">

              <% unless topics && topics.empty? %>

                <%= render partial: "groups/topics/topic_row",
                  as: :topic, collection: topics,
                  locals: { topics: topics, group: group }, cached: true %>

              <% else %>

                <p class="lead text-center mt-1 mb-4 pb-1">
                  This looks better with some topics. Why not creating one? :)
                </p>

                <hr class="topic-separator">

              <% end %>

            </div>
          </div><!-- ./row -->

          <div class="latest-topics__buttons row">
            <div class="col text-center">
              <% if group.topics_count > 5 %>
                <%= link_to "See all topics", group_topics_path(group),
                  class: "all-topics-btn btn btn-outline-primary btn-lg" %>
              <% end %>

              <%= link_to "Submit a new topic", new_group_topic_path(group),
                  class: "new-topic-btn new-topic-btn--latest-topics
                    btn btn-primary btn-lg" %>
            </div>
          </div>

        </div>

      </div>
    </div>

  </div>
</div>