vital-edu/sala-de-espera

<div id="carousel" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <% @images.each_with_index do |image, index| %>
      <li data-target="#carousel" data-slide-to="<%= index %>" class="<%= 'active' if index == 0 %>"></li>
    <% end %>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <% @images.each_with_index do |image, index| %>
      <div class="item <%= 'active' if index == 0 %>">
        <%= image_tag "carousel/#{image.split('/').last}" %>
      </div>
    <% end %>
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="right carousel-control" href="#carousel" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>

<div class="container">
  <h2 class="text-center"> Serviços </h2>

  <div class="row">
    <% @service_category.each do |service| %>
      <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">
        <div class="thumbnail">
          <%= image_tag service.image.url, class: 'service-category-thumb' %>
          <div class="caption">
            <h3><%= service.name %></h3>
            <p><%= service.description %></p>
          </div>
        </div>
      </div>
    <% end %>
  </div>
</div>