<% content_for :title, 'Trips' %>

<div class="w-full my-5">
  <div id="trips" class="min-w-full">
    <div class="flex justify-between items-center">
      <h1 class="font-bold text-4xl">Trips</h1>
      <%= link_to 'New trip', new_trip_path, class: 'btn btn-primary' %>
    </div>

    <% if @trips.empty? %>
      <div class="hero min-h-80 bg-base-200">
        <div class="hero-content text-center">
          <div class="max-w-md">
            <h1 class="text-5xl font-bold">Hello there!</h1>
            <p class="py-6">
              Here you'll find your trips, but now there are none. Let's <%= link_to 'create one', new_trip_path, class: 'link' %>!
            </p>
          </div>
        </div>
      </div>
    <% else %>
      <div class="flex justify-center my-5">
        <div class='flex'>
          <%= paginate @trips %>
        </div>
      </div>

      <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 my-4">
        <% @trips.each do |trip| %>
          <%= render 'trip', trip: trip %>
        <% end %>
      </div>
    <% end %>
  </div>
</div>
