<!-- _toot.ejs -->
<% for(var i = 0; i < messages.length; i++) {%>

  <div class="dark:bg-gray-700 flex p-4 border-b border-b-gray-400">
    <div class="mr-4 flex-shrink-0">
      <img src="/user/avatar/<%- auth.id %>" alt="<%= auth.name %>" class="rounded-md w-12 h-12">
    </div>
    <div>
      <div>
        <h5 class="font-bold mb-4">
          <a href="/user/profile/<%= auth.name %>"><%= auth.name %></a>
        </h5>

        <p>
          <% messages[i].body.split('\n').forEach(line => { %>
            <%= line %><br>
          <% }) %>
        </p>
      </div>
      <div class="text-xs text-gray-500 mt-3">Posted on: <%= messages[i].createdAt %>
      </div>
    </div>
  </div>

  <% } %>